@ecodev/natural 42.4.2 → 44.0.1

package/fesm2020/ecodev-natural.mjs

@@ -1,72 +1,72 @@
 import '@angular/localize/init';
 import * as i0 from '@angular/core';
-import { Directive, Component, Inject, Injectable, HostBinding, HostListener, InjectionToken, Input, NgModule, EventEmitter, ChangeDetectionStrategy, Output, ContentChildren, Pipe, TemplateRef, ViewEncapsulation, ViewChild, Injector, Optional, Self, ContentChild, PLATFORM_ID, ErrorHandler } from '@angular/core';
-import { Subject, BehaviorSubject, of, timer, EMPTY, Observable, ReplaySubject, forkJoin, merge as merge$1, asyncScheduler, catchError, first as first$1 } from 'rxjs';
-import * as i5 from '@angular/forms';
-import { FormGroup, FormArray, Validators, FormControl, FormsModule, FormControlDirective, FormControlName, ReactiveFormsModule } from '@angular/forms';
+import { Directive, Component, Inject, Injectable, HostBinding, HostListener, InjectionToken, Input, NgModule, EventEmitter, ChangeDetectionStrategy, Output, ContentChildren, Pipe, TemplateRef, ViewEncapsulation, ViewChild, Injector, Optional, Self, ContentChild, createEnvironmentInjector, createComponent, PLATFORM_ID, ErrorHandler } from '@angular/core';
+import { Subject, BehaviorSubject, of, timer, EMPTY, Observable, first as first$1, combineLatest, ReplaySubject, forkJoin, merge as merge$1, asyncScheduler, catchError } from 'rxjs';
+import * as i3 from '@angular/forms';
+import { FormGroup, FormArray, Validators, UntypedFormGroup, UntypedFormArray, UntypedFormControl, FormsModule, FormControl, FormControlDirective, FormControlName, ReactiveFormsModule } from '@angular/forms';
 import * as i2$1 from '@angular/router';
 import { Router, ActivatedRoute, NavigationEnd, RouterModule, NavigationError, DefaultUrlSerializer } from '@angular/router';
 import { merge, isObject, isArray, pickBy, isEmpty, cloneDeep, uniq, groupBy, mergeWith, defaultsDeep, omit, kebabCase, clone, pick, isEqual, defaults, intersection, flatten, differenceWith } from 'lodash-es';
-import * as i1$1 from '@angular/material/dialog';
+import * as i1 from '@angular/material/dialog';
 import { MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog';
-import * as i1 from '@angular/material/button';
+import * as i4 from '@angular/material/button';
 import { MatButtonModule } from '@angular/material/button';
 import * as i2 from '@angular/material/snack-bar';
 import { MatSnackBarModule } from '@angular/material/snack-bar';
 import { switchMap, map, first, filter, finalize, takeUntil, take, tap, takeWhile, debounceTime, shareReplay, mergeMap, startWith, distinctUntilChanged, throttleTime } from 'rxjs/operators';
-import * as i3$2 from '@angular/material/table';
+import * as i7$2 from '@angular/material/table';
 import { MatTableDataSource, MatTableModule } from '@angular/material/table';
 import { DataSource, SelectionModel } from '@angular/cdk/collections';
-import * as i1$2 from 'apollo-angular';
+import * as i1$1 from 'apollo-angular';
 import { gql } from 'apollo-angular';
 import { NetworkStatus } from '@apollo/client/core';
-import * as i1$8 from '@angular/material/core';
+import * as i1$7 from '@angular/material/core';
 import { NativeDateAdapter, ErrorStateMatcher, MatRipple, MAT_DATE_FORMATS, MatRippleModule } from '@angular/material/core';
-import * as i6 from '@angular/common';
+import * as i1$3 from '@angular/common';
 import { CommonModule, DatePipe, DOCUMENT, isPlatformBrowser } from '@angular/common';
-import * as i1$4 from '@angular/material/menu';
+import * as i3$1 from '@angular/material/menu';
 import { MatMenuModule } from '@angular/material/menu';
-import * as i2$3 from '@angular/material/checkbox';
+import * as i5 from '@angular/material/checkbox';
 import { MatCheckboxModule } from '@angular/material/checkbox';
-import * as i1$3 from '@angular/material/icon';
+import * as i1$2 from '@angular/material/icon';
 import { MatIconModule } from '@angular/material/icon';
 import * as i2$2 from '@angular/platform-browser';
-import * as i10 from '@angular/material/tooltip';
+import * as i7 from '@angular/material/tooltip';
 import { MatTooltipModule } from '@angular/material/tooltip';
-import * as i1$5 from '@angular/material/tabs';
-import * as i2$4 from '@angular/material/form-field';
+import * as i1$4 from '@angular/material/tabs';
+import * as i4$2 from '@angular/material/form-field';
 import { MatFormFieldModule, MAT_FORM_FIELD_DEFAULT_OPTIONS } from '@angular/material/form-field';
-import * as i7 from '@angular/material/input';
+import * as i5$1 from '@angular/material/input';
 import { MatInputModule } from '@angular/material/input';
-import * as i2$5 from '@angular/material/select';
+import * as i4$4 from '@angular/material/select';
 import { MatSelectModule } from '@angular/material/select';
-import * as i4 from '@angular/material/list';
+import * as i4$3 from '@angular/material/list';
 import { MatSelectionList, MatListModule } from '@angular/material/list';
-import * as i1$7 from '@angular/cdk/overlay';
+import * as i1$6 from '@angular/cdk/overlay';
 import { OverlayConfig, OverlayModule } from '@angular/cdk/overlay';
-import * as i3 from '@angular/cdk/portal';
+import * as i4$1 from '@angular/cdk/portal';
 import { BasePortalOutlet, CdkPortalOutlet, ComponentPortal, PortalModule } from '@angular/cdk/portal';
 import { trigger, state, style, transition, sequence, query, animate, group } from '@angular/animations';
-import * as i1$6 from '@angular/cdk/a11y';
-import * as i1$9 from '@angular/material/autocomplete';
+import * as i1$5 from '@angular/cdk/a11y';
+import * as i2$3 from '@angular/material/autocomplete';
 import { MatAutocompleteTrigger, MatAutocompleteModule } from '@angular/material/autocomplete';
 import { coerceBooleanProperty } from '@angular/cdk/coercion';
-import * as i5$1 from '@angular/material/progress-spinner';
+import * as i7$1 from '@angular/material/progress-spinner';
 import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
 import { FlatTreeControl, CdkTreeModule } from '@angular/cdk/tree';
-import * as i4$1 from '@angular/material/tree';
+import * as i5$2 from '@angular/material/tree';
 import { MatTreeFlattener, MatTreeFlatDataSource, MatTreeModule } from '@angular/material/tree';
 import * as i8 from '@angular/material/chips';
 import { MatChipsModule } from '@angular/material/chips';
-import * as i4$2 from '@angular/material/datepicker';
+import * as i6 from '@angular/material/datepicker';
 import { MatDatepickerModule } from '@angular/material/datepicker';
-import * as i3$1 from '@angular/flex-layout';
-import * as i6$1 from '@angular/material/paginator';
+import * as i3$2 from '@angular/flex-layout';
+import * as i9 from '@angular/material/paginator';
 import { MatPaginatorModule } from '@angular/material/paginator';
-import * as i2$6 from '@angular/material/sidenav';
+import * as i3$3 from '@angular/material/sidenav';
 import { MatSidenavContainer, MatSidenav, MatSidenavModule } from '@angular/material/sidenav';
 import { Md5 } from 'ts-md5';
-import * as i1$a from '@angular/common/http';
+import * as i1$8 from '@angular/common/http';
 import { HttpHeaders, HttpClientModule } from '@angular/common/http';
 
 /**
@@ -90,9 +90,9 @@ class NaturalAbstractController {
         window.history.back();
     }
 }
-NaturalAbstractController.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalAbstractController, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-NaturalAbstractController.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.0", type: NaturalAbstractController, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalAbstractController, decorators: [{
+NaturalAbstractController.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalAbstractController, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+NaturalAbstractController.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.1.1", type: NaturalAbstractController, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalAbstractController, decorators: [{
             type: Directive
         }], ctorParameters: function () { return []; } });
 
@@ -101,9 +101,9 @@ class NaturalConfirmComponent {
         this.data = data;
     }
 }
-NaturalConfirmComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalConfirmComponent, deps: [{ token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
-NaturalConfirmComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: NaturalConfirmComponent, selector: "ng-component", ngImport: i0, template: "<h2 mat-dialog-title>{{ data.title }}</h2>\n<mat-dialog-content\n    ><p class=\"mat-body\">{{ data.message }}</p></mat-dialog-content\n>\n<mat-dialog-actions>\n    <button [mat-dialog-close]=\"false\" mat-button>{{ data.cancelText }}</button>\n    <button [mat-dialog-close]=\"true\" mat-stroked-button cdkFocusInitial>{{ data.confirmText }}</button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-content{max-width:40em}mat-dialog-actions{display:flex;justify-content:flex-end}mat-dialog-actions>*{margin-left:10px}\n"], components: [{ type: i1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i1$1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1$1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i1$1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }, { type: i1$1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalConfirmComponent, decorators: [{
+NaturalConfirmComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalConfirmComponent, deps: [{ token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
+NaturalConfirmComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: NaturalConfirmComponent, selector: "ng-component", ngImport: i0, template: "<h2 mat-dialog-title>{{ data.title }}</h2>\n<mat-dialog-content\n    ><p class=\"mat-body\">{{ data.message }}</p></mat-dialog-content\n>\n<mat-dialog-actions>\n    <button [mat-dialog-close]=\"false\" mat-button>{{ data.cancelText }}</button>\n    <button [mat-dialog-close]=\"true\" mat-stroked-button cdkFocusInitial>{{ data.confirmText }}</button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-content{max-width:40em}mat-dialog-actions{display:flex;justify-content:flex-end}mat-dialog-actions>*{margin-left:10px}\n"], dependencies: [{ kind: "directive", type: i1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "component", type: i4.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalConfirmComponent, decorators: [{
             type: Component,
             args: [{ template: "<h2 mat-dialog-title>{{ data.title }}</h2>\n<mat-dialog-content\n    ><p class=\"mat-body\">{{ data.message }}</p></mat-dialog-content\n>\n<mat-dialog-actions>\n    <button [mat-dialog-close]=\"false\" mat-button>{{ data.cancelText }}</button>\n    <button [mat-dialog-close]=\"true\" mat-stroked-button cdkFocusInitial>{{ data.confirmText }}</button>\n</mat-dialog-actions>\n", styles: ["mat-dialog-content{max-width:40em}mat-dialog-actions{display:flex;justify-content:flex-end}mat-dialog-actions>*{margin-left:10px}\n"] }]
         }], ctorParameters: function () { return [{ type: undefined, decorators: [{
@@ -152,14 +152,14 @@ class NaturalAlertService {
         return dialog.afterClosed();
     }
 }
-NaturalAlertService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalAlertService, deps: [{ token: i1$1.MatDialog }, { token: i2.MatSnackBar }], target: i0.ɵɵFactoryTarget.Injectable });
-NaturalAlertService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalAlertService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalAlertService, decorators: [{
+NaturalAlertService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalAlertService, deps: [{ token: i1.MatDialog }, { token: i2.MatSnackBar }], target: i0.ɵɵFactoryTarget.Injectable });
+NaturalAlertService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalAlertService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalAlertService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
                 }]
-        }], ctorParameters: function () { return [{ type: i1$1.MatDialog }, { type: i2.MatSnackBar }]; } });
+        }], ctorParameters: function () { return [{ type: i1.MatDialog }, { type: i2.MatSnackBar }]; } });
 
 class NaturalAbstractPanel extends NaturalAbstractController {
     constructor() {
@@ -198,9 +198,9 @@ class NaturalAbstractPanel extends NaturalAbstractController {
         }
     }
 }
-NaturalAbstractPanel.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalAbstractPanel, deps: null, target: i0.ɵɵFactoryTarget.Directive });
-NaturalAbstractPanel.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.0", type: NaturalAbstractPanel, host: { listeners: { "click": "clickPanel()" }, properties: { "class.isFrontPanel": "this.isFrontPanel", "class.isPanel": "this.isPanel" } }, usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalAbstractPanel, decorators: [{
+NaturalAbstractPanel.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalAbstractPanel, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+NaturalAbstractPanel.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.1.1", type: NaturalAbstractPanel, host: { listeners: { "click": "clickPanel()" }, properties: { "class.isFrontPanel": "this.isFrontPanel", "class.isPanel": "this.isPanel" } }, usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalAbstractPanel, decorators: [{
             type: Directive
         }], propDecorators: { isFrontPanel: [{
                 type: HostBinding,
@@ -522,7 +522,7 @@ class NaturalQueryVariablesManager {
      */
     updateVariables() {
         const merged = {};
-        this.channels.forEach((channelVariables) => {
+        this.channels.forEach(channelVariables => {
             if (channelVariables.filter) {
                 // Merge filter's groups first
                 const groups = this.mergeGroupList(merged.filter && merged.filter.groups ? merged.filter.groups : [], channelVariables.filter.groups || []);
@@ -2288,7 +2288,7 @@ class NaturalAbstractDetail extends NaturalAbstractPanel {
         /**
          * Form that manages the data from the controller
          */
-        this.form = new FormGroup({});
+        this.form = new UntypedFormGroup({});
         /**
          * Show / hides the bottom fab button (mostly to hide it when we are on other tabs where semantic of button can conflict with ...
          * semantic of data on other tab, like relations that list other objects)
@@ -2407,9 +2407,9 @@ class NaturalAbstractDetail extends NaturalAbstractPanel {
         mergeWith(this.data.model, this.form.value, mergeOverrideArray);
     }
 }
-NaturalAbstractDetail.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalAbstractDetail, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive });
-NaturalAbstractDetail.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.0", type: NaturalAbstractDetail, usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalAbstractDetail, decorators: [{
+NaturalAbstractDetail.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalAbstractDetail, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive });
+NaturalAbstractDetail.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.1.1", type: NaturalAbstractDetail, usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalAbstractDetail, decorators: [{
             type: Directive
         }], ctorParameters: function () { return [{ type: undefined }, { type: undefined }, { type: i0.Injector }]; } });
 
@@ -2437,11 +2437,11 @@ class NaturalAbstractEditableList extends NaturalAbstractController {
     constructor(service) {
         super();
         this.service = service;
-        this.formArray = new FormArray([]);
+        this.formArray = new UntypedFormArray([]);
         this.variablesManager = new NaturalQueryVariablesManager();
         this.dataSource = new MatTableDataSource();
         // Create a form group with a line attributes that contain an array of formGroups (one by line = one by model)
-        this.form = new FormGroup({ rows: this.formArray });
+        this.form = new UntypedFormGroup({ rows: this.formArray });
         this.dataSource.data = this.formArray.controls;
         this.variablesManager.set('pagination', { pagination: { pageSize: 999, pageIndex: 0 } });
     }
@@ -2495,9 +2495,9 @@ class NaturalAbstractEditableList extends NaturalAbstractController {
         validateAllFormControls(this.form);
     }
 }
-NaturalAbstractEditableList.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalAbstractEditableList, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive });
-NaturalAbstractEditableList.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.0", type: NaturalAbstractEditableList, usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalAbstractEditableList, decorators: [{
+NaturalAbstractEditableList.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalAbstractEditableList, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive });
+NaturalAbstractEditableList.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.1.1", type: NaturalAbstractEditableList, usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalAbstractEditableList, decorators: [{
             type: Directive
         }], ctorParameters: function () { return [{ type: undefined }]; } });
 
@@ -2718,9 +2718,9 @@ class NaturalMemoryStorage {
         this.data.set(key, value);
     }
 }
-NaturalMemoryStorage.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalMemoryStorage, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-NaturalMemoryStorage.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalMemoryStorage, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalMemoryStorage, decorators: [{
+NaturalMemoryStorage.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalMemoryStorage, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+NaturalMemoryStorage.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalMemoryStorage, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalMemoryStorage, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
@@ -2887,9 +2887,9 @@ class NaturalPersistenceService {
         return value == null || value === ''; // == means null or undefined;
     }
 }
-NaturalPersistenceService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalPersistenceService, deps: [{ token: i2$1.Router }, { token: SESSION_STORAGE }], target: i0.ɵɵFactoryTarget.Injectable });
-NaturalPersistenceService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalPersistenceService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalPersistenceService, decorators: [{
+NaturalPersistenceService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalPersistenceService, deps: [{ token: i2$1.Router }, { token: SESSION_STORAGE }], target: i0.ɵɵFactoryTarget.Injectable });
+NaturalPersistenceService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalPersistenceService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalPersistenceService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
@@ -3352,9 +3352,9 @@ class NaturalAbstractList extends NaturalAbstractPanel {
         }
     }
 }
-NaturalAbstractList.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalAbstractList, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive });
-NaturalAbstractList.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.0", type: NaturalAbstractList, inputs: { persistSearch: "persistSearch", selectedColumns: "selectedColumns", forcedVariables: "forcedVariables" }, usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalAbstractList, decorators: [{
+NaturalAbstractList.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalAbstractList, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive });
+NaturalAbstractList.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.1.1", type: NaturalAbstractList, inputs: { persistSearch: "persistSearch", selectedColumns: "selectedColumns", forcedVariables: "forcedVariables" }, usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalAbstractList, decorators: [{
             type: Directive
         }], ctorParameters: function () { return [{ type: undefined }, { type: i0.Injector }]; }, propDecorators: { persistSearch: [{
                 type: Input
@@ -3477,9 +3477,9 @@ class NaturalAbstractNavigableList extends NaturalAbstractList {
         return [item];
     }
 }
-NaturalAbstractNavigableList.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalAbstractNavigableList, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive });
-NaturalAbstractNavigableList.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.0", type: NaturalAbstractNavigableList, inputs: { ancestorRelationName: "ancestorRelationName" }, usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalAbstractNavigableList, decorators: [{
+NaturalAbstractNavigableList.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalAbstractNavigableList, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive });
+NaturalAbstractNavigableList.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.1.1", type: NaturalAbstractNavigableList, inputs: { ancestorRelationName: "ancestorRelationName" }, usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalAbstractNavigableList, decorators: [{
             type: Directive
         }], ctorParameters: function () { return [{ type: undefined }, { type: i0.Injector }]; }, propDecorators: { ancestorRelationName: [{
                 type: Input
@@ -3613,7 +3613,7 @@ class NaturalAbstractModelService {
         const controls = {};
         const disabled = model.permissions ? !model.permissions.update : false;
         if (model.id) {
-            controls['id'] = new FormControl({ value: model.id, disabled: true });
+            controls['id'] = new UntypedFormControl({ value: model.id, disabled: true });
         }
         // Configure form for each field of model
         for (const key of Object.keys(values)) {
@@ -3624,7 +3624,7 @@ class NaturalAbstractModelService {
             };
             const validator = typeof validators[key] !== 'undefined' ? validators[key] : null;
             const asyncValidator = typeof asyncValidators[key] !== 'undefined' ? asyncValidators[key] : null;
-            controls[key] = new FormControl(formState, validator, asyncValidator);
+            controls[key] = new UntypedFormControl(formState, validator, asyncValidator);
         }
         // Configure form for extra validators that are not on a specific field
         for (const key of Object.keys(validators)) {
@@ -3633,7 +3633,7 @@ class NaturalAbstractModelService {
                     value: model[key] ? model[key] : null,
                     disabled: disabled,
                 };
-                controls[key] = new FormControl(formState, validators[key]);
+                controls[key] = new UntypedFormControl(formState, validators[key]);
             }
         }
         for (const key of Object.keys(asyncValidators)) {
@@ -3645,7 +3645,7 @@ class NaturalAbstractModelService {
                     value: model[key] ? model[key] : null,
                     disabled: disabled,
                 };
-                controls[key] = new FormControl(formState, null, asyncValidators[key]);
+                controls[key] = new UntypedFormControl(formState, null, asyncValidators[key]);
             }
         }
         return controls;
@@ -3658,7 +3658,7 @@ class NaturalAbstractModelService {
      */
     getFormGroup(model) {
         const formConfig = this.getFormConfig(model);
-        return new FormGroup(formConfig, {
+        return new UntypedFormGroup(formConfig, {
             validators: this.getFormGroupValidators(model),
             asyncValidators: this.getFormGroupAsyncValidators(model),
         });
@@ -3672,13 +3672,15 @@ class NaturalAbstractModelService {
     getOne(id) {
         this.throwIfObservable(id);
         this.throwIfNotQuery(this.oneQuery);
-        const queryRef = this.apollo.watchQuery({
-            query: this.oneQuery,
-            variables: this.getVariablesForOne(id),
-            fetchPolicy: 'cache-and-network',
-            nextFetchPolicy: 'cache-only',
-        });
-        return queryRef.valueChanges.pipe(filter(result => !!result.data), takeWhile(result => result.networkStatus !== NetworkStatus.ready, true), map(result => result.data[this.name]));
+        return this.getVariablesForOne(id).pipe(switchMap(variables => {
+            this.throwIfNotQuery(this.oneQuery);
+            return this.apollo.watchQuery({
+                query: this.oneQuery,
+                variables: variables,
+                fetchPolicy: 'cache-and-network',
+                nextFetchPolicy: 'cache-only',
+            }).valueChanges;
+        }), filter(result => !!result.data), takeWhile(result => result.networkStatus !== NetworkStatus.ready, true), map(result => result.data[this.name]));
     }
     /**
      * Get a collection of objects
@@ -3688,16 +3690,17 @@ class NaturalAbstractModelService {
      */
     getAll(queryVariablesManager) {
         this.throwIfNotQuery(this.allQuery);
-        // Copy manager to prevent to apply internal variables to external QueryVariablesManager
-        const manager = new NaturalQueryVariablesManager(queryVariablesManager);
-        manager.merge('partial-variables', this.getPartialVariablesForAll());
-        return this.apollo
-            .query({
-            query: this.allQuery,
-            variables: manager.variables.value,
-            fetchPolicy: 'network-only',
-        })
-            .pipe(this.mapAll());
+        return this.getPartialVariablesForAll().pipe(first$1(), switchMap(partialVariables => {
+            this.throwIfNotQuery(this.allQuery);
+            // Copy manager to prevent to apply internal variables to external QueryVariablesManager
+            const manager = new NaturalQueryVariablesManager(queryVariablesManager);
+            manager.merge('partial-variables', partialVariables);
+            return this.apollo.query({
+                query: this.allQuery,
+                variables: manager.variables.value,
+                fetchPolicy: 'network-only',
+            });
+        }), this.mapAll());
     }
     /**
      * Get a collection of objects
@@ -3711,16 +3714,19 @@ class NaturalAbstractModelService {
      */
     watchAll(queryVariablesManager, fetchPolicy = 'cache-and-network') {
         this.throwIfNotQuery(this.allQuery);
-        return queryVariablesManager.variables.pipe(
-        // Ignore very fast variable changes
-        debounceTime(20), 
-        // Wait for variables to be defined to prevent duplicate query: with and without variables
-        // Null is accepted value for "no variables"
-        filter(variables => typeof variables !== 'undefined'), switchMap(() => {
+        return combineLatest({
+            variables: queryVariablesManager.variables.pipe(
+            // Ignore very fast variable changes
+            debounceTime(20), 
+            // Wait for variables to be defined to prevent duplicate query: with and without variables
+            // Null is accepted value for "no variables"
+            filter(variables => typeof variables !== 'undefined')),
+            partialVariables: this.getPartialVariablesForAll(),
+        }).pipe(switchMap(result => {
             // Apply partial variables from service
             // Copy manager to prevent to apply internal variables to external QueryVariablesManager
             const manager = new NaturalQueryVariablesManager(queryVariablesManager);
-            manager.merge('partial-variables', this.getPartialVariablesForAll());
+            manager.merge('partial-variables', result.partialVariables);
             this.throwIfNotQuery(this.allQuery);
             return this.apollo
                 .watchQuery({
@@ -3937,22 +3943,22 @@ class NaturalAbstractModelService {
         const plural = makePlural(this.name);
         const queryName = 'Count' + upperCaseFirstLetter(plural);
         const filterType = upperCaseFirstLetter(this.name) + 'Filter';
-        // Copy manager to prevent to apply internal variables to external QueryVariablesManager
-        const manager = new NaturalQueryVariablesManager(queryVariablesManager);
-        manager.merge('partial-variables', this.getPartialVariablesForAll());
         const query = gql `
             query ${queryName} ($filter: ${filterType}) {
             count: ${plural} (filter: $filter, pagination: {pageSize: 0, pageIndex: 0}) {
             length
             }
             }`;
-        return this.apollo
-            .query({
-            query: query,
-            variables: manager.variables.value,
-            fetchPolicy: 'network-only',
-        })
-            .pipe(map(result => result.data.count.length));
+        return this.getPartialVariablesForAll().pipe(switchMap(partialVariables => {
+            // Copy manager to prevent to apply internal variables to external QueryVariablesManager
+            const manager = new NaturalQueryVariablesManager(queryVariablesManager);
+            manager.merge('partial-variables', partialVariables);
+            return this.apollo.query({
+                query: query,
+                variables: manager.variables.value,
+                fetchPolicy: 'network-only',
+            });
+        }), map(result => result.data.count.length));
     }
     /**
      * Return empty object with some default values from server perspective
@@ -4004,7 +4010,7 @@ class NaturalAbstractModelService {
      * This is typically a site or state ID, and is needed to get appropriate access rights
      */
     getPartialVariablesForOne() {
-        return {};
+        return of({});
     }
     /**
      * Returns additional variables to be used when getting multiple objects
@@ -4012,7 +4018,7 @@ class NaturalAbstractModelService {
      * This is typically a site or state ID, but it could be something else to further filter the query
      */
     getPartialVariablesForAll() {
-        return {};
+        return of({});
     }
     /**
      * Returns additional variables to be used when creating an object
@@ -4050,7 +4056,7 @@ class NaturalAbstractModelService {
      * Merge given ID with additional partial variables if there is any
      */
     getVariablesForOne(id) {
-        return merge({}, { id: id }, this.getPartialVariablesForOne());
+        return this.getPartialVariablesForOne().pipe(map(partialVariables => merge({}, { id: id }, partialVariables)));
     }
     /**
      * Throw exception to prevent executing null queries
@@ -4115,14 +4121,14 @@ class NaturalEnumService {
         }));
     }
 }
-NaturalEnumService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalEnumService, deps: [{ token: i1$2.Apollo }], target: i0.ɵɵFactoryTarget.Injectable });
-NaturalEnumService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalEnumService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalEnumService, decorators: [{
+NaturalEnumService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalEnumService, deps: [{ token: i1$1.Apollo }], target: i0.ɵɵFactoryTarget.Injectable });
+NaturalEnumService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalEnumService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalEnumService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
                 }]
-        }], ctorParameters: function () { return [{ type: i1$2.Apollo }]; } });
+        }], ctorParameters: function () { return [{ type: i1$1.Apollo }]; } });
 
 /**
  * Query to get list of mutations
@@ -4260,14 +4266,14 @@ class NaturalLinkMutationService {
         }`;
     }
 }
-NaturalLinkMutationService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalLinkMutationService, deps: [{ token: i1$2.Apollo }], target: i0.ɵɵFactoryTarget.Injectable });
-NaturalLinkMutationService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalLinkMutationService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalLinkMutationService, decorators: [{
+NaturalLinkMutationService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalLinkMutationService, deps: [{ token: i1$1.Apollo }], target: i0.ɵɵFactoryTarget.Injectable });
+NaturalLinkMutationService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalLinkMutationService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalLinkMutationService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
                 }]
-        }], ctorParameters: function () { return [{ type: i1$2.Apollo }]; } });
+        }], ctorParameters: function () { return [{ type: i1$1.Apollo }]; } });
 
 class NaturalSwissParsingDateAdapter extends NativeDateAdapter {
     /**
@@ -4312,9 +4318,9 @@ class NaturalSwissParsingDateAdapter extends NativeDateAdapter {
         return 1;
     }
 }
-NaturalSwissParsingDateAdapter.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSwissParsingDateAdapter, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
-NaturalSwissParsingDateAdapter.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSwissParsingDateAdapter, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSwissParsingDateAdapter, decorators: [{
+NaturalSwissParsingDateAdapter.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalSwissParsingDateAdapter, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
+NaturalSwissParsingDateAdapter.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalSwissParsingDateAdapter, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalSwissParsingDateAdapter, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
@@ -4323,10 +4329,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImpor
 
 class NaturalAlertModule {
 }
-NaturalAlertModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalAlertModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NaturalAlertModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalAlertModule, declarations: [NaturalConfirmComponent], imports: [CommonModule, MatDialogModule, MatSnackBarModule, MatButtonModule] });
-NaturalAlertModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalAlertModule, imports: [[CommonModule, MatDialogModule, MatSnackBarModule, MatButtonModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalAlertModule, decorators: [{
+NaturalAlertModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalAlertModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NaturalAlertModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: NaturalAlertModule, declarations: [NaturalConfirmComponent], imports: [CommonModule, MatDialogModule, MatSnackBarModule, MatButtonModule] });
+NaturalAlertModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalAlertModule, imports: [CommonModule, MatDialogModule, MatSnackBarModule, MatButtonModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalAlertModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [NaturalConfirmComponent],
@@ -4349,6 +4355,10 @@ class NaturalColumnsPickerColumnDirective {
          * Initial visibility state
          */
         this.hidden = false;
+        /**
+         * Localized label of column, if absent default to key
+         */
+        this.label = '';
     }
     /**
      * This must be the column key as defined in matColumnDef
@@ -4361,12 +4371,12 @@ class NaturalColumnsPickerColumnDirective {
         this.label = this.key;
     }
     ngAfterViewInit() {
-        this.label = this.elementRef.nativeElement.textContent;
+        this.label = this.elementRef.nativeElement.textContent ?? '';
     }
 }
-NaturalColumnsPickerColumnDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalColumnsPickerColumnDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
-NaturalColumnsPickerColumnDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.0", type: NaturalColumnsPickerColumnDirective, selector: "[naturalColumnsPickerColumn]", inputs: { checked: "checked", hidden: "hidden", naturalColumnsPickerColumn: "naturalColumnsPickerColumn" }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalColumnsPickerColumnDirective, decorators: [{
+NaturalColumnsPickerColumnDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalColumnsPickerColumnDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+NaturalColumnsPickerColumnDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.1.1", type: NaturalColumnsPickerColumnDirective, selector: "[naturalColumnsPickerColumn]", inputs: { checked: "checked", hidden: "hidden", naturalColumnsPickerColumn: "naturalColumnsPickerColumn" }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalColumnsPickerColumnDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[naturalColumnsPickerColumn]',
@@ -4428,12 +4438,12 @@ class NaturalIconComponent {
         }
     }
 }
-NaturalIconComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalIconComponent, deps: [{ token: i1$3.MatIconRegistry }, { token: i2$2.DomSanitizer }, { token: IconsConfigService }], target: i0.ɵɵFactoryTarget.Component });
-NaturalIconComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: NaturalIconComponent, selector: "natural-icon", inputs: { label: "label", labelColor: "labelColor", labelPosition: "labelPosition", name: "name", size: "size" }, host: { properties: { "style.color": "this.fgColor", "class.material-icons": "this.isMaterialIcon", "class.mat-icon": "this.isIcon", "style.min-width.px": "this.width", "style.min-height.px": "this.height", "style.font-size.px": "this.fontSize" } }, ngImport: i0, template: "<mat-icon *ngIf=\"icon?.font\" [class]=\"icon?.class\" data-nosnippet>{{ icon?.font }}</mat-icon>\n<mat-icon *ngIf=\"icon?.svg\" [class]=\"icon?.class\" [svgIcon]=\"icon.name\" class=\"svg-icon\"></mat-icon>\n\n<div *ngIf=\"label\" [ngClass]=\"labelColor + ' ' + labelPosition\" class=\"label\">{{ label }}</div>\n", styles: [":host{position:relative}:host mat-icon{background-repeat:inherit;display:inherit;fill:inherit;height:inherit;width:inherit;font-family:inherit;font-weight:inherit;font-style:inherit;font-size:inherit;line-height:inherit;text-transform:inherit;letter-spacing:inherit;word-wrap:inherit;white-space:inherit;direction:inherit;-webkit-font-smoothing:inherit;text-rendering:inherit;-moz-osx-font-smoothing:inherit;font-feature-settings:inherit;min-height:inherit;min-width:inherit;vertical-align:unset}:host .label{position:absolute;padding:2px;border-radius:100%;font-family:Quicksand sans-serif;font-size:14px;line-height:1em;height:14px;min-width:14px;text-align:center}:host .label.top-left{top:0;left:0;transform:translate(-50%)}:host .label.top-right{top:0;right:0;transform:translate(50%)}:host .label.bottom-left{bottom:0;left:0;transform:translate(-50%)}:host .label.bottom-right{bottom:0;right:0;transform:translate(50%)}\n"], components: [{ type: i1$3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalIconComponent, decorators: [{
+NaturalIconComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalIconComponent, deps: [{ token: i1$2.MatIconRegistry }, { token: i2$2.DomSanitizer }, { token: IconsConfigService }], target: i0.ɵɵFactoryTarget.Component });
+NaturalIconComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: NaturalIconComponent, selector: "natural-icon", inputs: { label: "label", labelColor: "labelColor", labelPosition: "labelPosition", name: "name", size: "size" }, host: { properties: { "style.color": "this.fgColor", "class.material-icons": "this.isMaterialIcon", "class.mat-icon": "this.isIcon", "style.min-width.px": "this.width", "style.min-height.px": "this.height", "style.font-size.px": "this.fontSize" } }, ngImport: i0, template: "<mat-icon *ngIf=\"icon?.font\" [class]=\"icon.class\" data-nosnippet>{{ icon.font }}</mat-icon>\n<mat-icon *ngIf=\"icon?.svg\" [class]=\"icon.class\" [svgIcon]=\"icon.name\" class=\"svg-icon\"></mat-icon>\n\n<div *ngIf=\"label\" [ngClass]=\"labelColor + ' ' + labelPosition\" class=\"label\">{{ label }}</div>\n", styles: [":host{position:relative}:host mat-icon{background-repeat:inherit;display:inherit;fill:inherit;height:inherit;width:inherit;font-family:inherit;font-weight:inherit;font-style:inherit;font-size:inherit;line-height:inherit;text-transform:inherit;letter-spacing:inherit;word-wrap:inherit;white-space:inherit;direction:inherit;-webkit-font-smoothing:inherit;text-rendering:inherit;-moz-osx-font-smoothing:inherit;font-feature-settings:inherit;min-height:inherit;min-width:inherit;vertical-align:unset}:host .label{position:absolute;padding:2px;border-radius:100%;font-family:Quicksand sans-serif;font-size:14px;line-height:1em;height:14px;min-width:14px;text-align:center}:host .label.top-left{top:0;left:0;transform:translate(-50%)}:host .label.top-right{top:0;right:0;transform:translate(50%)}:host .label.bottom-left{bottom:0;left:0;transform:translate(-50%)}:host .label.bottom-right{bottom:0;right:0;transform:translate(50%)}\n"], dependencies: [{ kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalIconComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'natural-icon', template: "<mat-icon *ngIf=\"icon?.font\" [class]=\"icon?.class\" data-nosnippet>{{ icon?.font }}</mat-icon>\n<mat-icon *ngIf=\"icon?.svg\" [class]=\"icon?.class\" [svgIcon]=\"icon.name\" class=\"svg-icon\"></mat-icon>\n\n<div *ngIf=\"label\" [ngClass]=\"labelColor + ' ' + labelPosition\" class=\"label\">{{ label }}</div>\n", styles: [":host{position:relative}:host mat-icon{background-repeat:inherit;display:inherit;fill:inherit;height:inherit;width:inherit;font-family:inherit;font-weight:inherit;font-style:inherit;font-size:inherit;line-height:inherit;text-transform:inherit;letter-spacing:inherit;word-wrap:inherit;white-space:inherit;direction:inherit;-webkit-font-smoothing:inherit;text-rendering:inherit;-moz-osx-font-smoothing:inherit;font-feature-settings:inherit;min-height:inherit;min-width:inherit;vertical-align:unset}:host .label{position:absolute;padding:2px;border-radius:100%;font-family:Quicksand sans-serif;font-size:14px;line-height:1em;height:14px;min-width:14px;text-align:center}:host .label.top-left{top:0;left:0;transform:translate(-50%)}:host .label.top-right{top:0;right:0;transform:translate(50%)}:host .label.bottom-left{bottom:0;left:0;transform:translate(-50%)}:host .label.bottom-right{bottom:0;right:0;transform:translate(50%)}\n"] }]
-        }], ctorParameters: function () { return [{ type: i1$3.MatIconRegistry }, { type: i2$2.DomSanitizer }, { type: undefined, decorators: [{
+            args: [{ selector: 'natural-icon', template: "<mat-icon *ngIf=\"icon?.font\" [class]=\"icon.class\" data-nosnippet>{{ icon.font }}</mat-icon>\n<mat-icon *ngIf=\"icon?.svg\" [class]=\"icon.class\" [svgIcon]=\"icon.name\" class=\"svg-icon\"></mat-icon>\n\n<div *ngIf=\"label\" [ngClass]=\"labelColor + ' ' + labelPosition\" class=\"label\">{{ label }}</div>\n", styles: [":host{position:relative}:host mat-icon{background-repeat:inherit;display:inherit;fill:inherit;height:inherit;width:inherit;font-family:inherit;font-weight:inherit;font-style:inherit;font-size:inherit;line-height:inherit;text-transform:inherit;letter-spacing:inherit;word-wrap:inherit;white-space:inherit;direction:inherit;-webkit-font-smoothing:inherit;text-rendering:inherit;-moz-osx-font-smoothing:inherit;font-feature-settings:inherit;min-height:inherit;min-width:inherit;vertical-align:unset}:host .label{position:absolute;padding:2px;border-radius:100%;font-family:Quicksand sans-serif;font-size:14px;line-height:1em;height:14px;min-width:14px;text-align:center}:host .label.top-left{top:0;left:0;transform:translate(-50%)}:host .label.top-right{top:0;right:0;transform:translate(50%)}:host .label.bottom-left{bottom:0;left:0;transform:translate(-50%)}:host .label.bottom-right{bottom:0;right:0;transform:translate(50%)}\n"] }]
+        }], ctorParameters: function () { return [{ type: i1$2.MatIconRegistry }, { type: i2$2.DomSanitizer }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [IconsConfigService]
                 }] }]; }, propDecorators: { fgColor: [{
@@ -4524,9 +4534,9 @@ class NaturalColumnsPickerComponent {
         this.ngUnsubscribe.complete(); // complete the stream, because we will never emit again
     }
 }
-NaturalColumnsPickerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalColumnsPickerComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-NaturalColumnsPickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: NaturalColumnsPickerComponent, selector: "natural-columns-picker", inputs: { selections: "selections" }, outputs: { selectionChange: "selectionChange" }, queries: [{ propertyName: "availableColumns", predicate: NaturalColumnsPickerColumnDirective }], ngImport: i0, template: "<div>\n    <mat-menu #naturalMenu=\"matMenu\">\n        <div\n            (click)=\"$event.stopPropagation(); column.checked = !column.checked; updateColumns()\"\n            *ngFor=\"let column of displayedColumns\"\n            class=\"mat-menu-item\"\n        >\n            <mat-checkbox (click)=\"$event.stopPropagation()\" (change)=\"updateColumns()\" [(ngModel)]=\"column.checked\">{{\n                column.label\n            }}</mat-checkbox>\n        </div>\n    </mat-menu>\n    <button [matMenuTriggerFor]=\"naturalMenu\" mat-icon-button i18n-matTooltip matTooltip=\"S\u00E9lectionner les colonnes\">\n        <natural-icon name=\"view_column\"></natural-icon>\n    </button>\n</div>\n", components: [{ type: i1$4.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { type: i2$3.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: i1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: NaturalIconComponent, selector: "natural-icon", inputs: ["label", "labelColor", "labelPosition", "name", "size"] }], directives: [{ type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i10.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { type: i1$4.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalColumnsPickerComponent, decorators: [{
+NaturalColumnsPickerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalColumnsPickerComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+NaturalColumnsPickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: NaturalColumnsPickerComponent, selector: "natural-columns-picker", inputs: { selections: "selections" }, outputs: { selectionChange: "selectionChange" }, queries: [{ propertyName: "availableColumns", predicate: NaturalColumnsPickerColumnDirective }], ngImport: i0, template: "<div>\n    <mat-menu #naturalMenu=\"matMenu\">\n        <div\n            (click)=\"$event.stopPropagation(); column.checked = !column.checked; updateColumns()\"\n            *ngFor=\"let column of displayedColumns\"\n            class=\"mat-menu-item\"\n        >\n            <mat-checkbox (click)=\"$event.stopPropagation()\" (change)=\"updateColumns()\" [(ngModel)]=\"column.checked\">{{\n                column.label\n            }}</mat-checkbox>\n        </div>\n    </mat-menu>\n    <button [matMenuTriggerFor]=\"naturalMenu\" mat-icon-button i18n-matTooltip matTooltip=\"S\u00E9lectionner les colonnes\">\n        <natural-icon name=\"view_column\"></natural-icon>\n    </button>\n</div>\n", dependencies: [{ kind: "directive", type: i1$3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { 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: i3$1.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "directive", type: i3$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "component", type: i4.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "component", type: NaturalIconComponent, selector: "natural-icon", inputs: ["label", "labelColor", "labelPosition", "name", "size"] }, { kind: "directive", type: i7.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalColumnsPickerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'natural-columns-picker', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div>\n    <mat-menu #naturalMenu=\"matMenu\">\n        <div\n            (click)=\"$event.stopPropagation(); column.checked = !column.checked; updateColumns()\"\n            *ngFor=\"let column of displayedColumns\"\n            class=\"mat-menu-item\"\n        >\n            <mat-checkbox (click)=\"$event.stopPropagation()\" (change)=\"updateColumns()\" [(ngModel)]=\"column.checked\">{{\n                column.label\n            }}</mat-checkbox>\n        </div>\n    </mat-menu>\n    <button [matMenuTriggerFor]=\"naturalMenu\" mat-icon-button i18n-matTooltip matTooltip=\"S\u00E9lectionner les colonnes\">\n        <natural-icon name=\"view_column\"></natural-icon>\n    </button>\n</div>\n" }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { selections: [{
@@ -4551,10 +4561,10 @@ class NaturalIconModule {
         };
     }
 }
-NaturalIconModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalIconModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NaturalIconModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalIconModule, declarations: [NaturalIconComponent], imports: [CommonModule, MatIconModule], exports: [NaturalIconComponent] });
-NaturalIconModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalIconModule, imports: [[CommonModule, MatIconModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalIconModule, decorators: [{
+NaturalIconModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalIconModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NaturalIconModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: NaturalIconModule, declarations: [NaturalIconComponent], imports: [CommonModule, MatIconModule], exports: [NaturalIconComponent] });
+NaturalIconModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalIconModule, imports: [CommonModule, MatIconModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalIconModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [NaturalIconComponent],
@@ -4565,24 +4575,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImpor
 
 class NaturalColumnsPickerModule {
 }
-NaturalColumnsPickerModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalColumnsPickerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NaturalColumnsPickerModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalColumnsPickerModule, declarations: [NaturalColumnsPickerColumnDirective, NaturalColumnsPickerComponent], imports: [CommonModule,
+NaturalColumnsPickerModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalColumnsPickerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NaturalColumnsPickerModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: NaturalColumnsPickerModule, declarations: [NaturalColumnsPickerColumnDirective, NaturalColumnsPickerComponent], imports: [CommonModule,
         FormsModule,
         MatMenuModule,
         MatButtonModule,
         MatCheckboxModule,
         NaturalIconModule,
         MatTooltipModule], exports: [NaturalColumnsPickerColumnDirective, NaturalColumnsPickerComponent] });
-NaturalColumnsPickerModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalColumnsPickerModule, imports: [[
-            CommonModule,
-            FormsModule,
-            MatMenuModule,
-            MatButtonModule,
-            MatCheckboxModule,
-            NaturalIconModule,
-            MatTooltipModule,
-        ]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalColumnsPickerModule, decorators: [{
+NaturalColumnsPickerModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalColumnsPickerModule, imports: [CommonModule,
+        FormsModule,
+        MatMenuModule,
+        MatButtonModule,
+        MatCheckboxModule,
+        NaturalIconModule,
+        MatTooltipModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalColumnsPickerModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [NaturalColumnsPickerColumnDirective, NaturalColumnsPickerComponent],
@@ -4636,9 +4644,9 @@ class NaturalHttpPrefixDirective extends NaturalAbstractController {
         }
     }
 }
-NaturalHttpPrefixDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalHttpPrefixDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-NaturalHttpPrefixDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.0", type: NaturalHttpPrefixDirective, selector: "[naturalHttpPrefix]", inputs: { naturalHttpPrefix: "naturalHttpPrefix" }, host: { listeners: { "ngModelChange": "httpize($event)" } }, usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalHttpPrefixDirective, decorators: [{
+NaturalHttpPrefixDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalHttpPrefixDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+NaturalHttpPrefixDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.1.1", type: NaturalHttpPrefixDirective, selector: "[naturalHttpPrefix]", inputs: { naturalHttpPrefix: "naturalHttpPrefix" }, host: { listeners: { "ngModelChange": "httpize($event)" } }, usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalHttpPrefixDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[naturalHttpPrefix]',
@@ -4691,7 +4699,7 @@ class NaturalLinkableTabDirective extends NaturalAbstractController {
             }
         });
         // When mat-tab-groups selected tab change, update url
-        this.component.selectedTabChange.pipe(takeUntil(this.ngUnsubscribe)).subscribe((event) => {
+        this.component.selectedTabChange.pipe(takeUntil(this.ngUnsubscribe)).subscribe(event => {
             const activatedTabName = getTabId(event.tab);
             const segments = this.route.snapshot.url;
             if (!segments.length) {
@@ -4711,14 +4719,14 @@ class NaturalLinkableTabDirective extends NaturalAbstractController {
         return this.component._tabs.toArray().findIndex(tab => fragment === getTabId(tab));
     }
 }
-NaturalLinkableTabDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalLinkableTabDirective, deps: [{ token: i1$5.MatTabGroup }, { token: i2$1.ActivatedRoute }, { token: i2$1.Router }], target: i0.ɵɵFactoryTarget.Directive });
-NaturalLinkableTabDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.0", type: NaturalLinkableTabDirective, selector: "mat-tab-group[naturalLinkableTab]", inputs: { naturalLinkableTab: "naturalLinkableTab" }, usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalLinkableTabDirective, decorators: [{
+NaturalLinkableTabDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalLinkableTabDirective, deps: [{ token: i1$4.MatTabGroup }, { token: i2$1.ActivatedRoute }, { token: i2$1.Router }], target: i0.ɵɵFactoryTarget.Directive });
+NaturalLinkableTabDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.1.1", type: NaturalLinkableTabDirective, selector: "mat-tab-group[naturalLinkableTab]", inputs: { naturalLinkableTab: "naturalLinkableTab" }, usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalLinkableTabDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'mat-tab-group[naturalLinkableTab]',
                 }]
-        }], ctorParameters: function () { return [{ type: i1$5.MatTabGroup }, { type: i2$1.ActivatedRoute }, { type: i2$1.Router }]; }, propDecorators: { naturalLinkableTab: [{
+        }], ctorParameters: function () { return [{ type: i1$4.MatTabGroup }, { type: i2$1.ActivatedRoute }, { type: i2$1.Router }]; }, propDecorators: { naturalLinkableTab: [{
                 type: Input
             }] } });
 
@@ -4730,9 +4738,9 @@ class NaturalCapitalizePipe {
         return value;
     }
 }
-NaturalCapitalizePipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalCapitalizePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
-NaturalCapitalizePipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalCapitalizePipe, name: "capitalize" });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalCapitalizePipe, decorators: [{
+NaturalCapitalizePipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalCapitalizePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
+NaturalCapitalizePipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: NaturalCapitalizePipe, name: "capitalize" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalCapitalizePipe, decorators: [{
             type: Pipe,
             args: [{ name: 'capitalize' }]
         }] });
@@ -4742,9 +4750,9 @@ class NaturalEllipsisPipe {
         return value.substr(0, limit - 1) + (value.length > limit ? '…' : '');
     }
 }
-NaturalEllipsisPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalEllipsisPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
-NaturalEllipsisPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalEllipsisPipe, name: "ellipsis" });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalEllipsisPipe, decorators: [{
+NaturalEllipsisPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalEllipsisPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
+NaturalEllipsisPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: NaturalEllipsisPipe, name: "ellipsis" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalEllipsisPipe, decorators: [{
             type: Pipe,
             args: [{ name: 'ellipsis' }]
         }] });
@@ -4762,9 +4770,9 @@ class NaturalEnumPipe {
         return this.enumService.getValueName(value, enumName);
     }
 }
-NaturalEnumPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalEnumPipe, deps: [{ token: NaturalEnumService }], target: i0.ɵɵFactoryTarget.Pipe });
-NaturalEnumPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalEnumPipe, name: "enum" });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalEnumPipe, decorators: [{
+NaturalEnumPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalEnumPipe, deps: [{ token: NaturalEnumService }], target: i0.ɵɵFactoryTarget.Pipe });
+NaturalEnumPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: NaturalEnumPipe, name: "enum" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalEnumPipe, decorators: [{
             type: Pipe,
             args: [{
                     name: 'enum',
@@ -4779,9 +4787,9 @@ class NaturalSwissDatePipe extends DatePipe {
         return super.transform(value, format, timezone, locale);
     }
 }
-NaturalSwissDatePipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSwissDatePipe, deps: null, target: i0.ɵɵFactoryTarget.Pipe });
-NaturalSwissDatePipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSwissDatePipe, name: "swissDate" });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSwissDatePipe, decorators: [{
+NaturalSwissDatePipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalSwissDatePipe, deps: null, target: i0.ɵɵFactoryTarget.Pipe });
+NaturalSwissDatePipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: NaturalSwissDatePipe, name: "swissDate" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalSwissDatePipe, decorators: [{
             type: Pipe,
             args: [{
                     name: 'swissDate',
@@ -4837,9 +4845,9 @@ class NaturalSrcDensityDirective {
         this.elementRef.nativeElement.srcset = srcset;
     }
 }
-NaturalSrcDensityDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSrcDensityDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
-NaturalSrcDensityDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.0", type: NaturalSrcDensityDirective, selector: "img[naturalSrcDensity]", inputs: { naturalSrcDensity: "naturalSrcDensity" }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSrcDensityDirective, decorators: [{
+NaturalSrcDensityDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalSrcDensityDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+NaturalSrcDensityDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.1.1", type: NaturalSrcDensityDirective, selector: "img[naturalSrcDensity]", inputs: { naturalSrcDensity: "naturalSrcDensity" }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalSrcDensityDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'img[naturalSrcDensity]',
@@ -4859,8 +4867,8 @@ const declarationsToExport = [
 ];
 class NaturalCommonModule {
 }
-NaturalCommonModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalCommonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NaturalCommonModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalCommonModule, declarations: [NaturalCapitalizePipe,
+NaturalCommonModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalCommonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NaturalCommonModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: NaturalCommonModule, declarations: [NaturalCapitalizePipe,
         NaturalEllipsisPipe,
         NaturalEnumPipe,
         NaturalSwissDatePipe,
@@ -4873,8 +4881,8 @@ NaturalCommonModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", ver
         NaturalHttpPrefixDirective,
         NaturalSrcDensityDirective,
         NaturalLinkableTabDirective] });
-NaturalCommonModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalCommonModule, providers: [sessionStorageProvider, localStorageProvider], imports: [[CommonModule, MatFormFieldModule, MatInputModule, MatSelectModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalCommonModule, decorators: [{
+NaturalCommonModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalCommonModule, providers: [sessionStorageProvider, localStorageProvider], imports: [CommonModule, MatFormFieldModule, MatInputModule, MatSelectModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalCommonModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [...declarationsToExport],
@@ -4980,9 +4988,9 @@ class NaturalSeoService {
         return seo;
     }
 }
-NaturalSeoService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSeoService, deps: [{ token: NATURAL_SEO_CONFIG }, { token: i2$1.Router }, { token: i2$2.Title }, { token: i2$2.Meta }], target: i0.ɵɵFactoryTarget.Injectable });
-NaturalSeoService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSeoService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSeoService, decorators: [{
+NaturalSeoService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalSeoService, deps: [{ token: NATURAL_SEO_CONFIG }, { token: i2$1.Router }, { token: i2$2.Title }, { token: i2$2.Meta }], target: i0.ɵɵFactoryTarget.Injectable });
+NaturalSeoService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalSeoService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalSeoService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
@@ -5037,11 +5045,11 @@ class NaturalDetailHeaderComponent {
         return this.getRootLink().concat([id]);
     }
 }
-NaturalDetailHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalDetailHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-NaturalDetailHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: NaturalDetailHeaderComponent, selector: "natural-detail-header", inputs: { currentBaseUrl: "currentBaseUrl", isPanel: "isPanel", icon: "icon", label: "label", rootLabel: "rootLabel", newLabel: "newLabel", model: "model", breadcrumbs: "breadcrumbs", listRoute: "listRoute", listFragment: "listFragment", link: "link" }, ngImport: i0, template: "<div class=\"breadcrumb\">\n    <a [routerLink]=\"isPanel ? [] : getRootLink()\" [fragment]=\"listFragment\" color=\"primary\" mat-button>{{\n        rootLabel || label\n    }}</a>\n    <ng-container *ngFor=\"let parent of breadcrumbs\">\n        /\n        <a [routerLink]=\"isPanel ? [] : getLink(parent.id)\" color=\"primary\" mat-button>\n            {{ parent?.fullName || parent?.name }}</a\n        >\n    </ng-container>\n</div>\n\n<div class=\"body\">\n    <div *ngIf=\"icon\" style=\"width: 30px\">\n        <natural-icon [name]=\"icon\"></natural-icon>\n    </div>\n    <div *ngIf=\"!model.id\" class=\"mat-headline no-margin newLabel\">{{ newLabel }}</div>\n    <div *ngIf=\"model.id\" class=\"mat-headline no-margin label\">{{ model?.name || model?.fullName || label }}</div>\n    <div>\n        <ng-content></ng-content>\n    </div>\n</div>\n", styles: [":host{display:flex;flex-direction:column}:host .breadcrumb,:host .body{display:flex;flex-direction:row;align-items:center}:host .breadcrumb{position:relative;top:5px}:host .body{min-height:40px}:host .body>*:not(:last-child){margin-right:5px}:host .body .label,:host .body .newLabel{flex:1}@media screen and (max-width: 600px){:host .body{flex-direction:column;align-items:flex-start}:host .body>*:not(:last-child){margin-bottom:10px!important}:host .body natural-icon{display:none}}\n"], components: [{ type: i1.MatAnchor, selector: "a[mat-button], a[mat-raised-button], a[mat-icon-button], a[mat-fab],             a[mat-mini-fab], a[mat-stroked-button], a[mat-flat-button]", inputs: ["disabled", "disableRipple", "color", "tabIndex"], exportAs: ["matButton", "matAnchor"] }, { type: NaturalIconComponent, selector: "natural-icon", inputs: ["label", "labelColor", "labelPosition", "name", "size"] }], directives: [{ type: i2$1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalDetailHeaderComponent, decorators: [{
+NaturalDetailHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalDetailHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+NaturalDetailHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: NaturalDetailHeaderComponent, selector: "natural-detail-header", inputs: { currentBaseUrl: "currentBaseUrl", isPanel: "isPanel", icon: "icon", label: "label", rootLabel: "rootLabel", newLabel: "newLabel", model: "model", breadcrumbs: "breadcrumbs", listRoute: "listRoute", listFragment: "listFragment", link: "link" }, ngImport: i0, template: "<div class=\"breadcrumb\">\n    <a [routerLink]=\"isPanel ? [] : getRootLink()\" [fragment]=\"listFragment\" color=\"primary\" mat-button>{{\n        rootLabel || label\n    }}</a>\n    <ng-container *ngFor=\"let parent of breadcrumbs\">\n        /\n        <a [routerLink]=\"isPanel ? [] : getLink(parent.id)\" color=\"primary\" mat-button>\n            {{ parent?.fullName || parent?.name }}</a\n        >\n    </ng-container>\n</div>\n\n<div class=\"body\">\n    <div *ngIf=\"icon\" style=\"width: 30px\">\n        <natural-icon [name]=\"icon\"></natural-icon>\n    </div>\n    <div *ngIf=\"!model.id\" class=\"mat-headline no-margin newLabel\">{{ newLabel }}</div>\n    <div *ngIf=\"model.id\" class=\"mat-headline no-margin label\">{{ model.name || model.fullName || label }}</div>\n    <div>\n        <ng-content></ng-content>\n    </div>\n</div>\n", styles: [":host{display:flex;flex-direction:column}:host .breadcrumb,:host .body{display:flex;flex-direction:row;align-items:center}:host .breadcrumb{position:relative;top:5px}:host .body{min-height:40px}:host .body>*:not(:last-child){margin-right:5px}:host .body .label,:host .body .newLabel{flex:1}@media screen and (max-width: 600px){:host .body{flex-direction:column;align-items:flex-start}:host .body>*:not(:last-child){margin-bottom:10px!important}:host .body natural-icon{display:none}}\n"], dependencies: [{ kind: "directive", type: i1$3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { kind: "component", type: i4.MatAnchor, selector: "a[mat-button], a[mat-raised-button], a[mat-icon-button], a[mat-fab],             a[mat-mini-fab], a[mat-stroked-button], a[mat-flat-button]", inputs: ["disabled", "disableRipple", "color", "tabIndex"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: NaturalIconComponent, selector: "natural-icon", inputs: ["label", "labelColor", "labelPosition", "name", "size"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalDetailHeaderComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'natural-detail-header', template: "<div class=\"breadcrumb\">\n    <a [routerLink]=\"isPanel ? [] : getRootLink()\" [fragment]=\"listFragment\" color=\"primary\" mat-button>{{\n        rootLabel || label\n    }}</a>\n    <ng-container *ngFor=\"let parent of breadcrumbs\">\n        /\n        <a [routerLink]=\"isPanel ? [] : getLink(parent.id)\" color=\"primary\" mat-button>\n            {{ parent?.fullName || parent?.name }}</a\n        >\n    </ng-container>\n</div>\n\n<div class=\"body\">\n    <div *ngIf=\"icon\" style=\"width: 30px\">\n        <natural-icon [name]=\"icon\"></natural-icon>\n    </div>\n    <div *ngIf=\"!model.id\" class=\"mat-headline no-margin newLabel\">{{ newLabel }}</div>\n    <div *ngIf=\"model.id\" class=\"mat-headline no-margin label\">{{ model?.name || model?.fullName || label }}</div>\n    <div>\n        <ng-content></ng-content>\n    </div>\n</div>\n", styles: [":host{display:flex;flex-direction:column}:host .breadcrumb,:host .body{display:flex;flex-direction:row;align-items:center}:host .breadcrumb{position:relative;top:5px}:host .body{min-height:40px}:host .body>*:not(:last-child){margin-right:5px}:host .body .label,:host .body .newLabel{flex:1}@media screen and (max-width: 600px){:host .body{flex-direction:column;align-items:flex-start}:host .body>*:not(:last-child){margin-bottom:10px!important}:host .body natural-icon{display:none}}\n"] }]
+            args: [{ selector: 'natural-detail-header', template: "<div class=\"breadcrumb\">\n    <a [routerLink]=\"isPanel ? [] : getRootLink()\" [fragment]=\"listFragment\" color=\"primary\" mat-button>{{\n        rootLabel || label\n    }}</a>\n    <ng-container *ngFor=\"let parent of breadcrumbs\">\n        /\n        <a [routerLink]=\"isPanel ? [] : getLink(parent.id)\" color=\"primary\" mat-button>\n            {{ parent?.fullName || parent?.name }}</a\n        >\n    </ng-container>\n</div>\n\n<div class=\"body\">\n    <div *ngIf=\"icon\" style=\"width: 30px\">\n        <natural-icon [name]=\"icon\"></natural-icon>\n    </div>\n    <div *ngIf=\"!model.id\" class=\"mat-headline no-margin newLabel\">{{ newLabel }}</div>\n    <div *ngIf=\"model.id\" class=\"mat-headline no-margin label\">{{ model.name || model.fullName || label }}</div>\n    <div>\n        <ng-content></ng-content>\n    </div>\n</div>\n", styles: [":host{display:flex;flex-direction:column}:host .breadcrumb,:host .body{display:flex;flex-direction:row;align-items:center}:host .breadcrumb{position:relative;top:5px}:host .body{min-height:40px}:host .body>*:not(:last-child){margin-right:5px}:host .body .label,:host .body .newLabel{flex:1}@media screen and (max-width: 600px){:host .body{flex-direction:column;align-items:flex-start}:host .body>*:not(:last-child){margin-bottom:10px!important}:host .body natural-icon{display:none}}\n"] }]
         }], propDecorators: { currentBaseUrl: [{
                 type: Input
             }], isPanel: [{
@@ -5068,10 +5076,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImpor
 
 class NaturalDetailHeaderModule {
 }
-NaturalDetailHeaderModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalDetailHeaderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NaturalDetailHeaderModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalDetailHeaderModule, declarations: [NaturalDetailHeaderComponent], imports: [CommonModule, RouterModule, MatButtonModule, NaturalIconModule], exports: [NaturalDetailHeaderComponent] });
-NaturalDetailHeaderModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalDetailHeaderModule, imports: [[CommonModule, RouterModule, MatButtonModule, NaturalIconModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalDetailHeaderModule, decorators: [{
+NaturalDetailHeaderModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalDetailHeaderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NaturalDetailHeaderModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: NaturalDetailHeaderModule, declarations: [NaturalDetailHeaderComponent], imports: [CommonModule, RouterModule, MatButtonModule, NaturalIconModule], exports: [NaturalDetailHeaderComponent] });
+NaturalDetailHeaderModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalDetailHeaderModule, imports: [CommonModule, RouterModule, MatButtonModule, NaturalIconModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalDetailHeaderModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [NaturalDetailHeaderComponent],
@@ -5190,12 +5198,12 @@ class NaturalDropdownContainerComponent extends BasePortalOutlet {
         }
     }
 }
-NaturalDropdownContainerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalDropdownContainerComponent, deps: [{ token: i0.ElementRef }, { token: i1$6.ConfigurableFocusTrapFactory }, { token: NATURAL_DROPDOWN_CONTAINER_DATA }], target: i0.ɵɵFactoryTarget.Component });
-NaturalDropdownContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: NaturalDropdownContainerComponent, selector: "ng-component", viewQueries: [{ propertyName: "portalOutlet", first: true, predicate: CdkPortalOutlet, descendants: true, static: true }, { propertyName: "templateRef", first: true, predicate: TemplateRef, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<div\n    (@transformMenu.done)=\"onAnimationDone($event)\"\n    [@transformMenu]=\"panelAnimationState\"\n    class=\"natural-dropdown-container mat-elevation-z2\"\n    role=\"menu\"\n    tabindex=\"-1\"\n>\n    <div class=\"natural-dropdown-container-content\">\n        <ng-template cdkPortalOutlet></ng-template>\n    </div>\n\n    <div *ngIf=\"data.showValidateButton\" class=\"natural-dropdown-validate-button\">\n        <button (click)=\"close()\" color=\"primary\" mat-raised-button i18n>Valider</button>\n    </div>\n</div>\n", styles: [".natural-dropdown-container{display:flex;flex-direction:column;border-radius:2px;height:100%}.natural-dropdown-container-content{flex:1;padding:5px;overflow:auto}.natural-dropdown-container .natural-dropdown-validate-button{flex:none;display:flex;flex-direction:row;justify-content:flex-end;margin:5px}\n"], components: [{ type: i1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i3.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], animations: [naturalDropdownAnimations.transformMenu, naturalDropdownAnimations.fadeInItems], encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalDropdownContainerComponent, decorators: [{
+NaturalDropdownContainerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalDropdownContainerComponent, deps: [{ token: i0.ElementRef }, { token: i1$5.ConfigurableFocusTrapFactory }, { token: NATURAL_DROPDOWN_CONTAINER_DATA }], target: i0.ɵɵFactoryTarget.Component });
+NaturalDropdownContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: NaturalDropdownContainerComponent, selector: "ng-component", viewQueries: [{ propertyName: "portalOutlet", first: true, predicate: CdkPortalOutlet, descendants: true, static: true }, { propertyName: "templateRef", first: true, predicate: TemplateRef, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<div\n    (@transformMenu.done)=\"onAnimationDone($event)\"\n    [@transformMenu]=\"panelAnimationState\"\n    class=\"natural-dropdown-container mat-elevation-z2\"\n    role=\"menu\"\n    tabindex=\"-1\"\n>\n    <div class=\"natural-dropdown-container-content\">\n        <ng-template cdkPortalOutlet></ng-template>\n    </div>\n\n    <div *ngIf=\"data.showValidateButton\" class=\"natural-dropdown-validate-button\">\n        <button (click)=\"close()\" color=\"primary\" mat-raised-button i18n>Valider</button>\n    </div>\n</div>\n", styles: [".natural-dropdown-container{display:flex;flex-direction:column;border-radius:2px;height:100%}.natural-dropdown-container-content{flex:1;padding:5px;overflow:auto}.natural-dropdown-container .natural-dropdown-validate-button{flex:none;display:flex;flex-direction:row;justify-content:flex-end;margin:5px}\n"], dependencies: [{ kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i4$1.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }], animations: [naturalDropdownAnimations.transformMenu, naturalDropdownAnimations.fadeInItems], encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalDropdownContainerComponent, decorators: [{
             type: Component,
             args: [{ encapsulation: ViewEncapsulation.None, preserveWhitespaces: false, animations: [naturalDropdownAnimations.transformMenu, naturalDropdownAnimations.fadeInItems], template: "<div\n    (@transformMenu.done)=\"onAnimationDone($event)\"\n    [@transformMenu]=\"panelAnimationState\"\n    class=\"natural-dropdown-container mat-elevation-z2\"\n    role=\"menu\"\n    tabindex=\"-1\"\n>\n    <div class=\"natural-dropdown-container-content\">\n        <ng-template cdkPortalOutlet></ng-template>\n    </div>\n\n    <div *ngIf=\"data.showValidateButton\" class=\"natural-dropdown-validate-button\">\n        <button (click)=\"close()\" color=\"primary\" mat-raised-button i18n>Valider</button>\n    </div>\n</div>\n", styles: [".natural-dropdown-container{display:flex;flex-direction:column;border-radius:2px;height:100%}.natural-dropdown-container-content{flex:1;padding:5px;overflow:auto}.natural-dropdown-container .natural-dropdown-validate-button{flex:none;display:flex;flex-direction:row;justify-content:flex-end;margin:5px}\n"] }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1$6.ConfigurableFocusTrapFactory }, { type: undefined, decorators: [{
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1$5.ConfigurableFocusTrapFactory }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [NATURAL_DROPDOWN_CONTAINER_DATA]
                 }] }]; }, propDecorators: { portalOutlet: [{
@@ -5301,14 +5309,14 @@ class NaturalDropdownService {
         ]);
     }
 }
-NaturalDropdownService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalDropdownService, deps: [{ token: i1$7.Overlay }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Injectable });
-NaturalDropdownService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalDropdownService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalDropdownService, decorators: [{
+NaturalDropdownService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalDropdownService, deps: [{ token: i1$6.Overlay }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Injectable });
+NaturalDropdownService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalDropdownService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalDropdownService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
                 }]
-        }], ctorParameters: function () { return [{ type: i1$7.Overlay }, { type: i0.Injector }]; } });
+        }], ctorParameters: function () { return [{ type: i1$6.Overlay }, { type: i0.Injector }]; } });
 
 const possibleComparableOperators = [
     {
@@ -5357,7 +5365,7 @@ class TypeSelectComponent extends NaturalAbstractController {
         this.renderedValue = new BehaviorSubject('');
         this.requireValueCtrl = false;
         this.operators = possibleDiscreteOperators;
-        this.operatorCtrl = new FormControl('is');
+        this.operatorCtrl = new FormControl('is', { nonNullable: true });
         this.valueCtrl = new FormControl();
         this.form = new FormGroup({
             operator: this.operatorCtrl,
@@ -5475,7 +5483,7 @@ class TypeSelectComponent extends NaturalAbstractController {
         else if (condition.null && !condition.null.not) {
             return 'none';
         }
-        return null;
+        return 'is';
     }
     operatorKeyToCondition(key, values) {
         switch (key) {
@@ -5492,9 +5500,9 @@ class TypeSelectComponent extends NaturalAbstractController {
         }
     }
 }
-TypeSelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: TypeSelectComponent, deps: [{ token: NATURAL_DROPDOWN_DATA }], target: i0.ɵɵFactoryTarget.Component });
-TypeSelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: TypeSelectComponent, selector: "ng-component", viewQueries: [{ propertyName: "list", first: true, predicate: MatSelectionList, descendants: true }], usesInheritance: true, ngImport: i0, template: "<form [formGroup]=\"form\">\n    <mat-form-field style=\"max-width: 7em; margin-right: 1em\">\n        <mat-label i18n=\"Mathematical operator < > =\">Op\u00E9rateur</mat-label>\n        <mat-select [formControl]=\"operatorCtrl\" [required]=\"true\">\n            <mat-option *ngFor=\"let item of operators\" [value]=\"item.key\">\n                {{ item.label }}\n            </mat-option>\n        </mat-select>\n    </mat-form-field>\n\n    <mat-selection-list *ngIf=\"requireValueCtrl\" [formControl]=\"valueCtrl\">\n        <mat-list-option *ngFor=\"let item of items\" [value]=\"getId(item)\" checkboxPosition=\"before\">\n            {{ getDisplay(item) }}\n        </mat-list-option>\n    </mat-selection-list>\n</form>\n", components: [{ type: i2$4.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i2$5.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i1$8.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { type: i4.MatSelectionList, selector: "mat-selection-list", inputs: ["disableRipple", "tabIndex", "color", "compareWith", "disabled", "multiple"], outputs: ["selectionChange"], exportAs: ["matSelectionList"] }, { type: i4.MatListOption, selector: "mat-list-option", inputs: ["disableRipple", "checkboxPosition", "color", "value", "disabled", "selected"], outputs: ["selectedChange"], exportAs: ["matListOption"] }], directives: [{ type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2$4.MatLabel, selector: "mat-label" }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i5.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: TypeSelectComponent, decorators: [{
+TypeSelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: TypeSelectComponent, deps: [{ token: NATURAL_DROPDOWN_DATA }], target: i0.ɵɵFactoryTarget.Component });
+TypeSelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: TypeSelectComponent, selector: "ng-component", viewQueries: [{ propertyName: "list", first: true, predicate: MatSelectionList, descendants: true }], usesInheritance: true, ngImport: i0, template: "<form [formGroup]=\"form\">\n    <mat-form-field style=\"max-width: 7em; margin-right: 1em\">\n        <mat-label i18n=\"Mathematical operator < > =\">Op\u00E9rateur</mat-label>\n        <mat-select [formControl]=\"operatorCtrl\" [required]=\"true\">\n            <mat-option *ngFor=\"let item of operators\" [value]=\"item.key\">\n                {{ item.label }}\n            </mat-option>\n        </mat-select>\n    </mat-form-field>\n\n    <mat-selection-list *ngIf=\"requireValueCtrl\" [formControl]=\"valueCtrl\">\n        <mat-list-option *ngFor=\"let item of items\" [value]=\"getId(item)\" checkboxPosition=\"before\">\n            {{ getDisplay(item) }}\n        </mat-list-option>\n    </mat-selection-list>\n</form>\n", dependencies: [{ kind: "directive", type: i1$3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "component", type: i4$2.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i4$3.MatSelectionList, selector: "mat-selection-list", inputs: ["disableRipple", "color", "compareWith", "disabled", "multiple"], outputs: ["selectionChange"], exportAs: ["matSelectionList"] }, { kind: "component", type: i4$3.MatListOption, selector: "mat-list-option", inputs: ["disableRipple", "checkboxPosition", "color", "value", "disabled", "selected"], outputs: ["selectedChange"], exportAs: ["matListOption"] }, { kind: "component", type: i4$4.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i1$7.MatOption, selector: "mat-option", exportAs: ["matOption"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: TypeSelectComponent, decorators: [{
             type: Component,
             args: [{ template: "<form [formGroup]=\"form\">\n    <mat-form-field style=\"max-width: 7em; margin-right: 1em\">\n        <mat-label i18n=\"Mathematical operator < > =\">Op\u00E9rateur</mat-label>\n        <mat-select [formControl]=\"operatorCtrl\" [required]=\"true\">\n            <mat-option *ngFor=\"let item of operators\" [value]=\"item.key\">\n                {{ item.label }}\n            </mat-option>\n        </mat-select>\n    </mat-form-field>\n\n    <mat-selection-list *ngIf=\"requireValueCtrl\" [formControl]=\"valueCtrl\">\n        <mat-list-option *ngFor=\"let item of items\" [value]=\"getId(item)\" checkboxPosition=\"before\">\n            {{ getDisplay(item) }}\n        </mat-list-option>\n    </mat-selection-list>\n</form>\n" }]
         }], ctorParameters: function () { return [{ type: undefined, decorators: [{
@@ -5510,7 +5518,7 @@ class AbstractAssociationSelectComponent {
         this.renderedValue = new BehaviorSubject('');
         this.requireValueCtrl = false;
         this.operators = possibleDiscreteOperators;
-        this.operatorCtrl = new FormControl('is');
+        this.operatorCtrl = new FormControl('is', { nonNullable: true });
         this.valueCtrl = new FormControl();
         this.form = new FormGroup({
             operator: this.operatorCtrl,
@@ -5570,7 +5578,7 @@ class AbstractAssociationSelectComponent {
         else if (condition.empty && !condition.empty.not) {
             return 'none';
         }
-        return null;
+        return 'is';
     }
     operatorKeyToCondition(key, values) {
         switch (key) {
@@ -5587,9 +5595,9 @@ class AbstractAssociationSelectComponent {
         }
     }
 }
-AbstractAssociationSelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: AbstractAssociationSelectComponent, deps: [{ token: NATURAL_DROPDOWN_DATA }], target: i0.ɵɵFactoryTarget.Directive });
-AbstractAssociationSelectComponent.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.0", type: AbstractAssociationSelectComponent, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: AbstractAssociationSelectComponent, decorators: [{
+AbstractAssociationSelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: AbstractAssociationSelectComponent, deps: [{ token: NATURAL_DROPDOWN_DATA }], target: i0.ɵɵFactoryTarget.Directive });
+AbstractAssociationSelectComponent.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.1.1", type: AbstractAssociationSelectComponent, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: AbstractAssociationSelectComponent, decorators: [{
             type: Directive
         }], ctorParameters: function () { return [{ type: undefined, decorators: [{
                     type: Inject,
@@ -5647,7 +5655,7 @@ class AbstractSelect extends NaturalAbstractController {
          * - NaturalSelectHierarchicComponent: `string | null`.
          * - NaturalSelectEnumComponent: `V | null`.
          */
-        this.internalCtrl = new FormControl();
+        this.internalCtrl = new FormControl(null);
         if (this.ngControl) {
             this.ngControl.valueAccessor = this;
         }
@@ -5708,7 +5716,7 @@ class AbstractSelect extends NaturalAbstractController {
         this.disabled = isDisabled;
     }
     showClearButton() {
-        return this.internalCtrl?.enabled && this.clearLabel && this.internalCtrl.value;
+        return this.internalCtrl?.enabled && !!this.clearLabel && !!this.internalCtrl.value;
     }
     touch() {
         if (this.onTouched) {
@@ -5743,11 +5751,11 @@ class AbstractSelect extends NaturalAbstractController {
         this.internalCtrl.updateValueAndValidity();
     }
 }
-AbstractSelect.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: AbstractSelect, deps: [{ token: i5.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Directive });
-AbstractSelect.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.0", type: AbstractSelect, inputs: { placeholder: "placeholder", floatPlaceholder: "floatPlaceholder", required: "required", navigateTo: "navigateTo", clearLabel: "clearLabel", showIcon: "showIcon", icon: "icon", displayWith: "displayWith", disabled: "disabled" }, outputs: { selectionChange: "selectionChange", blur: "blur" }, usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: AbstractSelect, decorators: [{
+AbstractSelect.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: AbstractSelect, deps: [{ token: i3.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Directive });
+AbstractSelect.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.1.1", type: AbstractSelect, inputs: { placeholder: "placeholder", floatPlaceholder: "floatPlaceholder", required: "required", navigateTo: "navigateTo", clearLabel: "clearLabel", showIcon: "showIcon", icon: "icon", displayWith: "displayWith", disabled: "disabled" }, outputs: { selectionChange: "selectionChange", blur: "blur" }, usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: AbstractSelect, decorators: [{
             type: Directive
-        }], ctorParameters: function () { return [{ type: i5.NgControl, decorators: [{
+        }], ctorParameters: function () { return [{ type: i3.NgControl, decorators: [{
                     type: Optional
                 }, {
                     type: Self
@@ -5928,7 +5936,7 @@ class NaturalSelectComponent extends AbstractSelect {
         }
     }
     showClearButton() {
-        return this.internalCtrl?.enabled && this.clearLabel && this.internalCtrl.value;
+        return this.internalCtrl?.enabled && !!this.clearLabel && !!this.internalCtrl.value;
     }
     getSearchFilter(term) {
         let field = {};
@@ -5941,11 +5949,11 @@ class NaturalSelectComponent extends AbstractSelect {
         return { filter: { groups: [{ conditions: [field] }] } };
     }
 }
-NaturalSelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSelectComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-NaturalSelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: NaturalSelectComponent, selector: "natural-select", inputs: { service: "service", optionRequired: "optionRequired", searchField: "searchField", filter: "filter", disabled: "disabled" }, queries: [{ propertyName: "itemTemplate", first: true, predicate: TemplateRef, descendants: true }], viewQueries: [{ propertyName: "autoTrigger", first: true, predicate: MatAutocompleteTrigger, descendants: true }], usesInheritance: true, ngImport: i0, template: "<!-- Autocomplete menu -->\n<mat-autocomplete\n    #ac=\"matAutocomplete\"\n    (optionSelected)=\"propagateValue($event?.option?.value)\"\n    [displayWith]=\"getDisplayFn()\"\n    panelWidth=\"auto !important\"\n>\n    <mat-option *ngFor=\"let item of items | async\" [value]=\"item\">\n        <ng-template\n            [ngTemplateOutletContext]=\"{item: item}\"\n            [ngTemplateOutlet]=\"itemTemplate ? itemTemplate : defaultACItem\"\n        ></ng-template>\n    </mat-option>\n    <div *ngIf=\"moreNbItems > 0\" class=\"mat-caption\" i18n style=\"padding: 5px 10px\"\n        >{{ moreNbItems }} \u00E9l\u00E9ment(s) suppl\u00E9mentaire(s)</div\n    >\n</mat-autocomplete>\n\n<ng-template #defaultACItem let-item=\"item\">\n    <span>{{ getDisplayFn()(item) }}</span>\n</ng-template>\n\n<!-- Input for autocomplete -->\n<mat-form-field [floatLabel]=\"floatPlaceholder\">\n    <mat-label>{{ placeholder }}</mat-label>\n\n    <input\n        (blur)=\"touch(); blur.emit()\"\n        (change)=\"onInternalFormChange()\"\n        (click)=\"autoTrigger.openPanel()\"\n        (focus)=\"startSearch()\"\n        (keydown.esc)=\"clear()\"\n        [formControl]=\"internalCtrl\"\n        [matAutocomplete]=\"ac\"\n        aria-label=\"Recherche et s\u00E9lection\"\n        i18n-aria-label\n        matInput\n        [errorStateMatcher]=\"matcher\"\n    />\n\n    <!-- Meta data -->\n    <natural-icon *ngIf=\"!loading && showIcon\" [name]=\"icon\" matPrefix></natural-icon>\n    <mat-progress-spinner\n        *ngIf=\"loading\"\n        [diameter]=\"21\"\n        [strokeWidth]=\"5\"\n        matPrefix\n        mode=\"indeterminate\"\n    ></mat-progress-spinner>\n\n    <!-- Clear button -->\n    <div class=\"suffix-buttons\" matSuffix>\n        <button\n            (click)=\"clear(); $event.stopPropagation()\"\n            *ngIf=\"internalCtrl.value && internalCtrl.enabled && !clearLabel\"\n            mat-icon-button\n            i18n-matTooltip\n            matTooltip=\"D\u00E9s\u00E9lectionner\"\n        >\n            <natural-icon name=\"close\"></natural-icon>\n        </button>\n        <button\n            *ngIf=\"internalCtrl.value && navigateTo\"\n            [routerLink]=\"navigateTo\"\n            mat-button\n            mat-icon-button\n            i18n-matTooltip\n            matTooltip=\"Naviguer vers\"\n        >\n            <natural-icon name=\"open_in_browser\"></natural-icon>\n        </button>\n    </div>\n\n    <mat-error *ngIf=\"hasRequiredError()\" i18n>Ce champ est requis</mat-error>\n</mat-form-field>\n\n<!-- Additional (un)select/(un)link buttons for more visual cohesion with natural-relations --><!-- [clearLabel] and/or [selectLabel] has to be given as attribute input -->\n<div *ngIf=\"showClearButton()\" class=\"external-buttons\">\n    <button (click)=\"clear()\" *ngIf=\"showClearButton()\" color=\"warn\" mat-button>{{ clearLabel }}</button>\n</div>\n", styles: [":host{display:flex;flex-direction:column}:host>*:not(:last-child){margin-bottom:20px}:host>mat-autocomplete{margin-bottom:0!important}:host .suffix-buttons,:host .external-buttons{display:flex;flex-direction:row}:host .external-buttons{display:flex;flex-direction:row}:host .external-buttons>*:not(:last-child){margin-right:10px}\n"], components: [{ type: i1$9.MatAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple"], exportAs: ["matAutocomplete"] }, { type: i1$8.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { type: i2$4.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: NaturalIconComponent, selector: "natural-icon", inputs: ["label", "labelColor", "labelPosition", "name", "size"] }, { type: i5$1.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "diameter", "strokeWidth", "mode", "value"], exportAs: ["matProgressSpinner"] }, { type: i1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i6.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$4.MatLabel, selector: "mat-label" }, { type: i7.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"] }, { type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i1$9.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i2$4.MatPrefix, selector: "[matPrefix]" }, { type: i2$4.MatSuffix, selector: "[matSuffix]" }, { type: i10.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { type: i2$1.RouterLink, selector: ":not(a):not(area)[routerLink]", inputs: ["queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { type: i2$4.MatError, selector: "mat-error", inputs: ["id"] }], pipes: { "async": i6.AsyncPipe } });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSelectComponent, decorators: [{
+NaturalSelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalSelectComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+NaturalSelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: NaturalSelectComponent, selector: "natural-select", inputs: { service: "service", optionRequired: "optionRequired", searchField: "searchField", filter: "filter", disabled: "disabled" }, queries: [{ propertyName: "itemTemplate", first: true, predicate: TemplateRef, descendants: true }], viewQueries: [{ propertyName: "autoTrigger", first: true, predicate: MatAutocompleteTrigger, descendants: true }], usesInheritance: true, ngImport: i0, template: "<!-- Autocomplete menu -->\n<mat-autocomplete\n    #ac=\"matAutocomplete\"\n    (optionSelected)=\"propagateValue($event.option.value)\"\n    [displayWith]=\"getDisplayFn()\"\n    panelWidth=\"auto !important\"\n>\n    <mat-option *ngFor=\"let item of items | async\" [value]=\"item\">\n        <ng-template\n            [ngTemplateOutletContext]=\"{item: item}\"\n            [ngTemplateOutlet]=\"itemTemplate ? itemTemplate : defaultACItem\"\n        ></ng-template>\n    </mat-option>\n    <div *ngIf=\"moreNbItems > 0\" class=\"mat-caption\" i18n style=\"padding: 5px 10px\"\n        >{{ moreNbItems }} \u00E9l\u00E9ment(s) suppl\u00E9mentaire(s)</div\n    >\n</mat-autocomplete>\n\n<ng-template #defaultACItem let-item=\"item\">\n    <span>{{ getDisplayFn()(item) }}</span>\n</ng-template>\n\n<!-- Input for autocomplete -->\n<mat-form-field [floatLabel]=\"floatPlaceholder\">\n    <mat-label>{{ placeholder }}</mat-label>\n\n    <input\n        (blur)=\"touch(); blur.emit()\"\n        (change)=\"onInternalFormChange()\"\n        (click)=\"autoTrigger.openPanel()\"\n        (focus)=\"startSearch()\"\n        (keydown.esc)=\"clear()\"\n        [formControl]=\"internalCtrl\"\n        [matAutocomplete]=\"ac\"\n        aria-label=\"Recherche et s\u00E9lection\"\n        i18n-aria-label\n        matInput\n        [errorStateMatcher]=\"matcher\"\n    />\n\n    <!-- Meta data -->\n    <natural-icon *ngIf=\"!loading && showIcon\" [name]=\"icon\" matPrefix></natural-icon>\n    <mat-progress-spinner\n        *ngIf=\"loading\"\n        [diameter]=\"21\"\n        [strokeWidth]=\"5\"\n        matPrefix\n        mode=\"indeterminate\"\n    ></mat-progress-spinner>\n\n    <!-- Clear button -->\n    <div class=\"suffix-buttons\" matSuffix>\n        <button\n            (click)=\"clear(); $event.stopPropagation()\"\n            *ngIf=\"internalCtrl.value && internalCtrl.enabled && !clearLabel\"\n            mat-icon-button\n            i18n-matTooltip\n            matTooltip=\"D\u00E9s\u00E9lectionner\"\n        >\n            <natural-icon name=\"close\"></natural-icon>\n        </button>\n        <button\n            *ngIf=\"internalCtrl.value && navigateTo\"\n            [routerLink]=\"navigateTo\"\n            mat-button\n            mat-icon-button\n            i18n-matTooltip\n            matTooltip=\"Naviguer vers\"\n        >\n            <natural-icon name=\"open_in_browser\"></natural-icon>\n        </button>\n    </div>\n\n    <mat-error *ngIf=\"hasRequiredError()\" i18n>Ce champ est requis</mat-error>\n</mat-form-field>\n\n<!-- Additional (un)select/(un)link buttons for more visual cohesion with natural-relations --><!-- [clearLabel] and/or [selectLabel] has to be given as attribute input -->\n<div *ngIf=\"showClearButton()\" class=\"external-buttons\">\n    <button (click)=\"clear()\" *ngIf=\"showClearButton()\" color=\"warn\" mat-button>{{ clearLabel }}</button>\n</div>\n", styles: [":host{display:flex;flex-direction:column}:host>*:not(:last-child){margin-bottom:20px}:host>mat-autocomplete{margin-bottom:0!important}:host .suffix-buttons,:host .external-buttons{display:flex;flex-direction:row}:host .external-buttons{display:flex;flex-direction:row}:host .external-buttons>*:not(:last-child){margin-right:10px}\n"], dependencies: [{ kind: "directive", type: i1$3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2$3.MatAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple"], exportAs: ["matAutocomplete"] }, { kind: "directive", type: i2$3.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i1$7.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "component", type: i4.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i4$2.MatError, selector: "mat-error", inputs: ["id"] }, { kind: "component", type: i4$2.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4$2.MatPrefix, selector: "[matPrefix]" }, { kind: "directive", type: i4$2.MatSuffix, selector: "[matSuffix]" }, { kind: "directive", type: i5$1.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$1.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "diameter", "strokeWidth", "mode", "value"], exportAs: ["matProgressSpinner"] }, { kind: "directive", type: i7.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: NaturalIconComponent, selector: "natural-icon", inputs: ["label", "labelColor", "labelPosition", "name", "size"] }, { 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.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$1.RouterLink, selector: ":not(a):not(area)[routerLink]", inputs: ["queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalSelectComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'natural-select', template: "<!-- Autocomplete menu -->\n<mat-autocomplete\n    #ac=\"matAutocomplete\"\n    (optionSelected)=\"propagateValue($event?.option?.value)\"\n    [displayWith]=\"getDisplayFn()\"\n    panelWidth=\"auto !important\"\n>\n    <mat-option *ngFor=\"let item of items | async\" [value]=\"item\">\n        <ng-template\n            [ngTemplateOutletContext]=\"{item: item}\"\n            [ngTemplateOutlet]=\"itemTemplate ? itemTemplate : defaultACItem\"\n        ></ng-template>\n    </mat-option>\n    <div *ngIf=\"moreNbItems > 0\" class=\"mat-caption\" i18n style=\"padding: 5px 10px\"\n        >{{ moreNbItems }} \u00E9l\u00E9ment(s) suppl\u00E9mentaire(s)</div\n    >\n</mat-autocomplete>\n\n<ng-template #defaultACItem let-item=\"item\">\n    <span>{{ getDisplayFn()(item) }}</span>\n</ng-template>\n\n<!-- Input for autocomplete -->\n<mat-form-field [floatLabel]=\"floatPlaceholder\">\n    <mat-label>{{ placeholder }}</mat-label>\n\n    <input\n        (blur)=\"touch(); blur.emit()\"\n        (change)=\"onInternalFormChange()\"\n        (click)=\"autoTrigger.openPanel()\"\n        (focus)=\"startSearch()\"\n        (keydown.esc)=\"clear()\"\n        [formControl]=\"internalCtrl\"\n        [matAutocomplete]=\"ac\"\n        aria-label=\"Recherche et s\u00E9lection\"\n        i18n-aria-label\n        matInput\n        [errorStateMatcher]=\"matcher\"\n    />\n\n    <!-- Meta data -->\n    <natural-icon *ngIf=\"!loading && showIcon\" [name]=\"icon\" matPrefix></natural-icon>\n    <mat-progress-spinner\n        *ngIf=\"loading\"\n        [diameter]=\"21\"\n        [strokeWidth]=\"5\"\n        matPrefix\n        mode=\"indeterminate\"\n    ></mat-progress-spinner>\n\n    <!-- Clear button -->\n    <div class=\"suffix-buttons\" matSuffix>\n        <button\n            (click)=\"clear(); $event.stopPropagation()\"\n            *ngIf=\"internalCtrl.value && internalCtrl.enabled && !clearLabel\"\n            mat-icon-button\n            i18n-matTooltip\n            matTooltip=\"D\u00E9s\u00E9lectionner\"\n        >\n            <natural-icon name=\"close\"></natural-icon>\n        </button>\n        <button\n            *ngIf=\"internalCtrl.value && navigateTo\"\n            [routerLink]=\"navigateTo\"\n            mat-button\n            mat-icon-button\n            i18n-matTooltip\n            matTooltip=\"Naviguer vers\"\n        >\n            <natural-icon name=\"open_in_browser\"></natural-icon>\n        </button>\n    </div>\n\n    <mat-error *ngIf=\"hasRequiredError()\" i18n>Ce champ est requis</mat-error>\n</mat-form-field>\n\n<!-- Additional (un)select/(un)link buttons for more visual cohesion with natural-relations --><!-- [clearLabel] and/or [selectLabel] has to be given as attribute input -->\n<div *ngIf=\"showClearButton()\" class=\"external-buttons\">\n    <button (click)=\"clear()\" *ngIf=\"showClearButton()\" color=\"warn\" mat-button>{{ clearLabel }}</button>\n</div>\n", styles: [":host{display:flex;flex-direction:column}:host>*:not(:last-child){margin-bottom:20px}:host>mat-autocomplete{margin-bottom:0!important}:host .suffix-buttons,:host .external-buttons{display:flex;flex-direction:row}:host .external-buttons{display:flex;flex-direction:row}:host .external-buttons>*:not(:last-child){margin-right:10px}\n"] }]
+            args: [{ selector: 'natural-select', template: "<!-- Autocomplete menu -->\n<mat-autocomplete\n    #ac=\"matAutocomplete\"\n    (optionSelected)=\"propagateValue($event.option.value)\"\n    [displayWith]=\"getDisplayFn()\"\n    panelWidth=\"auto !important\"\n>\n    <mat-option *ngFor=\"let item of items | async\" [value]=\"item\">\n        <ng-template\n            [ngTemplateOutletContext]=\"{item: item}\"\n            [ngTemplateOutlet]=\"itemTemplate ? itemTemplate : defaultACItem\"\n        ></ng-template>\n    </mat-option>\n    <div *ngIf=\"moreNbItems > 0\" class=\"mat-caption\" i18n style=\"padding: 5px 10px\"\n        >{{ moreNbItems }} \u00E9l\u00E9ment(s) suppl\u00E9mentaire(s)</div\n    >\n</mat-autocomplete>\n\n<ng-template #defaultACItem let-item=\"item\">\n    <span>{{ getDisplayFn()(item) }}</span>\n</ng-template>\n\n<!-- Input for autocomplete -->\n<mat-form-field [floatLabel]=\"floatPlaceholder\">\n    <mat-label>{{ placeholder }}</mat-label>\n\n    <input\n        (blur)=\"touch(); blur.emit()\"\n        (change)=\"onInternalFormChange()\"\n        (click)=\"autoTrigger.openPanel()\"\n        (focus)=\"startSearch()\"\n        (keydown.esc)=\"clear()\"\n        [formControl]=\"internalCtrl\"\n        [matAutocomplete]=\"ac\"\n        aria-label=\"Recherche et s\u00E9lection\"\n        i18n-aria-label\n        matInput\n        [errorStateMatcher]=\"matcher\"\n    />\n\n    <!-- Meta data -->\n    <natural-icon *ngIf=\"!loading && showIcon\" [name]=\"icon\" matPrefix></natural-icon>\n    <mat-progress-spinner\n        *ngIf=\"loading\"\n        [diameter]=\"21\"\n        [strokeWidth]=\"5\"\n        matPrefix\n        mode=\"indeterminate\"\n    ></mat-progress-spinner>\n\n    <!-- Clear button -->\n    <div class=\"suffix-buttons\" matSuffix>\n        <button\n            (click)=\"clear(); $event.stopPropagation()\"\n            *ngIf=\"internalCtrl.value && internalCtrl.enabled && !clearLabel\"\n            mat-icon-button\n            i18n-matTooltip\n            matTooltip=\"D\u00E9s\u00E9lectionner\"\n        >\n            <natural-icon name=\"close\"></natural-icon>\n        </button>\n        <button\n            *ngIf=\"internalCtrl.value && navigateTo\"\n            [routerLink]=\"navigateTo\"\n            mat-button\n            mat-icon-button\n            i18n-matTooltip\n            matTooltip=\"Naviguer vers\"\n        >\n            <natural-icon name=\"open_in_browser\"></natural-icon>\n        </button>\n    </div>\n\n    <mat-error *ngIf=\"hasRequiredError()\" i18n>Ce champ est requis</mat-error>\n</mat-form-field>\n\n<!-- Additional (un)select/(un)link buttons for more visual cohesion with natural-relations --><!-- [clearLabel] and/or [selectLabel] has to be given as attribute input -->\n<div *ngIf=\"showClearButton()\" class=\"external-buttons\">\n    <button (click)=\"clear()\" *ngIf=\"showClearButton()\" color=\"warn\" mat-button>{{ clearLabel }}</button>\n</div>\n", styles: [":host{display:flex;flex-direction:column}:host>*:not(:last-child){margin-bottom:20px}:host>mat-autocomplete{margin-bottom:0!important}:host .suffix-buttons,:host .external-buttons{display:flex;flex-direction:row}:host .external-buttons{display:flex;flex-direction:row}:host .external-buttons>*:not(:last-child){margin-right:10px}\n"] }]
         }], propDecorators: { autoTrigger: [{
                 type: ViewChild,
                 args: [MatAutocompleteTrigger]
@@ -5985,9 +5993,9 @@ class TypeNaturalSelectComponent extends AbstractAssociationSelectComponent {
         return selectedName;
     }
 }
-TypeNaturalSelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: TypeNaturalSelectComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-TypeNaturalSelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: TypeNaturalSelectComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<form [formGroup]=\"form\">\n    <mat-form-field style=\"max-width: 7em; margin-right: 1em\">\n        <mat-label i18n=\"Mathematical operator < > =\">Op\u00E9rateur</mat-label>\n        <mat-select [formControl]=\"operatorCtrl\" [required]=\"true\">\n            <mat-option *ngFor=\"let item of operators\" [value]=\"item.key\">\n                {{ item.label }}\n            </mat-option>\n        </mat-select>\n    </mat-form-field>\n\n    <natural-select\n        style=\"display: inline\"\n        *ngIf=\"configuration && requireValueCtrl\"\n        [formControl]=\"valueCtrl\"\n        [placeholder]=\"configuration.placeholder\"\n        [service]=\"configuration.service\"\n        [filter]=\"configuration.filter\"\n    ></natural-select>\n</form>\n", components: [{ type: i2$4.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i2$5.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i1$8.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { type: NaturalSelectComponent, selector: "natural-select", inputs: ["service", "optionRequired", "searchField", "filter", "disabled"] }], directives: [{ type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2$4.MatLabel, selector: "mat-label" }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i5.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: TypeNaturalSelectComponent, decorators: [{
+TypeNaturalSelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: TypeNaturalSelectComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+TypeNaturalSelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: TypeNaturalSelectComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<form [formGroup]=\"form\">\n    <mat-form-field style=\"max-width: 7em; margin-right: 1em\">\n        <mat-label i18n=\"Mathematical operator < > =\">Op\u00E9rateur</mat-label>\n        <mat-select [formControl]=\"operatorCtrl\" [required]=\"true\">\n            <mat-option *ngFor=\"let item of operators\" [value]=\"item.key\">\n                {{ item.label }}\n            </mat-option>\n        </mat-select>\n    </mat-form-field>\n\n    <natural-select\n        style=\"display: inline\"\n        *ngIf=\"configuration && requireValueCtrl\"\n        [formControl]=\"valueCtrl\"\n        [placeholder]=\"configuration.placeholder\"\n        [service]=\"configuration.service\"\n        [filter]=\"configuration.filter\"\n    ></natural-select>\n</form>\n", dependencies: [{ kind: "directive", type: i1$3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "component", type: i4$2.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i4$4.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i1$7.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "component", type: NaturalSelectComponent, selector: "natural-select", inputs: ["service", "optionRequired", "searchField", "filter", "disabled"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: TypeNaturalSelectComponent, decorators: [{
             type: Component,
             args: [{ template: "<form [formGroup]=\"form\">\n    <mat-form-field style=\"max-width: 7em; margin-right: 1em\">\n        <mat-label i18n=\"Mathematical operator < > =\">Op\u00E9rateur</mat-label>\n        <mat-select [formControl]=\"operatorCtrl\" [required]=\"true\">\n            <mat-option *ngFor=\"let item of operators\" [value]=\"item.key\">\n                {{ item.label }}\n            </mat-option>\n        </mat-select>\n    </mat-form-field>\n\n    <natural-select\n        style=\"display: inline\"\n        *ngIf=\"configuration && requireValueCtrl\"\n        [formControl]=\"valueCtrl\"\n        [placeholder]=\"configuration.placeholder\"\n        [service]=\"configuration.service\"\n        [filter]=\"configuration.filter\"\n    ></natural-select>\n</form>\n" }]
         }] });
@@ -6001,17 +6009,20 @@ class TypeTextComponent {
     constructor(data, dropdownRef) {
         this.dropdownRef = dropdownRef;
         this.renderedValue = new BehaviorSubject('');
-        this.formCtrl = new FormControl();
+        this.formCtrl = new FormControl('', { nonNullable: true });
         this.matcher = new InvalidWithValueStateMatcher$1();
         this.formCtrl.valueChanges.subscribe(value => {
             this.renderedValue.next(value === null ? '' : this.formCtrl.value + '');
         });
         this.formCtrl.setValidators([Validators.required]);
         if (data.condition && data.condition.like) {
-            this.formCtrl.setValue(data.condition.like.value);
+            this.formCtrl.setValue('' + data.condition.like.value);
         }
     }
     getCondition() {
+        if (!this.formCtrl.value) {
+            return {};
+        }
         return { like: { value: this.formCtrl.value } };
     }
     isValid() {
@@ -6029,9 +6040,9 @@ class TypeTextComponent {
         }
     }
 }
-TypeTextComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: TypeTextComponent, deps: [{ token: NATURAL_DROPDOWN_DATA }, { token: NaturalDropdownRef }], target: i0.ɵɵFactoryTarget.Component });
-TypeTextComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: TypeTextComponent, selector: "ng-component", ngImport: i0, template: "<mat-form-field>\n    <mat-label i18n>Valeur</mat-label>\n    <input\n        (keydown.enter)=\"close()\"\n        [errorStateMatcher]=\"matcher\"\n        [formControl]=\"formCtrl\"\n        [required]=\"true\"\n        matInput\n        type=\"text\"\n    />\n    <mat-error *ngIf=\"formCtrl.hasError('required')\">*</mat-error>\n</mat-form-field>\n", styles: [":host input::-webkit-outer-spin-button,:host input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"], components: [{ type: i2$4.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }], directives: [{ type: i2$4.MatLabel, selector: "mat-label" }, { type: i7.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"] }, { type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i5.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$4.MatError, selector: "mat-error", inputs: ["id"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: TypeTextComponent, decorators: [{
+TypeTextComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: TypeTextComponent, deps: [{ token: NATURAL_DROPDOWN_DATA }, { token: NaturalDropdownRef }], target: i0.ɵɵFactoryTarget.Component });
+TypeTextComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: TypeTextComponent, selector: "ng-component", ngImport: i0, template: "<mat-form-field>\n    <mat-label i18n>Valeur</mat-label>\n    <input\n        (keydown.enter)=\"close()\"\n        [errorStateMatcher]=\"matcher\"\n        [formControl]=\"formCtrl\"\n        [required]=\"true\"\n        matInput\n        type=\"text\"\n    />\n    <mat-error *ngIf=\"formCtrl.hasError('required')\">*</mat-error>\n</mat-form-field>\n", styles: [":host input::-webkit-outer-spin-button,:host input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"], dependencies: [{ kind: "directive", type: i1$3.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4$2.MatError, selector: "mat-error", inputs: ["id"] }, { kind: "component", type: i4$2.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i5$1.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"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: TypeTextComponent, decorators: [{
             type: Component,
             args: [{ template: "<mat-form-field>\n    <mat-label i18n>Valeur</mat-label>\n    <input\n        (keydown.enter)=\"close()\"\n        [errorStateMatcher]=\"matcher\"\n        [formControl]=\"formCtrl\"\n        [required]=\"true\"\n        matInput\n        type=\"text\"\n    />\n    <mat-error *ngIf=\"formCtrl.hasError('required')\">*</mat-error>\n</mat-form-field>\n", styles: [":host input::-webkit-outer-spin-button,:host input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"] }]
         }], ctorParameters: function () { return [{ type: undefined, decorators: [{
@@ -6044,15 +6055,15 @@ class TypeNumberComponent {
         this.dropdownRef = dropdownRef;
         this.renderedValue = new BehaviorSubject('');
         this.configuration = {};
-        this.operatorCtrl = new FormControl('equal');
+        this.operatorCtrl = new FormControl('equal', { nonNullable: true });
         this.valueCtrl = new FormControl();
         this.matcher = new InvalidWithValueStateMatcher$1();
-        this.operators = possibleComparableOperators;
-        this.configuration = data.configuration || {};
         this.form = new FormGroup({
             operator: this.operatorCtrl,
             value: this.valueCtrl,
         });
+        this.operators = possibleComparableOperators;
+        this.configuration = data.configuration || {};
         merge$1(this.operatorCtrl.valueChanges, this.valueCtrl.valueChanges).subscribe(() => {
             const rendered = this.getRenderedValue();
             this.renderedValue.next(rendered);
@@ -6118,9 +6129,9 @@ class TypeNumberComponent {
         }
     }
 }
-TypeNumberComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: TypeNumberComponent, deps: [{ token: NATURAL_DROPDOWN_DATA }, { token: NaturalDropdownRef }], target: i0.ɵɵFactoryTarget.Component });
-TypeNumberComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: TypeNumberComponent, selector: "ng-component", ngImport: i0, template: "<form [formGroup]=\"form\">\n    <mat-form-field style=\"max-width: 4em; margin-right: 1em\">\n        <mat-label i18n=\"Mathematical operator < > =\">Op\u00E9rateur</mat-label>\n        <mat-select [formControl]=\"operatorCtrl\" [required]=\"true\">\n            <mat-option *ngFor=\"let item of operators\" [value]=\"item.key\">\n                {{ item.label }}\n            </mat-option>\n        </mat-select>\n    </mat-form-field>\n\n    <mat-form-field>\n        <mat-label i18n>Valeur</mat-label>\n        <input\n            (keydown.enter)=\"close()\"\n            [errorStateMatcher]=\"matcher\"\n            [formControl]=\"valueCtrl\"\n            [attr.max]=\"configuration.max\"\n            [attr.min]=\"configuration.min\"\n            [required]=\"true\"\n            [step]=\"configuration.step\"\n            matInput\n            type=\"number\"\n        />\n        <mat-error *ngIf=\"valueCtrl.hasError('min')\">< {{ configuration.min }}</mat-error>\n        <mat-error *ngIf=\"valueCtrl.hasError('max')\">> {{ configuration.max }}</mat-error>\n    </mat-form-field>\n</form>\n", styles: [":host input::-webkit-outer-spin-button,:host input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"], components: [{ type: i2$4.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i2$5.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i1$8.MatOption, selector: "mat-option", exportAs: ["matOption"] }], directives: [{ type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2$4.MatLabel, selector: "mat-label" }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i5.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i7.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"] }, { type: i5.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { type: i5.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { type: i5.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$4.MatError, selector: "mat-error", inputs: ["id"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: TypeNumberComponent, decorators: [{
+TypeNumberComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: TypeNumberComponent, deps: [{ token: NATURAL_DROPDOWN_DATA }, { token: NaturalDropdownRef }], target: i0.ɵɵFactoryTarget.Component });
+TypeNumberComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: TypeNumberComponent, selector: "ng-component", ngImport: i0, template: "<form [formGroup]=\"form\">\n    <mat-form-field style=\"max-width: 4em; margin-right: 1em\">\n        <mat-label i18n=\"Mathematical operator < > =\">Op\u00E9rateur</mat-label>\n        <mat-select [formControl]=\"operatorCtrl\" [required]=\"true\">\n            <mat-option *ngFor=\"let item of operators\" [value]=\"item.key\">\n                {{ item.label }}\n            </mat-option>\n        </mat-select>\n    </mat-form-field>\n\n    <mat-form-field>\n        <mat-label i18n>Valeur</mat-label>\n        <input\n            (keydown.enter)=\"close()\"\n            [errorStateMatcher]=\"matcher\"\n            [formControl]=\"valueCtrl\"\n            [attr.max]=\"configuration.max\"\n            [attr.min]=\"configuration.min\"\n            [required]=\"true\"\n            [step]=\"configuration.step\"\n            matInput\n            type=\"number\"\n        />\n        <mat-error *ngIf=\"valueCtrl.hasError('min')\">< {{ configuration.min }}</mat-error>\n        <mat-error *ngIf=\"valueCtrl.hasError('max')\">> {{ configuration.max }}</mat-error>\n    </mat-form-field>\n</form>\n", styles: [":host input::-webkit-outer-spin-button,:host input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"], dependencies: [{ kind: "directive", type: i1$3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { 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.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i3.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { kind: "directive", type: i4$2.MatError, selector: "mat-error", inputs: ["id"] }, { kind: "component", type: i4$2.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i5$1.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: i4$4.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i1$7.MatOption, selector: "mat-option", exportAs: ["matOption"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: TypeNumberComponent, decorators: [{
             type: Component,
             args: [{ template: "<form [formGroup]=\"form\">\n    <mat-form-field style=\"max-width: 4em; margin-right: 1em\">\n        <mat-label i18n=\"Mathematical operator < > =\">Op\u00E9rateur</mat-label>\n        <mat-select [formControl]=\"operatorCtrl\" [required]=\"true\">\n            <mat-option *ngFor=\"let item of operators\" [value]=\"item.key\">\n                {{ item.label }}\n            </mat-option>\n        </mat-select>\n    </mat-form-field>\n\n    <mat-form-field>\n        <mat-label i18n>Valeur</mat-label>\n        <input\n            (keydown.enter)=\"close()\"\n            [errorStateMatcher]=\"matcher\"\n            [formControl]=\"valueCtrl\"\n            [attr.max]=\"configuration.max\"\n            [attr.min]=\"configuration.min\"\n            [required]=\"true\"\n            [step]=\"configuration.step\"\n            matInput\n            type=\"number\"\n        />\n        <mat-error *ngIf=\"valueCtrl.hasError('min')\">< {{ configuration.min }}</mat-error>\n        <mat-error *ngIf=\"valueCtrl.hasError('max')\">> {{ configuration.max }}</mat-error>\n    </mat-form-field>\n</form>\n", styles: [":host input::-webkit-outer-spin-button,:host input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"] }]
         }], ctorParameters: function () { return [{ type: undefined, decorators: [{
@@ -6396,9 +6407,9 @@ class NaturalHierarchicSelectorService {
         return node || new HierarchicModelNode(item, configuration);
     }
 }
-NaturalHierarchicSelectorService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalHierarchicSelectorService, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Injectable });
-NaturalHierarchicSelectorService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalHierarchicSelectorService });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalHierarchicSelectorService, decorators: [{
+NaturalHierarchicSelectorService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalHierarchicSelectorService, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Injectable });
+NaturalHierarchicSelectorService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalHierarchicSelectorService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalHierarchicSelectorService, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: i0.Injector }]; } });
 
@@ -6434,9 +6445,9 @@ class FacetSelectorComponent {
         return true;
     }
 }
-FacetSelectorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: FacetSelectorComponent, deps: [{ token: NATURAL_DROPDOWN_DATA }, { token: NaturalDropdownRef }], target: i0.ɵɵFactoryTarget.Component });
-FacetSelectorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: FacetSelectorComponent, selector: "ng-component", ngImport: i0, template: "<mat-nav-list>\n    <mat-list-item (click)=\"selection = facet; close()\" *ngFor=\"let facet of facets\">\n        <a matLine>{{ facet.display }}</a>\n    </mat-list-item>\n</mat-nav-list>\n", styles: [":host .mat-nav-list{padding:0}\n"], components: [{ type: i4.MatNavList, selector: "mat-nav-list", inputs: ["disableRipple", "disabled"], exportAs: ["matNavList"] }, { type: i4.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["disableRipple", "disabled"], exportAs: ["matListItem"] }], directives: [{ type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1$8.MatLine, selector: "[mat-line], [matLine]" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: FacetSelectorComponent, decorators: [{
+FacetSelectorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: FacetSelectorComponent, deps: [{ token: NATURAL_DROPDOWN_DATA }, { token: NaturalDropdownRef }], target: i0.ɵɵFactoryTarget.Component });
+FacetSelectorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: FacetSelectorComponent, selector: "ng-component", ngImport: i0, template: "<mat-nav-list>\n    <mat-list-item (click)=\"selection = facet; close()\" *ngFor=\"let facet of facets\">\n        <a matLine>{{ facet.display }}</a>\n    </mat-list-item>\n</mat-nav-list>\n", styles: [":host .mat-nav-list{padding:0}\n"], dependencies: [{ kind: "directive", type: i1$3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i4$3.MatNavList, selector: "mat-nav-list", inputs: ["disableRipple", "disabled"], exportAs: ["matNavList"] }, { kind: "component", type: i4$3.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["disableRipple", "disabled"], exportAs: ["matListItem"] }, { kind: "directive", type: i1$7.MatLine, selector: "[mat-line], [matLine]" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: FacetSelectorComponent, decorators: [{
             type: Component,
             args: [{ template: "<mat-nav-list>\n    <mat-list-item (click)=\"selection = facet; close()\" *ngFor=\"let facet of facets\">\n        <a matLine>{{ facet.display }}</a>\n    </mat-list-item>\n</mat-nav-list>\n", styles: [":host .mat-nav-list{padding:0}\n"] }]
         }], ctorParameters: function () { return [{ type: undefined, decorators: [{
@@ -6459,11 +6470,10 @@ function isComponentValid(component) {
     };
 }
 class NaturalInputComponent {
-    constructor(element, dropdownService, injector, componentFactoryResolver) {
+    constructor(element, dropdownService, injector) {
         this.element = element;
         this.dropdownService = dropdownService;
         this.injector = injector;
-        this.componentFactoryResolver = componentFactoryResolver;
         /**
          * Name of the field on which do a global search (without facet)
          */
@@ -6487,7 +6497,7 @@ class NaturalInputComponent {
         /**
          * Controller for the input field
          */
-        this.formCtrl = new FormControl();
+        this.formCtrl = new FormControl(null);
         /**
          * Customer error matcher that should validate on each change (including initialisation)
          */
@@ -6569,7 +6579,7 @@ class NaturalInputComponent {
                 this.selection.field === this.searchFieldName &&
                 this.selection.condition.like) {
                 // global search mode
-                this.formCtrl.setValue(this.selection.condition.like.value);
+                this.formCtrl.setValue('' + this.selection.condition.like.value);
             }
             else {
                 // If component is invalid (no facet and not a global search), clear from result and destroy component
@@ -6630,9 +6640,10 @@ class NaturalInputComponent {
             condition: condition,
             configuration: facet.configuration,
         };
-        const injector = Injector.create({ providers: this.createProviders(data), parent: this.injector });
-        const factory = this.componentFactoryResolver.resolveComponentFactory(facet.component);
-        this.dropdownComponentRef = factory.create(injector);
+        const injector = createEnvironmentInjector(this.createProviders(data), this.injector);
+        this.dropdownComponentRef = createComponent(facet.component, {
+            environmentInjector: injector,
+        });
         return this.dropdownComponentRef.instance;
     }
     createProviders(data) {
@@ -6728,12 +6739,12 @@ class NaturalInputComponent {
         return selection;
     }
 }
-NaturalInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalInputComponent, deps: [{ token: i0.ElementRef }, { token: NaturalDropdownService }, { token: i0.Injector }, { token: i0.ComponentFactoryResolver }], target: i0.ɵɵFactoryTarget.Component });
-NaturalInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: NaturalInputComponent, selector: "natural-input", inputs: { placeholder: "placeholder", searchFieldName: "searchFieldName", selection: "selection", facets: "facets" }, outputs: { selectionChange: "selectionChange", cleared: "cleared" }, host: { listeners: { "focus": "focus()" } }, viewQueries: [{ propertyName: "ripple", first: true, predicate: MatRipple, descendants: true, static: true }, { propertyName: "input", first: true, predicate: ["input"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<!-- click condition should match to allow click action only when no other button is visible -->\n<mat-form-field #field matRipple (click)=\"!selection && !(facet && !selection) ? openDropdown() : null\">\n    <mat-label *ngIf=\"facet\">{{ facet.display }}</mat-label>\n    <mat-label *ngIf=\"!facet\">{{ placeholder }}</mat-label>\n\n    <input\n        #input\n        (blur)=\"search($event)\"\n        (keydown.enter)=\"search($event)\"\n        [attr.size]=\"length\"\n        [errorStateMatcher]=\"errorMatcher\"\n        [formControl]=\"formCtrl\"\n        [readonly]=\"(isDropdown() && !!selection) || isFlag()\"\n        autocomplete=\"off\"\n        matInput\n        type=\"text\"\n    />\n\n    <!-- TODO : replace this void button -->\n    <div *ngIf=\"!facet && !selection\" class=\"search-icon\" matPrefix>\n        <natural-icon name=\"search\"></natural-icon>\n    </div>\n\n    <button (click)=\"clear()\" *ngIf=\"selection\" mat-icon-button matSuffix>\n        <natural-icon name=\"close\"></natural-icon>\n    </button>\n\n    <button (click)=\"clear()\" *ngIf=\"facet && !selection\" mat-icon-button matSuffix>\n        <natural-icon name=\"undo\"></natural-icon>\n    </button>\n</mat-form-field>\n<div class=\"hide\">{{ formCtrl.value ? formCtrl.value : facet ? facet.display : placeholder }}</div>\n", styles: [":host{position:relative;overflow:hidden;border-top-left-radius:4px;border-top-right-radius:4px;display:flex;flex-direction:column}:host .mat-menu-ripple{top:0;left:0;right:0;bottom:0;position:absolute;pointer-events:none}:host .hide{color:transparent;height:0;margin:0 50px 0 10px;font-size:inherit;white-space:nowrap;font-family:Roboto,Helvetica Neue,sans-serif}:host .search-icon{display:block;width:35px;height:35px}:host .search-icon natural-icon{margin:5px auto 0}\n"], components: [{ type: i2$4.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: NaturalIconComponent, selector: "natural-icon", inputs: ["label", "labelColor", "labelPosition", "name", "size"] }, { type: i1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i1$8.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$4.MatLabel, selector: "mat-label" }, { type: i7.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"] }, { type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i2$4.MatPrefix, selector: "[matPrefix]" }, { type: i2$4.MatSuffix, selector: "[matSuffix]" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalInputComponent, decorators: [{
+NaturalInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalInputComponent, deps: [{ token: i0.ElementRef }, { token: NaturalDropdownService }, { token: i0.EnvironmentInjector }], target: i0.ɵɵFactoryTarget.Component });
+NaturalInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: NaturalInputComponent, selector: "natural-input", inputs: { placeholder: "placeholder", searchFieldName: "searchFieldName", selection: "selection", facets: "facets" }, outputs: { selectionChange: "selectionChange", cleared: "cleared" }, host: { listeners: { "focus": "focus()" } }, viewQueries: [{ propertyName: "ripple", first: true, predicate: MatRipple, descendants: true, static: true }, { propertyName: "input", first: true, predicate: ["input"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<!-- click condition should match to allow click action only when no other button is visible -->\n<mat-form-field #field matRipple (click)=\"!selection && !(facet && !selection) ? openDropdown() : null\">\n    <mat-label *ngIf=\"facet\">{{ facet.display }}</mat-label>\n    <mat-label *ngIf=\"!facet\">{{ placeholder }}</mat-label>\n\n    <input\n        #input\n        (blur)=\"search($event)\"\n        (keydown.enter)=\"search($event)\"\n        [attr.size]=\"length\"\n        [errorStateMatcher]=\"errorMatcher\"\n        [formControl]=\"formCtrl\"\n        [readonly]=\"(isDropdown() && !!selection) || isFlag()\"\n        autocomplete=\"off\"\n        matInput\n        type=\"text\"\n    />\n\n    <!-- TODO : replace this void button -->\n    <div *ngIf=\"!facet && !selection\" class=\"search-icon\" matPrefix>\n        <natural-icon name=\"search\"></natural-icon>\n    </div>\n\n    <button (click)=\"clear()\" *ngIf=\"selection\" mat-icon-button matSuffix>\n        <natural-icon name=\"close\"></natural-icon>\n    </button>\n\n    <button (click)=\"clear()\" *ngIf=\"facet && !selection\" mat-icon-button matSuffix>\n        <natural-icon name=\"undo\"></natural-icon>\n    </button>\n</mat-form-field>\n<div class=\"hide\">{{ formCtrl.value ? formCtrl.value : facet ? facet.display : placeholder }}</div>\n", styles: [":host{position:relative;overflow:hidden;border-top-left-radius:4px;border-top-right-radius:4px;display:flex;flex-direction:column}:host .mat-menu-ripple{top:0;left:0;right:0;bottom:0;position:absolute;pointer-events:none}:host .hide{color:transparent;height:0;margin:0 50px 0 10px;font-size:inherit;white-space:nowrap;font-family:Roboto,Helvetica Neue,sans-serif}:host .search-icon{display:block;width:35px;height:35px}:host .search-icon natural-icon{margin:5px auto 0}\n"], dependencies: [{ kind: "directive", type: i1$3.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i4$2.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4$2.MatPrefix, selector: "[matPrefix]" }, { kind: "directive", type: i4$2.MatSuffix, selector: "[matSuffix]" }, { kind: "directive", type: i5$1.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: i4.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i1$7.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "component", type: NaturalIconComponent, selector: "natural-icon", inputs: ["label", "labelColor", "labelPosition", "name", "size"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalInputComponent, decorators: [{
             type: Component,
             args: [{ selector: 'natural-input', template: "<!-- click condition should match to allow click action only when no other button is visible -->\n<mat-form-field #field matRipple (click)=\"!selection && !(facet && !selection) ? openDropdown() : null\">\n    <mat-label *ngIf=\"facet\">{{ facet.display }}</mat-label>\n    <mat-label *ngIf=\"!facet\">{{ placeholder }}</mat-label>\n\n    <input\n        #input\n        (blur)=\"search($event)\"\n        (keydown.enter)=\"search($event)\"\n        [attr.size]=\"length\"\n        [errorStateMatcher]=\"errorMatcher\"\n        [formControl]=\"formCtrl\"\n        [readonly]=\"(isDropdown() && !!selection) || isFlag()\"\n        autocomplete=\"off\"\n        matInput\n        type=\"text\"\n    />\n\n    <!-- TODO : replace this void button -->\n    <div *ngIf=\"!facet && !selection\" class=\"search-icon\" matPrefix>\n        <natural-icon name=\"search\"></natural-icon>\n    </div>\n\n    <button (click)=\"clear()\" *ngIf=\"selection\" mat-icon-button matSuffix>\n        <natural-icon name=\"close\"></natural-icon>\n    </button>\n\n    <button (click)=\"clear()\" *ngIf=\"facet && !selection\" mat-icon-button matSuffix>\n        <natural-icon name=\"undo\"></natural-icon>\n    </button>\n</mat-form-field>\n<div class=\"hide\">{{ formCtrl.value ? formCtrl.value : facet ? facet.display : placeholder }}</div>\n", styles: [":host{position:relative;overflow:hidden;border-top-left-radius:4px;border-top-right-radius:4px;display:flex;flex-direction:column}:host .mat-menu-ripple{top:0;left:0;right:0;bottom:0;position:absolute;pointer-events:none}:host .hide{color:transparent;height:0;margin:0 50px 0 10px;font-size:inherit;white-space:nowrap;font-family:Roboto,Helvetica Neue,sans-serif}:host .search-icon{display:block;width:35px;height:35px}:host .search-icon natural-icon{margin:5px auto 0}\n"] }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: NaturalDropdownService }, { type: i0.Injector }, { type: i0.ComponentFactoryResolver }]; }, propDecorators: { ripple: [{
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: NaturalDropdownService }, { type: i0.EnvironmentInjector }]; }, propDecorators: { ripple: [{
                 type: ViewChild,
                 args: [MatRipple, { static: true }]
             }], input: [{
@@ -6778,9 +6789,9 @@ class NaturalGroupComponent {
         this.selectionChange.emit(this.innerSelections);
     }
 }
-NaturalGroupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-NaturalGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: NaturalGroupComponent, selector: "natural-group", inputs: { placeholder: "placeholder", facets: "facets", selections: "selections" }, outputs: { selectionChange: "selectionChange" }, viewQueries: [{ propertyName: "newValueInput", first: true, predicate: ["newValueInput"], descendants: true }], ngImport: i0, template: "<natural-input\n    (cleared)=\"removeInput(i)\"\n    (selectionChange)=\"updateInput($event, i)\"\n    *ngFor=\"let selection of innerSelections; let i = index\"\n    [facets]=\"facets\"\n    [selection]=\"selection\"\n></natural-input>\n\n<natural-input\n    #newValueInput\n    (selectionChange)=\"addInput($event)\"\n    [facets]=\"facets\"\n    [placeholder]=\"placeholder\"\n    tabIndex=\"10\"\n    cdkFocusInitial\n></natural-input>\n", styles: [":host{display:flex;flex-direction:row;flex-wrap:wrap}:host natural-input{flex:none;display:inline-flex;margin-right:10px}:host natural-input:last-of-type{flex:1;margin-right:0;min-width:250px}\n"], components: [{ type: NaturalInputComponent, selector: "natural-input", inputs: ["placeholder", "searchFieldName", "selection", "facets"], outputs: ["selectionChange", "cleared"] }], directives: [{ type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalGroupComponent, decorators: [{
+NaturalGroupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+NaturalGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: NaturalGroupComponent, selector: "natural-group", inputs: { placeholder: "placeholder", facets: "facets", selections: "selections" }, outputs: { selectionChange: "selectionChange" }, viewQueries: [{ propertyName: "newValueInput", first: true, predicate: ["newValueInput"], descendants: true }], ngImport: i0, template: "<natural-input\n    (cleared)=\"removeInput(i)\"\n    (selectionChange)=\"updateInput($event, i)\"\n    *ngFor=\"let selection of innerSelections; let i = index\"\n    [facets]=\"facets\"\n    [selection]=\"selection\"\n></natural-input>\n\n<natural-input\n    #newValueInput\n    (selectionChange)=\"addInput($event)\"\n    [facets]=\"facets\"\n    [placeholder]=\"placeholder\"\n    tabIndex=\"10\"\n    cdkFocusInitial\n></natural-input>\n", styles: [":host{display:flex;flex-direction:row;flex-wrap:wrap}:host natural-input{flex:none;display:inline-flex;margin-right:10px}:host natural-input:last-of-type{flex:1;margin-right:0;min-width:250px}\n"], dependencies: [{ kind: "directive", type: i1$3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: NaturalInputComponent, selector: "natural-input", inputs: ["placeholder", "searchFieldName", "selection", "facets"], outputs: ["selectionChange", "cleared"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalGroupComponent, decorators: [{
             type: Component,
             args: [{ selector: 'natural-group', template: "<natural-input\n    (cleared)=\"removeInput(i)\"\n    (selectionChange)=\"updateInput($event, i)\"\n    *ngFor=\"let selection of innerSelections; let i = index\"\n    [facets]=\"facets\"\n    [selection]=\"selection\"\n></natural-input>\n\n<natural-input\n    #newValueInput\n    (selectionChange)=\"addInput($event)\"\n    [facets]=\"facets\"\n    [placeholder]=\"placeholder\"\n    tabIndex=\"10\"\n    cdkFocusInitial\n></natural-input>\n", styles: [":host{display:flex;flex-direction:row;flex-wrap:wrap}:host natural-input{flex:none;display:inline-flex;margin-right:10px}:host natural-input:last-of-type{flex:1;margin-right:0;min-width:250px}\n"] }]
         }], propDecorators: { newValueInput: [{
@@ -6850,9 +6861,9 @@ class NaturalSearchComponent {
         this.selectionChange.emit([[]]);
     }
 }
-NaturalSearchComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSearchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-NaturalSearchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: NaturalSearchComponent, selector: "natural-search", inputs: { placeholder: "placeholder", facets: "facets", multipleGroups: "multipleGroups", selections: "selections" }, outputs: { selectionChange: "selectionChange" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"natural-search\">\n    <div class=\"groupsWrapper\">\n        <div *ngFor=\"let groupSelections of innerSelections; let i = index; let last = last\" class=\"groupWrapper\">\n            <natural-group\n                (selectionChange)=\"updateGroup($event, i)\"\n                [facets]=\"facets\"\n                [placeholder]=\"placeholder\"\n                [selections]=\"groupSelections\"\n            ></natural-group>\n\n            <div class=\"endOfRowButton\">\n                <button (click)=\"removeGroup(i)\" *ngIf=\"innerSelections.length > 1\" mat-icon-button>\n                    <natural-icon name=\"remove\"></natural-icon>\n                </button>\n            </div>\n\n            <div class=\"endOfRowButton\">\n                <button (click)=\"addGroup()\" *ngIf=\"last && multipleGroups\" mat-icon-button>\n                    <natural-icon name=\"add\"></natural-icon>\n                </button>\n            </div>\n\n            <!-- Spaceholder to keep fields alignment (prevent to push until end of line)--->\n            <div *ngIf=\"!last\" class=\"spacer\"></div>\n        </div>\n    </div>\n\n    <div class=\"endOfRowButton\">\n        <button (click)=\"clear()\" mat-icon-button>\n            <natural-icon name=\"close\"></natural-icon>\n        </button>\n        <ng-content></ng-content>\n    </div>\n</div>\n", styles: [":host .natural-search{display:flex;flex-direction:row;align-items:flex-end}:host .natural-search .groupsWrapper{display:flex;flex-direction:column;flex:1}:host .natural-search .groupWrapper{display:flex;flex-direction:row;margin-bottom:10px}:host .natural-search .groupWrapper natural-group{flex:1}:host .natural-search .groupWrapper:last-of-type{margin-bottom:0}:host .natural-search .groupWrapper .spacer{width:40px;height:40px}:host .natural-search .endOfRowButton{height:53px;display:flex;flex-direction:row;align-items:center}\n"], components: [{ type: NaturalGroupComponent, selector: "natural-group", inputs: ["placeholder", "facets", "selections"], outputs: ["selectionChange"] }, { type: i1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: NaturalIconComponent, selector: "natural-icon", inputs: ["label", "labelColor", "labelPosition", "name", "size"] }], directives: [{ type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSearchComponent, decorators: [{
+NaturalSearchComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalSearchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+NaturalSearchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: NaturalSearchComponent, selector: "natural-search", inputs: { placeholder: "placeholder", facets: "facets", multipleGroups: "multipleGroups", selections: "selections" }, outputs: { selectionChange: "selectionChange" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"natural-search\">\n    <div class=\"groupsWrapper\">\n        <div *ngFor=\"let groupSelections of innerSelections; let i = index; let last = last\" class=\"groupWrapper\">\n            <natural-group\n                (selectionChange)=\"updateGroup($event, i)\"\n                [facets]=\"facets\"\n                [placeholder]=\"placeholder\"\n                [selections]=\"groupSelections\"\n            ></natural-group>\n\n            <div class=\"endOfRowButton\">\n                <button (click)=\"removeGroup(i)\" *ngIf=\"innerSelections.length > 1\" mat-icon-button>\n                    <natural-icon name=\"remove\"></natural-icon>\n                </button>\n            </div>\n\n            <div class=\"endOfRowButton\">\n                <button (click)=\"addGroup()\" *ngIf=\"last && multipleGroups\" mat-icon-button>\n                    <natural-icon name=\"add\"></natural-icon>\n                </button>\n            </div>\n\n            <!-- Spaceholder to keep fields alignment (prevent to push until end of line)--->\n            <div *ngIf=\"!last\" class=\"spacer\"></div>\n        </div>\n    </div>\n\n    <div class=\"endOfRowButton\">\n        <button (click)=\"clear()\" mat-icon-button>\n            <natural-icon name=\"close\"></natural-icon>\n        </button>\n        <ng-content></ng-content>\n    </div>\n</div>\n", styles: [":host .natural-search{display:flex;flex-direction:row;align-items:flex-end}:host .natural-search .groupsWrapper{display:flex;flex-direction:column;flex:1}:host .natural-search .groupWrapper{display:flex;flex-direction:row;margin-bottom:10px}:host .natural-search .groupWrapper natural-group{flex:1}:host .natural-search .groupWrapper:last-of-type{margin-bottom:0}:host .natural-search .groupWrapper .spacer{width:40px;height:40px}:host .natural-search .endOfRowButton{height:53px;display:flex;flex-direction:row;align-items:center}\n"], dependencies: [{ kind: "directive", type: i1$3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: NaturalIconComponent, selector: "natural-icon", inputs: ["label", "labelColor", "labelPosition", "name", "size"] }, { kind: "component", type: NaturalGroupComponent, selector: "natural-group", inputs: ["placeholder", "facets", "selections"], outputs: ["selectionChange"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalSearchComponent, decorators: [{
             type: Component,
             args: [{ selector: 'natural-search', template: "<div class=\"natural-search\">\n    <div class=\"groupsWrapper\">\n        <div *ngFor=\"let groupSelections of innerSelections; let i = index; let last = last\" class=\"groupWrapper\">\n            <natural-group\n                (selectionChange)=\"updateGroup($event, i)\"\n                [facets]=\"facets\"\n                [placeholder]=\"placeholder\"\n                [selections]=\"groupSelections\"\n            ></natural-group>\n\n            <div class=\"endOfRowButton\">\n                <button (click)=\"removeGroup(i)\" *ngIf=\"innerSelections.length > 1\" mat-icon-button>\n                    <natural-icon name=\"remove\"></natural-icon>\n                </button>\n            </div>\n\n            <div class=\"endOfRowButton\">\n                <button (click)=\"addGroup()\" *ngIf=\"last && multipleGroups\" mat-icon-button>\n                    <natural-icon name=\"add\"></natural-icon>\n                </button>\n            </div>\n\n            <!-- Spaceholder to keep fields alignment (prevent to push until end of line)--->\n            <div *ngIf=\"!last\" class=\"spacer\"></div>\n        </div>\n    </div>\n\n    <div class=\"endOfRowButton\">\n        <button (click)=\"clear()\" mat-icon-button>\n            <natural-icon name=\"close\"></natural-icon>\n        </button>\n        <ng-content></ng-content>\n    </div>\n</div>\n", styles: [":host .natural-search{display:flex;flex-direction:row;align-items:flex-end}:host .natural-search .groupsWrapper{display:flex;flex-direction:column;flex:1}:host .natural-search .groupWrapper{display:flex;flex-direction:row;margin-bottom:10px}:host .natural-search .groupWrapper natural-group{flex:1}:host .natural-search .groupWrapper:last-of-type{margin-bottom:0}:host .natural-search .groupWrapper .spacer{width:40px;height:40px}:host .natural-search .endOfRowButton{height:53px;display:flex;flex-direction:row;align-items:center}\n"] }]
         }], propDecorators: { placeholder: [{
@@ -7184,9 +7195,9 @@ class NaturalHierarchicSelectorComponent extends NaturalAbstractController {
         return model.__typename + '-' + model.id;
     }
 }
-NaturalHierarchicSelectorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalHierarchicSelectorComponent, deps: [{ token: NaturalHierarchicSelectorService }], target: i0.ɵɵFactoryTarget.Component });
-NaturalHierarchicSelectorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: NaturalHierarchicSelectorComponent, selector: "natural-hierarchic-selector", inputs: { displayWith: "displayWith", config: "config", multiple: "multiple", selected: "selected", allowUnselect: "allowUnselect", filters: "filters", searchFacets: "searchFacets", searchSelections: "searchSelections" }, outputs: { searchSelectionChange: "searchSelectionChange", selectionChange: "selectionChange" }, providers: [NaturalHierarchicSelectorService], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div [style.margin-bottom.px]=\"20\">\n    <natural-search\n        (selectionChange)=\"search($event)\"\n        [facets]=\"searchFacets\"\n        [selections]=\"searchSelections\"\n    ></natural-search>\n</div>\n\n<div class=\"body\">\n    <mat-progress-spinner\n        *ngIf=\"loading\"\n        [diameter]=\"36\"\n        mode=\"indeterminate\"\n        style=\"margin: 10px\"\n    ></mat-progress-spinner>\n\n    <mat-tree [dataSource]=\"dataSource\" [treeControl]=\"treeControl\">\n        <mat-tree-node *matTreeNodeDef=\"let node\" [ngClass]=\"{leaf: !node.expandable}\" matTreeNodePadding>\n            <button\n                (click)=\"loadChildren(node)\"\n                *ngIf=\"node.expandable\"\n                [attr.aria-label]=\"'toggle ' + node.name\"\n                mat-icon-button\n                matTreeNodeToggle\n            >\n                <mat-progress-spinner\n                    *ngIf=\"node.loading\"\n                    [diameter]=\"24\"\n                    [strokeWidth]=\"5\"\n                    mode=\"indeterminate\"\n                    style=\"margin: 8px\"\n                ></mat-progress-spinner>\n\n                <natural-icon\n                    *ngIf=\"!node.loading\"\n                    [name]=\"treeControl.isExpanded(node) ? 'expand_more' : 'chevron_right'\"\n                >\n                </natural-icon>\n            </button>\n\n            <mat-checkbox\n                (change)=\"toggleFlatNode(node)\"\n                [checked]=\"flatNodesSelection.isSelected(node)\"\n                [disabled]=\"!isNodeTogglable(node)\"\n                style=\"margin-right: 10px\"\n            >\n                <natural-icon\n                    *ngIf=\"node.node.config.icon\"\n                    [name]=\"node.node.config.icon\"\n                    style=\"margin-right: 10px\"\n                ></natural-icon>\n                <span>{{ node.name }}</span>\n            </mat-checkbox>\n        </mat-tree-node>\n    </mat-tree>\n\n    <mat-chip-list aria-orientation=\"vertical\" class=\"mat-chip-list-stacked\">\n        <mat-chip\n            (removed)=\"unselectModelNode(node)\"\n            *ngFor=\"let node of selectedNodes\"\n            [removable]=\"true\"\n            [selectable]=\"false\"\n        >\n            <natural-icon *ngIf=\"node.config.icon\" [name]=\"node.config.icon\"></natural-icon>\n            <div class=\"mat-body chip-label\">{{ node.model.name || node.model.fullName }}</div>\n            <natural-icon matChipRemove name=\"cancel\"></natural-icon>\n        </mat-chip>\n    </mat-chip-list>\n</div>\n\n<div *ngIf=\"!loading && !dataSource.data.length\" class=\"margin-v\" i18n>Aucun r\u00E9sultat</div>\n", styles: [":host{display:block}:host ul,:host li{-webkit-margin-before:0;-webkit-margin-after:0;list-style-type:none}:host natural-icon{width:18px;height:18px;font-size:18px;margin-right:5px}:host .mat-tree-node.leaf{margin-left:40px}:host .body{display:flex;flex-direction:row;justify-content:space-between}:host .body mat-tree{flex:66}:host .body mat-chip-list{flex:33}:host mat-tree{flex-shrink:0}:host mat-chip-list{margin-left:10px}:host mat-chip{display:flex;flex-direction:row;height:auto!important}:host mat-chip .chip-label{flex:1}\n"], components: [{ type: NaturalSearchComponent, selector: "natural-search", inputs: ["placeholder", "facets", "multipleGroups", "selections"], outputs: ["selectionChange"] }, { type: i5$1.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "diameter", "strokeWidth", "mode", "value"], exportAs: ["matProgressSpinner"] }, { type: i4$1.MatTree, selector: "mat-tree", exportAs: ["matTree"] }, { type: i1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: NaturalIconComponent, selector: "natural-icon", inputs: ["label", "labelColor", "labelPosition", "name", "size"] }, { type: i2$3.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: i8.MatChipList, selector: "mat-chip-list", inputs: ["errorStateMatcher", "multiple", "compareWith", "value", "required", "placeholder", "disabled", "aria-orientation", "selectable", "tabIndex"], outputs: ["change", "valueChange"], exportAs: ["matChipList"] }], directives: [{ type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4$1.MatTreeNodeDef, selector: "[matTreeNodeDef]", inputs: ["matTreeNodeDefWhen", "matTreeNode"] }, { type: i4$1.MatTreeNode, selector: "mat-tree-node", inputs: ["role", "disabled", "tabIndex"], exportAs: ["matTreeNode"] }, { type: i4$1.MatTreeNodePadding, selector: "[matTreeNodePadding]", inputs: ["matTreeNodePadding", "matTreeNodePaddingIndent"] }, { type: i6.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i4$1.MatTreeNodeToggle, selector: "[matTreeNodeToggle]", inputs: ["matTreeNodeToggleRecursive"] }, { type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i8.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["color", "disableRipple", "tabIndex", "selected", "value", "selectable", "disabled", "removable"], outputs: ["selectionChange", "destroyed", "removed"], exportAs: ["matChip"] }, { type: i8.MatChipRemove, selector: "[matChipRemove]" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalHierarchicSelectorComponent, decorators: [{
+NaturalHierarchicSelectorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalHierarchicSelectorComponent, deps: [{ token: NaturalHierarchicSelectorService }], target: i0.ɵɵFactoryTarget.Component });
+NaturalHierarchicSelectorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: NaturalHierarchicSelectorComponent, selector: "natural-hierarchic-selector", inputs: { displayWith: "displayWith", config: "config", multiple: "multiple", selected: "selected", allowUnselect: "allowUnselect", filters: "filters", searchFacets: "searchFacets", searchSelections: "searchSelections" }, outputs: { searchSelectionChange: "searchSelectionChange", selectionChange: "selectionChange" }, providers: [NaturalHierarchicSelectorService], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div [style.margin-bottom.px]=\"20\">\n    <natural-search\n        (selectionChange)=\"search($event)\"\n        [facets]=\"searchFacets\"\n        [selections]=\"searchSelections\"\n    ></natural-search>\n</div>\n\n<div class=\"body\">\n    <mat-progress-spinner\n        *ngIf=\"loading\"\n        [diameter]=\"36\"\n        mode=\"indeterminate\"\n        style=\"margin: 10px\"\n    ></mat-progress-spinner>\n\n    <mat-tree [dataSource]=\"dataSource\" [treeControl]=\"treeControl\">\n        <mat-tree-node *matTreeNodeDef=\"let node\" [ngClass]=\"{leaf: !node.expandable}\" matTreeNodePadding>\n            <button\n                (click)=\"loadChildren(node)\"\n                *ngIf=\"node.expandable\"\n                [attr.aria-label]=\"'toggle ' + node.name\"\n                mat-icon-button\n                matTreeNodeToggle\n            >\n                <mat-progress-spinner\n                    *ngIf=\"node.loading\"\n                    [diameter]=\"24\"\n                    [strokeWidth]=\"5\"\n                    mode=\"indeterminate\"\n                    style=\"margin: 8px\"\n                ></mat-progress-spinner>\n\n                <natural-icon\n                    *ngIf=\"!node.loading\"\n                    [name]=\"treeControl.isExpanded(node) ? 'expand_more' : 'chevron_right'\"\n                >\n                </natural-icon>\n            </button>\n\n            <mat-checkbox\n                (change)=\"toggleFlatNode(node)\"\n                [checked]=\"flatNodesSelection.isSelected(node)\"\n                [disabled]=\"!isNodeTogglable(node)\"\n                style=\"margin-right: 10px\"\n            >\n                <natural-icon\n                    *ngIf=\"node.node.config.icon\"\n                    [name]=\"node.node.config.icon\"\n                    style=\"margin-right: 10px\"\n                ></natural-icon>\n                <span>{{ node.name }}</span>\n            </mat-checkbox>\n        </mat-tree-node>\n    </mat-tree>\n\n    <mat-chip-list aria-orientation=\"vertical\" class=\"mat-chip-list-stacked\">\n        <mat-chip\n            (removed)=\"unselectModelNode(node)\"\n            *ngFor=\"let node of selectedNodes\"\n            [removable]=\"true\"\n            [selectable]=\"false\"\n        >\n            <natural-icon *ngIf=\"node.config.icon\" [name]=\"node.config.icon\"></natural-icon>\n            <div class=\"mat-body chip-label\">{{ node.model.name || node.model.fullName }}</div>\n            <natural-icon matChipRemove name=\"cancel\"></natural-icon>\n        </mat-chip>\n    </mat-chip-list>\n</div>\n\n<div *ngIf=\"!loading && !dataSource.data.length\" class=\"margin-v\" i18n>Aucun r\u00E9sultat</div>\n", styles: [":host{display:block}:host ul,:host li{-webkit-margin-before:0;-webkit-margin-after:0;list-style-type:none}:host natural-icon{width:18px;height:18px;font-size:18px;margin-right:5px}:host .mat-tree-node.leaf{margin-left:40px}:host .body{display:flex;flex-direction:row;justify-content:space-between}:host .body mat-tree{flex:66}:host .body mat-chip-list{flex:33}:host mat-tree{flex-shrink:0}:host mat-chip-list{margin-left:10px}:host mat-chip{display:flex;flex-direction:row;height:auto!important}:host mat-chip .chip-label{flex:1}\n"], dependencies: [{ kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "component", type: i4.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i5$2.MatTreeNodeDef, selector: "[matTreeNodeDef]", inputs: ["matTreeNodeDefWhen", "matTreeNode"] }, { kind: "directive", type: i5$2.MatTreeNodePadding, selector: "[matTreeNodePadding]", inputs: ["matTreeNodePadding", "matTreeNodePaddingIndent"] }, { kind: "directive", type: i5$2.MatTreeNodeToggle, selector: "[matTreeNodeToggle]", inputs: ["matTreeNodeToggleRecursive"] }, { kind: "component", type: i5$2.MatTree, selector: "mat-tree", exportAs: ["matTree"] }, { kind: "directive", type: i5$2.MatTreeNode, selector: "mat-tree-node", inputs: ["role", "disabled", "tabIndex"], exportAs: ["matTreeNode"] }, { kind: "component", type: i7$1.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "diameter", "strokeWidth", "mode", "value"], exportAs: ["matProgressSpinner"] }, { kind: "component", type: NaturalIconComponent, selector: "natural-icon", inputs: ["label", "labelColor", "labelPosition", "name", "size"] }, { kind: "component", type: i8.MatChipList, selector: "mat-chip-list", inputs: ["role", "aria-describedby", "errorStateMatcher", "multiple", "compareWith", "value", "required", "placeholder", "disabled", "aria-orientation", "selectable", "tabIndex"], outputs: ["change", "valueChange"], exportAs: ["matChipList"] }, { kind: "directive", type: i8.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["color", "disableRipple", "tabIndex", "role", "selected", "value", "selectable", "disabled", "removable"], outputs: ["selectionChange", "destroyed", "removed"], exportAs: ["matChip"] }, { kind: "directive", type: i8.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: NaturalSearchComponent, selector: "natural-search", inputs: ["placeholder", "facets", "multipleGroups", "selections"], outputs: ["selectionChange"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalHierarchicSelectorComponent, decorators: [{
             type: Component,
             args: [{ selector: 'natural-hierarchic-selector', providers: [NaturalHierarchicSelectorService], template: "<div [style.margin-bottom.px]=\"20\">\n    <natural-search\n        (selectionChange)=\"search($event)\"\n        [facets]=\"searchFacets\"\n        [selections]=\"searchSelections\"\n    ></natural-search>\n</div>\n\n<div class=\"body\">\n    <mat-progress-spinner\n        *ngIf=\"loading\"\n        [diameter]=\"36\"\n        mode=\"indeterminate\"\n        style=\"margin: 10px\"\n    ></mat-progress-spinner>\n\n    <mat-tree [dataSource]=\"dataSource\" [treeControl]=\"treeControl\">\n        <mat-tree-node *matTreeNodeDef=\"let node\" [ngClass]=\"{leaf: !node.expandable}\" matTreeNodePadding>\n            <button\n                (click)=\"loadChildren(node)\"\n                *ngIf=\"node.expandable\"\n                [attr.aria-label]=\"'toggle ' + node.name\"\n                mat-icon-button\n                matTreeNodeToggle\n            >\n                <mat-progress-spinner\n                    *ngIf=\"node.loading\"\n                    [diameter]=\"24\"\n                    [strokeWidth]=\"5\"\n                    mode=\"indeterminate\"\n                    style=\"margin: 8px\"\n                ></mat-progress-spinner>\n\n                <natural-icon\n                    *ngIf=\"!node.loading\"\n                    [name]=\"treeControl.isExpanded(node) ? 'expand_more' : 'chevron_right'\"\n                >\n                </natural-icon>\n            </button>\n\n            <mat-checkbox\n                (change)=\"toggleFlatNode(node)\"\n                [checked]=\"flatNodesSelection.isSelected(node)\"\n                [disabled]=\"!isNodeTogglable(node)\"\n                style=\"margin-right: 10px\"\n            >\n                <natural-icon\n                    *ngIf=\"node.node.config.icon\"\n                    [name]=\"node.node.config.icon\"\n                    style=\"margin-right: 10px\"\n                ></natural-icon>\n                <span>{{ node.name }}</span>\n            </mat-checkbox>\n        </mat-tree-node>\n    </mat-tree>\n\n    <mat-chip-list aria-orientation=\"vertical\" class=\"mat-chip-list-stacked\">\n        <mat-chip\n            (removed)=\"unselectModelNode(node)\"\n            *ngFor=\"let node of selectedNodes\"\n            [removable]=\"true\"\n            [selectable]=\"false\"\n        >\n            <natural-icon *ngIf=\"node.config.icon\" [name]=\"node.config.icon\"></natural-icon>\n            <div class=\"mat-body chip-label\">{{ node.model.name || node.model.fullName }}</div>\n            <natural-icon matChipRemove name=\"cancel\"></natural-icon>\n        </mat-chip>\n    </mat-chip-list>\n</div>\n\n<div *ngIf=\"!loading && !dataSource.data.length\" class=\"margin-v\" i18n>Aucun r\u00E9sultat</div>\n", styles: [":host{display:block}:host ul,:host li{-webkit-margin-before:0;-webkit-margin-after:0;list-style-type:none}:host natural-icon{width:18px;height:18px;font-size:18px;margin-right:5px}:host .mat-tree-node.leaf{margin-left:40px}:host .body{display:flex;flex-direction:row;justify-content:space-between}:host .body mat-tree{flex:66}:host .body mat-chip-list{flex:33}:host mat-tree{flex-shrink:0}:host mat-chip-list{margin-left:10px}:host mat-chip{display:flex;flex-direction:row;height:auto!important}:host mat-chip .chip-label{flex:1}\n"] }]
         }], ctorParameters: function () { return [{ type: NaturalHierarchicSelectorService }]; }, propDecorators: { displayWith: [{
@@ -7261,9 +7272,9 @@ class TypeHierarchicSelectorComponent extends AbstractAssociationSelectComponent
         return selection[this.configuration.key].length ? selection : null;
     }
 }
-TypeHierarchicSelectorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: TypeHierarchicSelectorComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-TypeHierarchicSelectorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: TypeHierarchicSelectorComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<form [formGroup]=\"form\">\n    <mat-form-field style=\"max-width: 7em; margin-right: 1em\">\n        <mat-label i18n=\"Mathematical operator < > =\">Op\u00E9rateur</mat-label>\n        <mat-select [formControl]=\"operatorCtrl\" [required]=\"true\">\n            <mat-option *ngFor=\"let item of operators\" [value]=\"item.key\">\n                {{ item.label }}\n            </mat-option>\n        </mat-select>\n    </mat-form-field>\n\n    <natural-hierarchic-selector\n        *ngIf=\"requireValueCtrl\"\n        (selectionChange)=\"selectionChange($event)\"\n        [config]=\"configuration.config\"\n        [filters]=\"configuration.filters\"\n        [multiple]=\"true\"\n        [selected]=\"valueCtrl.value || {}\"\n        style=\"margin-right: 20px\"\n    ></natural-hierarchic-selector>\n</form>\n", components: [{ type: i2$4.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i2$5.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i1$8.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { type: NaturalHierarchicSelectorComponent, selector: "natural-hierarchic-selector", inputs: ["displayWith", "config", "multiple", "selected", "allowUnselect", "filters", "searchFacets", "searchSelections"], outputs: ["searchSelectionChange", "selectionChange"] }], directives: [{ type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2$4.MatLabel, selector: "mat-label" }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i5.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: TypeHierarchicSelectorComponent, decorators: [{
+TypeHierarchicSelectorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: TypeHierarchicSelectorComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+TypeHierarchicSelectorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: TypeHierarchicSelectorComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<form [formGroup]=\"form\">\n    <mat-form-field style=\"max-width: 7em; margin-right: 1em\">\n        <mat-label i18n=\"Mathematical operator < > =\">Op\u00E9rateur</mat-label>\n        <mat-select [formControl]=\"operatorCtrl\" [required]=\"true\">\n            <mat-option *ngFor=\"let item of operators\" [value]=\"item.key\">\n                {{ item.label }}\n            </mat-option>\n        </mat-select>\n    </mat-form-field>\n\n    <natural-hierarchic-selector\n        *ngIf=\"requireValueCtrl\"\n        (selectionChange)=\"selectionChange($event)\"\n        [config]=\"configuration.config\"\n        [filters]=\"configuration.filters\"\n        [multiple]=\"true\"\n        [selected]=\"valueCtrl.value || {}\"\n        style=\"margin-right: 20px\"\n    ></natural-hierarchic-selector>\n</form>\n", dependencies: [{ kind: "directive", type: i1$3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "component", type: i4$2.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i4$4.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i1$7.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "component", type: NaturalHierarchicSelectorComponent, selector: "natural-hierarchic-selector", inputs: ["displayWith", "config", "multiple", "selected", "allowUnselect", "filters", "searchFacets", "searchSelections"], outputs: ["searchSelectionChange", "selectionChange"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: TypeHierarchicSelectorComponent, decorators: [{
             type: Component,
             args: [{ template: "<form [formGroup]=\"form\">\n    <mat-form-field style=\"max-width: 7em; margin-right: 1em\">\n        <mat-label i18n=\"Mathematical operator < > =\">Op\u00E9rateur</mat-label>\n        <mat-select [formControl]=\"operatorCtrl\" [required]=\"true\">\n            <mat-option *ngFor=\"let item of operators\" [value]=\"item.key\">\n                {{ item.label }}\n            </mat-option>\n        </mat-select>\n    </mat-form-field>\n\n    <natural-hierarchic-selector\n        *ngIf=\"requireValueCtrl\"\n        (selectionChange)=\"selectionChange($event)\"\n        [config]=\"configuration.config\"\n        [filters]=\"configuration.filters\"\n        [multiple]=\"true\"\n        [selected]=\"valueCtrl.value || {}\"\n        style=\"margin-right: 20px\"\n    ></natural-hierarchic-selector>\n</form>\n" }]
         }] });
@@ -7308,18 +7319,18 @@ class TypeDateComponent {
         this.dateAdapter = dateAdapter;
         this.dateFormats = dateFormats;
         this.renderedValue = new BehaviorSubject('');
-        this.operatorCtrl = new FormControl('equal');
-        this.valueCtrl = new FormControl();
+        this.operatorCtrl = new FormControl('equal', { nonNullable: true });
+        this.valueCtrl = new FormControl(null);
         this.operators = possibleComparableOperators;
+        this.form = new FormGroup({
+            operator: this.operatorCtrl,
+            value: this.valueCtrl,
+        });
         this.defaults = {
             min: null,
             max: null,
         };
         this.configuration = { ...this.defaults, ...data.configuration };
-        this.form = new FormGroup({
-            operator: this.operatorCtrl,
-            value: this.valueCtrl,
-        });
         merge$1(this.operatorCtrl.valueChanges, this.valueCtrl.valueChanges).subscribe(() => {
             this.renderedValue.next(this.getRenderedValue());
         });
@@ -7408,15 +7419,15 @@ class TypeDateComponent {
         }
     }
 }
-TypeDateComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: TypeDateComponent, deps: [{ token: NATURAL_DROPDOWN_DATA }, { token: i1$8.DateAdapter }, { token: MAT_DATE_FORMATS }], target: i0.ɵɵFactoryTarget.Component });
-TypeDateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: TypeDateComponent, selector: "ng-component", ngImport: i0, template: "<form [formGroup]=\"form\">\n    <mat-form-field style=\"max-width: 4em; margin-right: 1em\">\n        <mat-label i18n=\"Mathematical operator < > =\">Op\u00E9rateur</mat-label>\n        <mat-select [formControl]=\"operatorCtrl\" [required]=\"true\">\n            <mat-option *ngFor=\"let item of operators\" [value]=\"item.key\">\n                {{ item.label }}\n            </mat-option>\n        </mat-select>\n    </mat-form-field>\n\n    <mat-form-field>\n        <mat-label i18n>Date</mat-label>\n        <input\n            [formControl]=\"valueCtrl\"\n            [matDatepicker]=\"value\"\n            [max]=\"configuration.max\"\n            [min]=\"configuration.min\"\n            [required]=\"true\"\n            matInput\n        />\n        <mat-datepicker-toggle [for]=\"value\" matSuffix></mat-datepicker-toggle>\n        <mat-datepicker #value></mat-datepicker>\n        <mat-error>\n            <span *ngIf=\"valueCtrl.hasError('min')\">< {{ configuration.min }}</span>\n            <span *ngIf=\"valueCtrl.hasError('max')\">> {{ configuration.max }}</span>\n            <span *ngIf=\"valueCtrl.hasError('required')\">*</span>\n        </mat-error>\n    </mat-form-field>\n</form>\n", components: [{ type: i2$4.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i2$5.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i1$8.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { type: i4$2.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { type: i4$2.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }], directives: [{ type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2$4.MatLabel, selector: "mat-label" }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i5.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i7.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"] }, { type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i4$2.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { type: i2$4.MatSuffix, selector: "[matSuffix]" }, { type: i2$4.MatError, selector: "mat-error", inputs: ["id"] }, { type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: TypeDateComponent, decorators: [{
+TypeDateComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: TypeDateComponent, deps: [{ token: NATURAL_DROPDOWN_DATA }, { token: i1$7.DateAdapter }, { token: MAT_DATE_FORMATS }], target: i0.ɵɵFactoryTarget.Component });
+TypeDateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: TypeDateComponent, selector: "ng-component", ngImport: i0, template: "<form [formGroup]=\"form\">\n    <mat-form-field style=\"max-width: 4em; margin-right: 1em\">\n        <mat-label i18n=\"Mathematical operator < > =\">Op\u00E9rateur</mat-label>\n        <mat-select [formControl]=\"operatorCtrl\" [required]=\"true\">\n            <mat-option *ngFor=\"let item of operators\" [value]=\"item.key\">\n                {{ item.label }}\n            </mat-option>\n        </mat-select>\n    </mat-form-field>\n\n    <mat-form-field>\n        <mat-label i18n>Date</mat-label>\n        <input\n            [formControl]=\"valueCtrl\"\n            [matDatepicker]=\"value\"\n            [max]=\"configuration.max\"\n            [min]=\"configuration.min\"\n            [required]=\"true\"\n            matInput\n        />\n        <mat-datepicker-toggle [for]=\"value\" matSuffix></mat-datepicker-toggle>\n        <mat-datepicker #value></mat-datepicker>\n        <mat-error>\n            <span *ngIf=\"valueCtrl.hasError('min')\">< {{ configuration.min }}</span>\n            <span *ngIf=\"valueCtrl.hasError('max')\">> {{ configuration.max }}</span>\n            <span *ngIf=\"valueCtrl.hasError('required')\">*</span>\n        </mat-error>\n    </mat-form-field>\n</form>\n", dependencies: [{ kind: "directive", type: i1$3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { 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.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4$2.MatError, selector: "mat-error", inputs: ["id"] }, { kind: "component", type: i4$2.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4$2.MatSuffix, selector: "[matSuffix]" }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i5$1.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: i6.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i6.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i6.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: i4$4.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i1$7.MatOption, selector: "mat-option", exportAs: ["matOption"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: TypeDateComponent, decorators: [{
             type: Component,
             args: [{ template: "<form [formGroup]=\"form\">\n    <mat-form-field style=\"max-width: 4em; margin-right: 1em\">\n        <mat-label i18n=\"Mathematical operator < > =\">Op\u00E9rateur</mat-label>\n        <mat-select [formControl]=\"operatorCtrl\" [required]=\"true\">\n            <mat-option *ngFor=\"let item of operators\" [value]=\"item.key\">\n                {{ item.label }}\n            </mat-option>\n        </mat-select>\n    </mat-form-field>\n\n    <mat-form-field>\n        <mat-label i18n>Date</mat-label>\n        <input\n            [formControl]=\"valueCtrl\"\n            [matDatepicker]=\"value\"\n            [max]=\"configuration.max\"\n            [min]=\"configuration.min\"\n            [required]=\"true\"\n            matInput\n        />\n        <mat-datepicker-toggle [for]=\"value\" matSuffix></mat-datepicker-toggle>\n        <mat-datepicker #value></mat-datepicker>\n        <mat-error>\n            <span *ngIf=\"valueCtrl.hasError('min')\">< {{ configuration.min }}</span>\n            <span *ngIf=\"valueCtrl.hasError('max')\">> {{ configuration.max }}</span>\n            <span *ngIf=\"valueCtrl.hasError('required')\">*</span>\n        </mat-error>\n    </mat-form-field>\n</form>\n" }]
         }], ctorParameters: function () { return [{ type: undefined, decorators: [{
                     type: Inject,
                     args: [NATURAL_DROPDOWN_DATA]
-                }] }, { type: i1$8.DateAdapter }, { type: undefined, decorators: [{
+                }] }, { type: i1$7.DateAdapter }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_DATE_FORMATS]
                 }] }]; } });
@@ -7457,17 +7468,17 @@ class TypeDateRangeComponent {
         this.dateFormats = dateFormats;
         this.renderedValue = new BehaviorSubject('');
         this.matcher = new InvalidWithValueStateMatcher();
-        this.fromCtrl = new FormControl();
-        this.toCtrl = new FormControl();
+        this.fromCtrl = new FormControl(null);
+        this.toCtrl = new FormControl(null);
+        this.form = new FormGroup({
+            from: this.fromCtrl,
+            to: this.toCtrl,
+        });
         this.defaults = {
             min: null,
             max: null,
         };
         this.configuration = { ...this.defaults, ...data.configuration };
-        this.form = new FormGroup({
-            from: this.fromCtrl,
-            to: this.toCtrl,
-        });
         merge$1(this.fromCtrl.valueChanges, this.toCtrl.valueChanges).subscribe(() => {
             this.renderedValue.next(this.getRenderedValue());
         });
@@ -7532,23 +7543,23 @@ class TypeDateRangeComponent {
         }
     }
 }
-TypeDateRangeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: TypeDateRangeComponent, deps: [{ token: NATURAL_DROPDOWN_DATA }, { token: i1$8.DateAdapter }, { token: MAT_DATE_FORMATS }], target: i0.ɵɵFactoryTarget.Component });
-TypeDateRangeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: TypeDateRangeComponent, selector: "ng-component", ngImport: i0, template: "<form [formGroup]=\"form\">\n    <mat-form-field>\n        <input\n            matInput\n            [matDatepicker]=\"from\"\n            placeholder=\"De\"\n            [formControl]=\"fromCtrl\"\n            [errorStateMatcher]=\"matcher\"\n            [min]=\"configuration.min\"\n            [max]=\"configuration.max\"\n        />\n        <mat-datepicker-toggle matSuffix [for]=\"from\"></mat-datepicker-toggle>\n        <mat-datepicker #from></mat-datepicker>\n        <mat-error>\n            <span *ngIf=\"form.hasError('toGreaterThanFrom')\"\n                >{{ render(fromCtrl.value) }} > {{ render(toCtrl.value) }}</span\n            >\n            <span *ngIf=\"fromCtrl.hasError('min') && !form.hasError('toGreaterThanFrom')\"\n                >< {{ configuration.min }}</span\n            >\n            <span *ngIf=\"fromCtrl.hasError('max') && !form.hasError('toGreaterThanFrom')\"\n                >> {{ configuration.max }}</span\n            >\n            <span *ngIf=\"fromCtrl.hasError('required')\">*</span>\n        </mat-error>\n    </mat-form-field>\n\n    <mat-form-field>\n        <input\n            matInput\n            [matDatepicker]=\"to\"\n            placeholder=\"\u00E0\"\n            [formControl]=\"toCtrl\"\n            [errorStateMatcher]=\"matcher\"\n            [min]=\"configuration.min\"\n            [max]=\"configuration.max\"\n        />\n        <mat-datepicker-toggle matSuffix [for]=\"to\"></mat-datepicker-toggle>\n        <mat-datepicker #to></mat-datepicker>\n        <mat-error>\n            <span *ngIf=\"toCtrl.hasError('min') && !form.hasError('toGreaterThanFrom')\">< {{ configuration.min }}</span>\n            <span *ngIf=\"toCtrl.hasError('max') && !form.hasError('toGreaterThanFrom')\">> {{ configuration.max }}</span>\n            <span *ngIf=\"toCtrl.hasError('required')\">*</span>\n        </mat-error>\n    </mat-form-field>\n</form>\n", components: [{ type: i2$4.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i4$2.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { type: i4$2.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }], directives: [{ type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i7.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"] }, { type: i4$2.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i2$4.MatSuffix, selector: "[matSuffix]" }, { type: i2$4.MatError, selector: "mat-error", inputs: ["id"] }, { type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: TypeDateRangeComponent, decorators: [{
+TypeDateRangeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: TypeDateRangeComponent, deps: [{ token: NATURAL_DROPDOWN_DATA }, { token: i1$7.DateAdapter }, { token: MAT_DATE_FORMATS }], target: i0.ɵɵFactoryTarget.Component });
+TypeDateRangeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: TypeDateRangeComponent, selector: "ng-component", ngImport: i0, template: "<form [formGroup]=\"form\">\n    <mat-form-field>\n        <input\n            matInput\n            [matDatepicker]=\"from\"\n            placeholder=\"De\"\n            [formControl]=\"fromCtrl\"\n            [errorStateMatcher]=\"matcher\"\n            [min]=\"configuration.min\"\n            [max]=\"configuration.max\"\n        />\n        <mat-datepicker-toggle matSuffix [for]=\"from\"></mat-datepicker-toggle>\n        <mat-datepicker #from></mat-datepicker>\n        <mat-error>\n            <span *ngIf=\"form.hasError('toGreaterThanFrom')\"\n                >{{ render(fromCtrl.value) }} > {{ render(toCtrl.value) }}</span\n            >\n            <span *ngIf=\"fromCtrl.hasError('min') && !form.hasError('toGreaterThanFrom')\"\n                >< {{ configuration.min }}</span\n            >\n            <span *ngIf=\"fromCtrl.hasError('max') && !form.hasError('toGreaterThanFrom')\"\n                >> {{ configuration.max }}</span\n            >\n            <span *ngIf=\"fromCtrl.hasError('required')\">*</span>\n        </mat-error>\n    </mat-form-field>\n\n    <mat-form-field>\n        <input\n            matInput\n            [matDatepicker]=\"to\"\n            placeholder=\"\u00E0\"\n            [formControl]=\"toCtrl\"\n            [errorStateMatcher]=\"matcher\"\n            [min]=\"configuration.min\"\n            [max]=\"configuration.max\"\n        />\n        <mat-datepicker-toggle matSuffix [for]=\"to\"></mat-datepicker-toggle>\n        <mat-datepicker #to></mat-datepicker>\n        <mat-error>\n            <span *ngIf=\"toCtrl.hasError('min') && !form.hasError('toGreaterThanFrom')\">< {{ configuration.min }}</span>\n            <span *ngIf=\"toCtrl.hasError('max') && !form.hasError('toGreaterThanFrom')\">> {{ configuration.max }}</span>\n            <span *ngIf=\"toCtrl.hasError('required')\">*</span>\n        </mat-error>\n    </mat-form-field>\n</form>\n", dependencies: [{ kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { 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.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i4$2.MatError, selector: "mat-error", inputs: ["id"] }, { kind: "component", type: i4$2.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$2.MatSuffix, selector: "[matSuffix]" }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i5$1.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: i6.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i6.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i6.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: TypeDateRangeComponent, decorators: [{
             type: Component,
             args: [{ template: "<form [formGroup]=\"form\">\n    <mat-form-field>\n        <input\n            matInput\n            [matDatepicker]=\"from\"\n            placeholder=\"De\"\n            [formControl]=\"fromCtrl\"\n            [errorStateMatcher]=\"matcher\"\n            [min]=\"configuration.min\"\n            [max]=\"configuration.max\"\n        />\n        <mat-datepicker-toggle matSuffix [for]=\"from\"></mat-datepicker-toggle>\n        <mat-datepicker #from></mat-datepicker>\n        <mat-error>\n            <span *ngIf=\"form.hasError('toGreaterThanFrom')\"\n                >{{ render(fromCtrl.value) }} > {{ render(toCtrl.value) }}</span\n            >\n            <span *ngIf=\"fromCtrl.hasError('min') && !form.hasError('toGreaterThanFrom')\"\n                >< {{ configuration.min }}</span\n            >\n            <span *ngIf=\"fromCtrl.hasError('max') && !form.hasError('toGreaterThanFrom')\"\n                >> {{ configuration.max }}</span\n            >\n            <span *ngIf=\"fromCtrl.hasError('required')\">*</span>\n        </mat-error>\n    </mat-form-field>\n\n    <mat-form-field>\n        <input\n            matInput\n            [matDatepicker]=\"to\"\n            placeholder=\"\u00E0\"\n            [formControl]=\"toCtrl\"\n            [errorStateMatcher]=\"matcher\"\n            [min]=\"configuration.min\"\n            [max]=\"configuration.max\"\n        />\n        <mat-datepicker-toggle matSuffix [for]=\"to\"></mat-datepicker-toggle>\n        <mat-datepicker #to></mat-datepicker>\n        <mat-error>\n            <span *ngIf=\"toCtrl.hasError('min') && !form.hasError('toGreaterThanFrom')\">< {{ configuration.min }}</span>\n            <span *ngIf=\"toCtrl.hasError('max') && !form.hasError('toGreaterThanFrom')\">> {{ configuration.max }}</span>\n            <span *ngIf=\"toCtrl.hasError('required')\">*</span>\n        </mat-error>\n    </mat-form-field>\n</form>\n" }]
         }], ctorParameters: function () { return [{ type: undefined, decorators: [{
                     type: Inject,
                     args: [NATURAL_DROPDOWN_DATA]
-                }] }, { type: i1$8.DateAdapter }, { type: undefined, decorators: [{
+                }] }, { type: i1$7.DateAdapter }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_DATE_FORMATS]
                 }] }]; } });
 
 class NaturalSearchModule {
 }
-NaturalSearchModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSearchModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NaturalSearchModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSearchModule, declarations: [NaturalSearchComponent,
+NaturalSearchModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalSearchModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NaturalSearchModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: NaturalSearchModule, declarations: [NaturalSearchComponent,
         NaturalGroupComponent,
         NaturalInputComponent,
         NaturalDropdownContainerComponent,
@@ -7562,24 +7573,22 @@ NaturalSearchModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", ver
         OverlayModule,
         MatListModule,
         NaturalIconModule], exports: [NaturalSearchComponent] });
-NaturalSearchModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSearchModule, providers: [
+NaturalSearchModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalSearchModule, providers: [
         {
             provide: MAT_FORM_FIELD_DEFAULT_OPTIONS,
             useValue: { appearance: 'fill' },
         },
-    ], imports: [[
-            CommonModule,
-            ReactiveFormsModule,
-            MatInputModule,
-            MatButtonModule,
-            MatMenuModule,
-            MatRippleModule,
-            PortalModule,
-            OverlayModule,
-            MatListModule,
-            NaturalIconModule,
-        ]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSearchModule, decorators: [{
+    ], imports: [CommonModule,
+        ReactiveFormsModule,
+        MatInputModule,
+        MatButtonModule,
+        MatMenuModule,
+        MatRippleModule,
+        PortalModule,
+        OverlayModule,
+        MatListModule,
+        NaturalIconModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalSearchModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [
@@ -7625,15 +7634,15 @@ class NaturalHierarchicSelectorDialogComponent {
         this.dialogRef.close(result);
     }
 }
-NaturalHierarchicSelectorDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalHierarchicSelectorDialogComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i1$1.MatDialogRef }], target: i0.ɵɵFactoryTarget.Component });
-NaturalHierarchicSelectorDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: NaturalHierarchicSelectorDialogComponent, selector: "ng-component", ngImport: i0, template: "<h2 i18n mat-dialog-title>S\u00E9lection</h2>\n\n<mat-dialog-content>\n    <natural-hierarchic-selector\n        (selectionChange)=\"config.hierarchicSelection = $event\"\n        [selected]=\"config.hierarchicSelection ?? {}\"\n        [config]=\"config.hierarchicConfig\"\n        [filters]=\"config.hierarchicFilters\"\n        [multiple]=\"config.multiple ?? false\"\n        [allowUnselect]=\"config.allowUnselect ?? true\"\n        [searchFacets]=\"config.searchFacets ?? []\"\n        [searchSelections]=\"config.searchSelections ?? []\"\n        (searchSelectionChange)=\"searchSelectionsOutput = $event\"\n    ></natural-hierarchic-selector>\n</mat-dialog-content>\n\n<mat-dialog-actions>\n    <button [mat-dialog-close] mat-button i18n>Annuler</button>\n    <button (click)=\"close(config.hierarchicSelection)\" color=\"primary\" mat-raised-button\n        ><span i18n>Valider</span>\n    </button>\n</mat-dialog-actions>\n", styles: [":host mat-dialog-actions{display:flex;flex-direction:row;justify-content:flex-end}\n"], components: [{ type: NaturalHierarchicSelectorComponent, selector: "natural-hierarchic-selector", inputs: ["displayWith", "config", "multiple", "selected", "allowUnselect", "filters", "searchFacets", "searchSelections"], outputs: ["searchSelectionChange", "selectionChange"] }, { type: i1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i1$1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1$1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i1$1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }, { type: i1$1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalHierarchicSelectorDialogComponent, decorators: [{
+NaturalHierarchicSelectorDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalHierarchicSelectorDialogComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i1.MatDialogRef }], target: i0.ɵɵFactoryTarget.Component });
+NaturalHierarchicSelectorDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: NaturalHierarchicSelectorDialogComponent, selector: "ng-component", ngImport: i0, template: "<h2 i18n mat-dialog-title>S\u00E9lection</h2>\n\n<mat-dialog-content>\n    <natural-hierarchic-selector\n        (selectionChange)=\"config.hierarchicSelection = $event\"\n        [selected]=\"config.hierarchicSelection ?? {}\"\n        [config]=\"config.hierarchicConfig\"\n        [filters]=\"config.hierarchicFilters\"\n        [multiple]=\"config.multiple ?? false\"\n        [allowUnselect]=\"config.allowUnselect ?? true\"\n        [searchFacets]=\"config.searchFacets ?? []\"\n        [searchSelections]=\"config.searchSelections ?? []\"\n        (searchSelectionChange)=\"searchSelectionsOutput = $event\"\n    ></natural-hierarchic-selector>\n</mat-dialog-content>\n\n<mat-dialog-actions>\n    <button [mat-dialog-close] mat-button i18n>Annuler</button>\n    <button (click)=\"close(config.hierarchicSelection)\" color=\"primary\" mat-raised-button\n        ><span i18n>Valider</span>\n    </button>\n</mat-dialog-actions>\n", styles: [":host mat-dialog-actions{display:flex;flex-direction:row;justify-content:flex-end}\n"], dependencies: [{ kind: "component", type: i4.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "component", type: NaturalHierarchicSelectorComponent, selector: "natural-hierarchic-selector", inputs: ["displayWith", "config", "multiple", "selected", "allowUnselect", "filters", "searchFacets", "searchSelections"], outputs: ["searchSelectionChange", "selectionChange"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalHierarchicSelectorDialogComponent, decorators: [{
             type: Component,
             args: [{ template: "<h2 i18n mat-dialog-title>S\u00E9lection</h2>\n\n<mat-dialog-content>\n    <natural-hierarchic-selector\n        (selectionChange)=\"config.hierarchicSelection = $event\"\n        [selected]=\"config.hierarchicSelection ?? {}\"\n        [config]=\"config.hierarchicConfig\"\n        [filters]=\"config.hierarchicFilters\"\n        [multiple]=\"config.multiple ?? false\"\n        [allowUnselect]=\"config.allowUnselect ?? true\"\n        [searchFacets]=\"config.searchFacets ?? []\"\n        [searchSelections]=\"config.searchSelections ?? []\"\n        (searchSelectionChange)=\"searchSelectionsOutput = $event\"\n    ></natural-hierarchic-selector>\n</mat-dialog-content>\n\n<mat-dialog-actions>\n    <button [mat-dialog-close] mat-button i18n>Annuler</button>\n    <button (click)=\"close(config.hierarchicSelection)\" color=\"primary\" mat-raised-button\n        ><span i18n>Valider</span>\n    </button>\n</mat-dialog-actions>\n", styles: [":host mat-dialog-actions{display:flex;flex-direction:row;justify-content:flex-end}\n"] }]
         }], ctorParameters: function () { return [{ type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_DIALOG_DATA]
-                }] }, { type: i1$1.MatDialogRef }]; } });
+                }] }, { type: i1.MatDialogRef }]; } });
 
 class NaturalHierarchicSelectorDialogService {
     constructor(dialog) {
@@ -7647,16 +7656,16 @@ class NaturalHierarchicSelectorDialogService {
         return this.dialog.open(NaturalHierarchicSelectorDialogComponent, defaults(dialogConfig, defaultDialogConfig));
     }
 }
-NaturalHierarchicSelectorDialogService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalHierarchicSelectorDialogService, deps: [{ token: i1$1.MatDialog }], target: i0.ɵɵFactoryTarget.Injectable });
-NaturalHierarchicSelectorDialogService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalHierarchicSelectorDialogService });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalHierarchicSelectorDialogService, decorators: [{
+NaturalHierarchicSelectorDialogService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalHierarchicSelectorDialogService, deps: [{ token: i1.MatDialog }], target: i0.ɵɵFactoryTarget.Injectable });
+NaturalHierarchicSelectorDialogService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalHierarchicSelectorDialogService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalHierarchicSelectorDialogService, decorators: [{
             type: Injectable
-        }], ctorParameters: function () { return [{ type: i1$1.MatDialog }]; } });
+        }], ctorParameters: function () { return [{ type: i1.MatDialog }]; } });
 
 class NaturalHierarchicSelectorModule {
 }
-NaturalHierarchicSelectorModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalHierarchicSelectorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NaturalHierarchicSelectorModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalHierarchicSelectorModule, declarations: [NaturalHierarchicSelectorComponent, NaturalHierarchicSelectorDialogComponent], imports: [CommonModule,
+NaturalHierarchicSelectorModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalHierarchicSelectorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NaturalHierarchicSelectorModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: NaturalHierarchicSelectorModule, declarations: [NaturalHierarchicSelectorComponent, NaturalHierarchicSelectorDialogComponent], imports: [CommonModule,
         FormsModule,
         CdkTreeModule,
         MatCheckboxModule,
@@ -7671,24 +7680,22 @@ NaturalHierarchicSelectorModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "
         MatChipsModule,
         NaturalSearchModule,
         NaturalCommonModule], exports: [NaturalHierarchicSelectorComponent] });
-NaturalHierarchicSelectorModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalHierarchicSelectorModule, providers: [NaturalHierarchicSelectorDialogService], imports: [[
-            CommonModule,
-            FormsModule,
-            CdkTreeModule,
-            MatCheckboxModule,
-            MatFormFieldModule,
-            MatButtonModule,
-            MatTreeModule,
-            MatIconModule,
-            MatInputModule,
-            MatProgressSpinnerModule,
-            MatDialogModule,
-            NaturalIconModule,
-            MatChipsModule,
-            NaturalSearchModule,
-            NaturalCommonModule,
-        ]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalHierarchicSelectorModule, decorators: [{
+NaturalHierarchicSelectorModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalHierarchicSelectorModule, providers: [NaturalHierarchicSelectorDialogService], imports: [CommonModule,
+        FormsModule,
+        CdkTreeModule,
+        MatCheckboxModule,
+        MatFormFieldModule,
+        MatButtonModule,
+        MatTreeModule,
+        MatIconModule,
+        MatInputModule,
+        MatProgressSpinnerModule,
+        MatDialogModule,
+        NaturalIconModule,
+        MatChipsModule,
+        NaturalSearchModule,
+        NaturalCommonModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalHierarchicSelectorModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [NaturalHierarchicSelectorComponent, NaturalHierarchicSelectorDialogComponent],
@@ -7765,7 +7772,7 @@ class NaturalSelectHierarchicComponent extends AbstractSelect {
      */
     writeValue(value) {
         this.value = value;
-        this.internalCtrl.setValue(this.getDisplayFn()(value));
+        this.internalCtrl.setValue(this.getDisplayFn()(this.value));
     }
     openDialog() {
         if (this.internalCtrl.disabled) {
@@ -7816,12 +7823,12 @@ class NaturalSelectHierarchicComponent extends AbstractSelect {
         return selectKey;
     }
 }
-NaturalSelectHierarchicComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSelectHierarchicComponent, deps: [{ token: NaturalHierarchicSelectorDialogService }, { token: i5.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
-NaturalSelectHierarchicComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: NaturalSelectHierarchicComponent, selector: "natural-select-hierarchic", inputs: { selectLabel: "selectLabel", config: "config", filters: "filters" }, usesInheritance: true, ngImport: i0, template: "<mat-form-field [floatLabel]=\"floatPlaceholder\">\n    <mat-label>{{ placeholder }}</mat-label>\n\n    <!-- Input for hierarchical selector -->\n    <input\n        (blur)=\"blur.emit()\"\n        (focus)=\"openDialog()\"\n        (keydown.esc)=\"clear()\"\n        [formControl]=\"internalCtrl\"\n        [errorStateMatcher]=\"matcher\"\n        aria-label=\"Recherche et s\u00E9lection\"\n        i18n-aria-label\n        matInput\n    />\n\n    <!-- Meta data -->\n    <natural-icon *ngIf=\"showIcon\" [name]=\"icon\" matPrefix></natural-icon>\n\n    <!-- Clear button -->\n    <div class=\"suffix-buttons\" matSuffix>\n        <button\n            (click)=\"clear(); $event.stopPropagation()\"\n            *ngIf=\"internalCtrl.value && internalCtrl.enabled && !clearLabel\"\n            mat-icon-button\n            i18n-matTooltip\n            matTooltip=\"D\u00E9s\u00E9lectionner\"\n        >\n            <natural-icon name=\"close\"></natural-icon>\n        </button>\n        <button\n            *ngIf=\"internalCtrl.value && navigateTo\"\n            [routerLink]=\"navigateTo\"\n            mat-button\n            mat-icon-button\n            i18n-matTooltip\n            matTooltip=\"Naviguer vers\"\n        >\n            <natural-icon name=\"open_in_browser\"></natural-icon>\n        </button>\n    </div>\n\n    <mat-error *ngIf=\"hasRequiredError()\" i18n>Ce champ est requis</mat-error>\n</mat-form-field>\n\n<!--    Additional (un)select/(un)link buttons for more visual cohesion with natural-relations --><!-- [clearLabel] and/or [selectLabel] has to be given as attribute input -->\n<div *ngIf=\"showSelectButton() || showClearButton()\" class=\"external-buttons\">\n    <button (click)=\"openDialog()\" *ngIf=\"showSelectButton()\" color=\"primary\" mat-flat-button>{{ selectLabel }}</button>\n    <button (click)=\"clear()\" *ngIf=\"showClearButton()\" color=\"warn\" mat-button>{{ clearLabel }}</button>\n</div>\n", styles: [":host{display:flex;flex-direction:column}:host>*:not(:last-child){margin-bottom:20px}:host .suffix-buttons,:host .external-buttons{display:flex;flex-direction:row}:host .external-buttons{display:flex;flex-direction:row}:host .external-buttons>*:not(:last-child){margin-right:10px}\n"], components: [{ type: i2$4.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: NaturalIconComponent, selector: "natural-icon", inputs: ["label", "labelColor", "labelPosition", "name", "size"] }, { type: i1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i2$4.MatLabel, selector: "mat-label" }, { type: i7.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"] }, { type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$4.MatPrefix, selector: "[matPrefix]" }, { type: i2$4.MatSuffix, selector: "[matSuffix]" }, { type: i10.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { type: i2$1.RouterLink, selector: ":not(a):not(area)[routerLink]", inputs: ["queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { type: i2$4.MatError, selector: "mat-error", inputs: ["id"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSelectHierarchicComponent, decorators: [{
+NaturalSelectHierarchicComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalSelectHierarchicComponent, deps: [{ token: NaturalHierarchicSelectorDialogService }, { token: i3.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
+NaturalSelectHierarchicComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: NaturalSelectHierarchicComponent, selector: "natural-select-hierarchic", inputs: { selectLabel: "selectLabel", config: "config", filters: "filters" }, usesInheritance: true, ngImport: i0, template: "<mat-form-field [floatLabel]=\"floatPlaceholder\">\n    <mat-label>{{ placeholder }}</mat-label>\n\n    <!-- Input for hierarchical selector -->\n    <input\n        (blur)=\"blur.emit()\"\n        (focus)=\"openDialog()\"\n        (keydown.esc)=\"clear()\"\n        [formControl]=\"internalCtrl\"\n        [errorStateMatcher]=\"matcher\"\n        aria-label=\"Recherche et s\u00E9lection\"\n        i18n-aria-label\n        matInput\n    />\n\n    <!-- Meta data -->\n    <natural-icon *ngIf=\"showIcon\" [name]=\"icon\" matPrefix></natural-icon>\n\n    <!-- Clear button -->\n    <div class=\"suffix-buttons\" matSuffix>\n        <button\n            (click)=\"clear(); $event.stopPropagation()\"\n            *ngIf=\"internalCtrl.value && internalCtrl.enabled && !clearLabel\"\n            mat-icon-button\n            i18n-matTooltip\n            matTooltip=\"D\u00E9s\u00E9lectionner\"\n        >\n            <natural-icon name=\"close\"></natural-icon>\n        </button>\n        <button\n            *ngIf=\"internalCtrl.value && navigateTo\"\n            [routerLink]=\"navigateTo\"\n            mat-button\n            mat-icon-button\n            i18n-matTooltip\n            matTooltip=\"Naviguer vers\"\n        >\n            <natural-icon name=\"open_in_browser\"></natural-icon>\n        </button>\n    </div>\n\n    <mat-error *ngIf=\"hasRequiredError()\" i18n>Ce champ est requis</mat-error>\n</mat-form-field>\n\n<!--    Additional (un)select/(un)link buttons for more visual cohesion with natural-relations --><!-- [clearLabel] and/or [selectLabel] has to be given as attribute input -->\n<div *ngIf=\"showSelectButton() || showClearButton()\" class=\"external-buttons\">\n    <button (click)=\"openDialog()\" *ngIf=\"showSelectButton()\" color=\"primary\" mat-flat-button>{{ selectLabel }}</button>\n    <button (click)=\"clear()\" *ngIf=\"showClearButton()\" color=\"warn\" mat-button>{{ clearLabel }}</button>\n</div>\n", styles: [":host{display:flex;flex-direction:column}:host>*:not(:last-child){margin-bottom:20px}:host .suffix-buttons,:host .external-buttons{display:flex;flex-direction:row}:host .external-buttons{display:flex;flex-direction:row}:host .external-buttons>*:not(:last-child){margin-right:10px}\n"], dependencies: [{ kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i4$2.MatError, selector: "mat-error", inputs: ["id"] }, { kind: "component", type: i4$2.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4$2.MatPrefix, selector: "[matPrefix]" }, { kind: "directive", type: i4$2.MatSuffix, selector: "[matSuffix]" }, { kind: "directive", type: i5$1.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.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: NaturalIconComponent, selector: "natural-icon", inputs: ["label", "labelColor", "labelPosition", "name", "size"] }, { 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.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$1.RouterLink, selector: ":not(a):not(area)[routerLink]", inputs: ["queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalSelectHierarchicComponent, decorators: [{
             type: Component,
             args: [{ selector: 'natural-select-hierarchic', template: "<mat-form-field [floatLabel]=\"floatPlaceholder\">\n    <mat-label>{{ placeholder }}</mat-label>\n\n    <!-- Input for hierarchical selector -->\n    <input\n        (blur)=\"blur.emit()\"\n        (focus)=\"openDialog()\"\n        (keydown.esc)=\"clear()\"\n        [formControl]=\"internalCtrl\"\n        [errorStateMatcher]=\"matcher\"\n        aria-label=\"Recherche et s\u00E9lection\"\n        i18n-aria-label\n        matInput\n    />\n\n    <!-- Meta data -->\n    <natural-icon *ngIf=\"showIcon\" [name]=\"icon\" matPrefix></natural-icon>\n\n    <!-- Clear button -->\n    <div class=\"suffix-buttons\" matSuffix>\n        <button\n            (click)=\"clear(); $event.stopPropagation()\"\n            *ngIf=\"internalCtrl.value && internalCtrl.enabled && !clearLabel\"\n            mat-icon-button\n            i18n-matTooltip\n            matTooltip=\"D\u00E9s\u00E9lectionner\"\n        >\n            <natural-icon name=\"close\"></natural-icon>\n        </button>\n        <button\n            *ngIf=\"internalCtrl.value && navigateTo\"\n            [routerLink]=\"navigateTo\"\n            mat-button\n            mat-icon-button\n            i18n-matTooltip\n            matTooltip=\"Naviguer vers\"\n        >\n            <natural-icon name=\"open_in_browser\"></natural-icon>\n        </button>\n    </div>\n\n    <mat-error *ngIf=\"hasRequiredError()\" i18n>Ce champ est requis</mat-error>\n</mat-form-field>\n\n<!--    Additional (un)select/(un)link buttons for more visual cohesion with natural-relations --><!-- [clearLabel] and/or [selectLabel] has to be given as attribute input -->\n<div *ngIf=\"showSelectButton() || showClearButton()\" class=\"external-buttons\">\n    <button (click)=\"openDialog()\" *ngIf=\"showSelectButton()\" color=\"primary\" mat-flat-button>{{ selectLabel }}</button>\n    <button (click)=\"clear()\" *ngIf=\"showClearButton()\" color=\"warn\" mat-button>{{ clearLabel }}</button>\n</div>\n", styles: [":host{display:flex;flex-direction:column}:host>*:not(:last-child){margin-bottom:20px}:host .suffix-buttons,:host .external-buttons{display:flex;flex-direction:row}:host .external-buttons{display:flex;flex-direction:row}:host .external-buttons>*:not(:last-child){margin-right:10px}\n"] }]
-        }], ctorParameters: function () { return [{ type: NaturalHierarchicSelectorDialogService }, { type: i5.NgControl, decorators: [{
+        }], ctorParameters: function () { return [{ type: NaturalHierarchicSelectorDialogService }, { type: i3.NgControl, decorators: [{
                     type: Optional
                 }, {
                     type: Self
@@ -7851,12 +7858,12 @@ class NaturalSelectEnumComponent extends AbstractSelect {
         throw new Error('This should never be called');
     }
 }
-NaturalSelectEnumComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSelectEnumComponent, deps: [{ token: NaturalEnumService }, { token: i5.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
-NaturalSelectEnumComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: NaturalSelectEnumComponent, selector: "natural-select-enum", inputs: { enumName: "enumName", nullLabel: "nullLabel", optionDisabled: "optionDisabled", multiple: "multiple" }, usesInheritance: true, ngImport: i0, template: "<mat-form-field>\n    <mat-label>{{ placeholder }}</mat-label>\n    <mat-select\n        (selectionChange)=\"propagateValue($event.value)\"\n        [formControl]=\"internalCtrl\"\n        (blur)=\"touch(); blur.emit()\"\n        [errorStateMatcher]=\"matcher\"\n        [multiple]=\"multiple\"\n    >\n        <mat-option *ngIf=\"nullLabel\" [value]=\"null\">{{ nullLabel }}</mat-option>\n        <mat-option\n            *ngFor=\"let item of items | async\"\n            [value]=\"item.value\"\n            [disabled]=\"optionDisabled ? optionDisabled(item) : false\"\n        >\n            {{ item.name | capitalize }}\n        </mat-option>\n    </mat-select>\n\n    <mat-error *ngIf=\"hasRequiredError()\" i18n>Ce champ est requis</mat-error></mat-form-field\n>\n", styles: [":host{display:flex;flex-direction:column}\n"], components: [{ type: i2$4.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i2$5.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i1$8.MatOption, selector: "mat-option", exportAs: ["matOption"] }], directives: [{ type: i2$4.MatLabel, selector: "mat-label" }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2$4.MatError, selector: "mat-error", inputs: ["id"] }], pipes: { "async": i6.AsyncPipe, "capitalize": NaturalCapitalizePipe } });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSelectEnumComponent, decorators: [{
+NaturalSelectEnumComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalSelectEnumComponent, deps: [{ token: NaturalEnumService }, { token: i3.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
+NaturalSelectEnumComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: NaturalSelectEnumComponent, selector: "natural-select-enum", inputs: { enumName: "enumName", nullLabel: "nullLabel", optionDisabled: "optionDisabled", multiple: "multiple" }, usesInheritance: true, ngImport: i0, template: "<mat-form-field>\n    <mat-label>{{ placeholder }}</mat-label>\n    <mat-select\n        (selectionChange)=\"propagateValue($event.value)\"\n        [formControl]=\"internalCtrl\"\n        (blur)=\"touch(); blur.emit()\"\n        [errorStateMatcher]=\"matcher\"\n        [multiple]=\"multiple\"\n    >\n        <mat-option *ngIf=\"nullLabel\" [value]=\"null\">{{ nullLabel }}</mat-option>\n        <mat-option\n            *ngFor=\"let item of items | async\"\n            [value]=\"item.value\"\n            [disabled]=\"optionDisabled ? optionDisabled(item) : false\"\n        >\n            {{ item.name | capitalize }}\n        </mat-option>\n    </mat-select>\n\n    <mat-error *ngIf=\"hasRequiredError()\" i18n>Ce champ est requis</mat-error></mat-form-field\n>\n", styles: [":host{display:flex;flex-direction:column}\n"], dependencies: [{ kind: "directive", type: i1$3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1$7.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "directive", type: i4$2.MatError, selector: "mat-error", inputs: ["id"] }, { kind: "component", type: i4$2.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$2.MatLabel, selector: "mat-label" }, { kind: "component", type: i4$4.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: i1$3.AsyncPipe, name: "async" }, { kind: "pipe", type: NaturalCapitalizePipe, name: "capitalize" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalSelectEnumComponent, decorators: [{
             type: Component,
             args: [{ selector: 'natural-select-enum', template: "<mat-form-field>\n    <mat-label>{{ placeholder }}</mat-label>\n    <mat-select\n        (selectionChange)=\"propagateValue($event.value)\"\n        [formControl]=\"internalCtrl\"\n        (blur)=\"touch(); blur.emit()\"\n        [errorStateMatcher]=\"matcher\"\n        [multiple]=\"multiple\"\n    >\n        <mat-option *ngIf=\"nullLabel\" [value]=\"null\">{{ nullLabel }}</mat-option>\n        <mat-option\n            *ngFor=\"let item of items | async\"\n            [value]=\"item.value\"\n            [disabled]=\"optionDisabled ? optionDisabled(item) : false\"\n        >\n            {{ item.name | capitalize }}\n        </mat-option>\n    </mat-select>\n\n    <mat-error *ngIf=\"hasRequiredError()\" i18n>Ce champ est requis</mat-error></mat-form-field\n>\n", styles: [":host{display:flex;flex-direction:column}\n"] }]
-        }], ctorParameters: function () { return [{ type: NaturalEnumService }, { type: i5.NgControl, decorators: [{
+        }], ctorParameters: function () { return [{ type: NaturalEnumService }, { type: i3.NgControl, decorators: [{
                     type: Optional
                 }, {
                     type: Self
@@ -7872,8 +7879,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImpor
 
 class NaturalSelectModule {
 }
-NaturalSelectModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSelectModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NaturalSelectModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSelectModule, declarations: [NaturalSelectComponent, NaturalSelectEnumComponent, NaturalSelectHierarchicComponent], imports: [CommonModule,
+NaturalSelectModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalSelectModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NaturalSelectModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: NaturalSelectModule, declarations: [NaturalSelectComponent, NaturalSelectEnumComponent, NaturalSelectHierarchicComponent], imports: [CommonModule,
         MatAutocompleteModule,
         MatButtonModule,
         MatFormFieldModule,
@@ -7885,21 +7892,19 @@ NaturalSelectModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", ver
         NaturalIconModule,
         ReactiveFormsModule,
         RouterModule], exports: [NaturalSelectComponent, NaturalSelectEnumComponent, NaturalSelectHierarchicComponent] });
-NaturalSelectModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSelectModule, imports: [[
-            CommonModule,
-            MatAutocompleteModule,
-            MatButtonModule,
-            MatFormFieldModule,
-            MatInputModule,
-            MatProgressSpinnerModule,
-            MatSelectModule,
-            MatTooltipModule,
-            NaturalCommonModule,
-            NaturalIconModule,
-            ReactiveFormsModule,
-            RouterModule,
-        ]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSelectModule, decorators: [{
+NaturalSelectModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalSelectModule, imports: [CommonModule,
+        MatAutocompleteModule,
+        MatButtonModule,
+        MatFormFieldModule,
+        MatInputModule,
+        MatProgressSpinnerModule,
+        MatSelectModule,
+        MatTooltipModule,
+        NaturalCommonModule,
+        NaturalIconModule,
+        ReactiveFormsModule,
+        RouterModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalSelectModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [NaturalSelectComponent, NaturalSelectEnumComponent, NaturalSelectHierarchicComponent],
@@ -7932,8 +7937,8 @@ const components = [
 ];
 class NaturalDropdownComponentsModule {
 }
-NaturalDropdownComponentsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalDropdownComponentsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NaturalDropdownComponentsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalDropdownComponentsModule, declarations: [TypeNumberComponent,
+NaturalDropdownComponentsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalDropdownComponentsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NaturalDropdownComponentsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: NaturalDropdownComponentsModule, declarations: [TypeNumberComponent,
         TypeSelectComponent,
         TypeDateComponent,
         TypeDateRangeComponent,
@@ -7957,21 +7962,19 @@ NaturalDropdownComponentsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "
         TypeNaturalSelectComponent,
         TypeTextComponent,
         TypeHierarchicSelectorComponent] });
-NaturalDropdownComponentsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalDropdownComponentsModule, imports: [[
-            CommonModule,
-            FormsModule,
-            MatFormFieldModule,
-            ReactiveFormsModule,
-            MatButtonModule,
-            MatInputModule,
-            MatListModule,
-            MatCheckboxModule,
-            MatDatepickerModule,
-            MatSelectModule,
-            NaturalSelectModule,
-            NaturalHierarchicSelectorModule,
-        ]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalDropdownComponentsModule, decorators: [{
+NaturalDropdownComponentsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalDropdownComponentsModule, imports: [CommonModule,
+        FormsModule,
+        MatFormFieldModule,
+        ReactiveFormsModule,
+        MatButtonModule,
+        MatInputModule,
+        MatListModule,
+        MatCheckboxModule,
+        MatDatepickerModule,
+        MatSelectModule,
+        NaturalSelectModule,
+        NaturalHierarchicSelectorModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalDropdownComponentsModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [...components],
@@ -8136,9 +8139,9 @@ class NaturalFileService {
         return null;
     }
 }
-NaturalFileService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalFileService, deps: [{ token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Injectable });
-NaturalFileService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalFileService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalFileService, decorators: [{
+NaturalFileService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalFileService, deps: [{ token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Injectable });
+NaturalFileService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalFileService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalFileService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
@@ -8345,9 +8348,9 @@ class NaturalAbstractFile extends NaturalAbstractController {
         return !(this.maxSize && item.size > this.maxSize);
     }
 }
-NaturalAbstractFile.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalAbstractFile, deps: [{ token: i0.ElementRef }, { token: NaturalFileService }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Directive });
-NaturalAbstractFile.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.0", type: NaturalAbstractFile, inputs: { multiple: "multiple", accept: "accept", maxSize: "maxSize", fileSelectionDisabled: "fileSelectionDisabled", selectable: "selectable", broadcast: "broadcast" }, outputs: { fileChange: "fileChange", filesChange: "filesChange" }, host: { listeners: { "change": "onChange($event)" } }, usesInheritance: true, usesOnChanges: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalAbstractFile, decorators: [{
+NaturalAbstractFile.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalAbstractFile, deps: [{ token: i0.ElementRef }, { token: NaturalFileService }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Directive });
+NaturalAbstractFile.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.1.1", type: NaturalAbstractFile, inputs: { multiple: "multiple", accept: "accept", maxSize: "maxSize", fileSelectionDisabled: "fileSelectionDisabled", selectable: "selectable", broadcast: "broadcast" }, outputs: { fileChange: "fileChange", filesChange: "filesChange" }, host: { listeners: { "change": "onChange($event)" } }, usesInheritance: true, usesOnChanges: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalAbstractFile, decorators: [{
             type: Directive
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: NaturalFileService }, { type: Document, decorators: [{
                     type: Inject,
@@ -8454,9 +8457,9 @@ class NaturalFileDropDirective extends NaturalAbstractFile {
             (this.broadcast && this.naturalFileService.filesChanged.observed));
     }
 }
-NaturalFileDropDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalFileDropDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive });
-NaturalFileDropDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.0", type: NaturalFileDropDirective, selector: ":not([naturalFileSelect])[naturalFileDrop]", outputs: { fileOver: "fileOver" }, host: { listeners: { "drop": "onDrop($event)", "dragover": "onDragOver($event)", "dragleave": "onDragLeave($event)" }, properties: { "class.natural-file-over": "this.fileOverClass" } }, usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalFileDropDirective, decorators: [{
+NaturalFileDropDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalFileDropDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+NaturalFileDropDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.1.1", type: NaturalFileDropDirective, selector: ":not([naturalFileSelect])[naturalFileDrop]", outputs: { fileOver: "fileOver" }, host: { listeners: { "drop": "onDrop($event)", "dragover": "onDragOver($event)", "dragleave": "onDragLeave($event)" }, properties: { "class.natural-file-over": "this.fileOverClass" } }, usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalFileDropDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: ':not([naturalFileSelect])[naturalFileDrop]',
@@ -8491,9 +8494,9 @@ class NaturalFileSelectDirective extends NaturalAbstractFile {
         this.selectable = true;
     }
 }
-NaturalFileSelectDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalFileSelectDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive });
-NaturalFileSelectDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.0", type: NaturalFileSelectDirective, selector: ":not([naturalFileDrop])[naturalFileSelect]", inputs: { selectable: "selectable" }, usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalFileSelectDirective, decorators: [{
+NaturalFileSelectDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalFileSelectDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+NaturalFileSelectDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.1.1", type: NaturalFileSelectDirective, selector: ":not([naturalFileDrop])[naturalFileSelect]", inputs: { selectable: "selectable" }, usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalFileSelectDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: ':not([naturalFileDrop])[naturalFileSelect]',
@@ -8605,9 +8608,9 @@ class FileComponent {
         return subject.asObservable();
     }
 }
-FileComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: FileComponent, deps: [{ token: NaturalFileService }, { token: i2$2.DomSanitizer }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component });
-FileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: FileComponent, selector: "natural-file", inputs: { height: "height", action: "action", backgroundSize: "backgroundSize", accept: "accept", service: "service", model: "model", formCtrl: "formCtrl" }, outputs: { modelChange: "modelChange" }, host: { properties: { "style.height.px": "this.height" } }, usesOnChanges: true, ngImport: i0, template: "<a\n    (fileChange)=\"upload($event)\"\n    naturalFileDrop\n    [selectable]=\"true\"\n    [accept]=\"accept\"\n    [attr.href]=\"getDownloadLink()\"\n    [class.has-action]=\"!!action\"\n    [class.suggest-upload]=\"!model && action === 'upload'\"\n    [fileSelectionDisabled]=\"action !== 'upload'\"\n    [matRippleDisabled]=\"!action\"\n    [style.backgroundImage]=\"imagePreview\"\n    [style.backgroundSize]=\"backgroundSize\"\n    matRipple\n    target=\"_blank\"\n>\n    <div *ngIf=\"filePreview\" class=\"file-preview\">\n        <natural-icon [size]=\"height * 0.33\" name=\"attachment\"></natural-icon>\n        {{ filePreview | uppercase }}\n    </div>\n\n    <div class=\"action-overlay\">\n        <natural-icon *ngIf=\"action === 'upload'\" [size]=\"height * 0.66\" name=\"cloud_upload\"></natural-icon>\n        <natural-icon *ngIf=\"action === 'download'\" [size]=\"height * 0.66\" name=\"get_app\"></natural-icon>\n        {{ action | capitalize }}\n    </div>\n</a>\n", styles: [":host{display:flex;flex-direction:row;overflow:hidden;position:relative}:host>a{position:relative;flex:1;background-position:center;background-repeat:no-repeat}:host>a.has-action{cursor:pointer}:host>a.has-action.suggest-upload .action-overlay{opacity:.66}:host>a.has-action:hover .action-overlay,:host>a.has-action.natural-file-over .action-overlay{opacity:1}:host .action-overlay,:host .file-preview{display:flex;flex-direction:column;position:absolute;top:0;left:0;right:0;bottom:0;justify-content:center;align-items:center;font-size:36px;line-height:1.3em;text-align:center}:host .action-overlay{opacity:0}:host .action-overlay>div{opacity:0;position:absolute;top:0;left:0;right:0;bottom:0;display:flex;justify-content:center;align-items:center}\n"], components: [{ type: NaturalIconComponent, selector: "natural-icon", inputs: ["label", "labelColor", "labelPosition", "name", "size"] }], directives: [{ type: NaturalFileDropDirective, selector: ":not([naturalFileSelect])[naturalFileDrop]", outputs: ["fileOver"] }, { type: i1$8.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "uppercase": i6.UpperCasePipe, "capitalize": NaturalCapitalizePipe } });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: FileComponent, decorators: [{
+FileComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: FileComponent, deps: [{ token: NaturalFileService }, { token: i2$2.DomSanitizer }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component });
+FileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: FileComponent, selector: "natural-file", inputs: { height: "height", action: "action", backgroundSize: "backgroundSize", accept: "accept", service: "service", model: "model", formCtrl: "formCtrl" }, outputs: { modelChange: "modelChange" }, host: { properties: { "style.height.px": "this.height" } }, usesOnChanges: true, ngImport: i0, template: "<a\n    (fileChange)=\"upload($event)\"\n    naturalFileDrop\n    [selectable]=\"true\"\n    [accept]=\"accept\"\n    [attr.href]=\"getDownloadLink()\"\n    [class.has-action]=\"!!action\"\n    [class.suggest-upload]=\"!model && action === 'upload'\"\n    [fileSelectionDisabled]=\"action !== 'upload'\"\n    [matRippleDisabled]=\"!action\"\n    [style.backgroundImage]=\"imagePreview\"\n    [style.backgroundSize]=\"backgroundSize\"\n    matRipple\n    target=\"_blank\"\n>\n    <div *ngIf=\"filePreview\" class=\"file-preview\">\n        <natural-icon [size]=\"height * 0.33\" name=\"attachment\"></natural-icon>\n        {{ filePreview | uppercase }}\n    </div>\n\n    <div class=\"action-overlay\">\n        <natural-icon *ngIf=\"action === 'upload'\" [size]=\"height * 0.66\" name=\"cloud_upload\"></natural-icon>\n        <natural-icon *ngIf=\"action === 'download'\" [size]=\"height * 0.66\" name=\"get_app\"></natural-icon>\n        {{ action | capitalize }}\n    </div>\n</a>\n", styles: [":host{display:flex;flex-direction:row;overflow:hidden;position:relative}:host>a{position:relative;flex:1;background-position:center;background-repeat:no-repeat}:host>a.has-action{cursor:pointer}:host>a.has-action.suggest-upload .action-overlay{opacity:.66}:host>a.has-action:hover .action-overlay,:host>a.has-action.natural-file-over .action-overlay{opacity:1}:host .action-overlay,:host .file-preview{display:flex;flex-direction:column;position:absolute;top:0;left:0;right:0;bottom:0;justify-content:center;align-items:center;font-size:36px;line-height:1.3em;text-align:center}:host .action-overlay{opacity:0}:host .action-overlay>div{opacity:0;position:absolute;top:0;left:0;right:0;bottom:0;display:flex;justify-content:center;align-items:center}\n"], dependencies: [{ kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: NaturalIconComponent, selector: "natural-icon", inputs: ["label", "labelColor", "labelPosition", "name", "size"] }, { kind: "directive", type: i1$7.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "directive", type: NaturalFileDropDirective, selector: ":not([naturalFileSelect])[naturalFileDrop]", outputs: ["fileOver"] }, { kind: "pipe", type: i1$3.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: NaturalCapitalizePipe, name: "capitalize" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: FileComponent, decorators: [{
             type: Component,
             args: [{ selector: 'natural-file', template: "<a\n    (fileChange)=\"upload($event)\"\n    naturalFileDrop\n    [selectable]=\"true\"\n    [accept]=\"accept\"\n    [attr.href]=\"getDownloadLink()\"\n    [class.has-action]=\"!!action\"\n    [class.suggest-upload]=\"!model && action === 'upload'\"\n    [fileSelectionDisabled]=\"action !== 'upload'\"\n    [matRippleDisabled]=\"!action\"\n    [style.backgroundImage]=\"imagePreview\"\n    [style.backgroundSize]=\"backgroundSize\"\n    matRipple\n    target=\"_blank\"\n>\n    <div *ngIf=\"filePreview\" class=\"file-preview\">\n        <natural-icon [size]=\"height * 0.33\" name=\"attachment\"></natural-icon>\n        {{ filePreview | uppercase }}\n    </div>\n\n    <div class=\"action-overlay\">\n        <natural-icon *ngIf=\"action === 'upload'\" [size]=\"height * 0.66\" name=\"cloud_upload\"></natural-icon>\n        <natural-icon *ngIf=\"action === 'download'\" [size]=\"height * 0.66\" name=\"get_app\"></natural-icon>\n        {{ action | capitalize }}\n    </div>\n</a>\n", styles: [":host{display:flex;flex-direction:row;overflow:hidden;position:relative}:host>a{position:relative;flex:1;background-position:center;background-repeat:no-repeat}:host>a.has-action{cursor:pointer}:host>a.has-action.suggest-upload .action-overlay{opacity:.66}:host>a.has-action:hover .action-overlay,:host>a.has-action.natural-file-over .action-overlay{opacity:1}:host .action-overlay,:host .file-preview{display:flex;flex-direction:column;position:absolute;top:0;left:0;right:0;bottom:0;justify-content:center;align-items:center;font-size:36px;line-height:1.3em;text-align:center}:host .action-overlay{opacity:0}:host .action-overlay>div{opacity:0;position:absolute;top:0;left:0;right:0;bottom:0;display:flex;justify-content:center;align-items:center}\n"] }]
         }], ctorParameters: function () { return [{ type: NaturalFileService }, { type: i2$2.DomSanitizer }, { type: Document, decorators: [{
@@ -8637,10 +8640,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImpor
 const declarations$2 = [NaturalFileDropDirective, NaturalFileSelectDirective, FileComponent];
 class NaturalFileModule {
 }
-NaturalFileModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalFileModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NaturalFileModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalFileModule, declarations: [NaturalFileDropDirective, NaturalFileSelectDirective, FileComponent], imports: [CommonModule, NaturalIconModule, MatRippleModule, NaturalCommonModule], exports: [NaturalFileDropDirective, NaturalFileSelectDirective, FileComponent] });
-NaturalFileModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalFileModule, imports: [[CommonModule, NaturalIconModule, MatRippleModule, NaturalCommonModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalFileModule, decorators: [{
+NaturalFileModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalFileModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NaturalFileModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: NaturalFileModule, declarations: [NaturalFileDropDirective, NaturalFileSelectDirective, FileComponent], imports: [CommonModule, NaturalIconModule, MatRippleModule, NaturalCommonModule], exports: [NaturalFileDropDirective, NaturalFileSelectDirective, FileComponent] });
+NaturalFileModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalFileModule, imports: [CommonModule, NaturalIconModule, MatRippleModule, NaturalCommonModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalFileModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule, NaturalIconModule, MatRippleModule, NaturalCommonModule],
@@ -8660,9 +8663,9 @@ class NaturalFixedButtonComponent {
         this.disabled = false;
     }
 }
-NaturalFixedButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalFixedButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-NaturalFixedButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: NaturalFixedButtonComponent, selector: "natural-fixed-button", inputs: { icon: "icon", link: "link", color: "color", disabled: "disabled" }, ngImport: i0, template: "<button\n    [color]=\"color\"\n    [disabled]=\"disabled\"\n    [routerLink]=\"link\"\n    class=\"floating-button bottom-right\"\n    mat-fab\n    mat-raised-button\n>\n    <natural-icon [name]=\"icon\"></natural-icon>\n</button>\n", styles: [":host{position:fixed!important;z-index:999;bottom:32px;right:32px}\n"], components: [{ type: i1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: NaturalIconComponent, selector: "natural-icon", inputs: ["label", "labelColor", "labelPosition", "name", "size"] }], directives: [{ type: i2$1.RouterLink, selector: ":not(a):not(area)[routerLink]", inputs: ["queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalFixedButtonComponent, decorators: [{
+NaturalFixedButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalFixedButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+NaturalFixedButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: NaturalFixedButtonComponent, selector: "natural-fixed-button", inputs: { icon: "icon", link: "link", color: "color", disabled: "disabled" }, ngImport: i0, template: "<button\n    [color]=\"color\"\n    [disabled]=\"disabled\"\n    [routerLink]=\"link\"\n    class=\"floating-button bottom-right\"\n    mat-fab\n    mat-raised-button\n>\n    <natural-icon [name]=\"icon\"></natural-icon>\n</button>\n", styles: [":host{position:fixed!important;z-index:999;bottom:32px;right:32px}\n"], dependencies: [{ kind: "directive", type: i2$1.RouterLink, selector: ":not(a):not(area)[routerLink]", inputs: ["queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { kind: "component", type: i4.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: NaturalIconComponent, selector: "natural-icon", inputs: ["label", "labelColor", "labelPosition", "name", "size"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalFixedButtonComponent, decorators: [{
             type: Component,
             args: [{ selector: 'natural-fixed-button', template: "<button\n    [color]=\"color\"\n    [disabled]=\"disabled\"\n    [routerLink]=\"link\"\n    class=\"floating-button bottom-right\"\n    mat-fab\n    mat-raised-button\n>\n    <natural-icon [name]=\"icon\"></natural-icon>\n</button>\n", styles: [":host{position:fixed!important;z-index:999;bottom:32px;right:32px}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { icon: [{
@@ -8677,10 +8680,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImpor
 
 class NaturalFixedButtonModule {
 }
-NaturalFixedButtonModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalFixedButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NaturalFixedButtonModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalFixedButtonModule, declarations: [NaturalFixedButtonComponent], imports: [CommonModule, RouterModule, MatButtonModule, NaturalIconModule], exports: [NaturalFixedButtonComponent] });
-NaturalFixedButtonModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalFixedButtonModule, imports: [[CommonModule, RouterModule, MatButtonModule, NaturalIconModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalFixedButtonModule, decorators: [{
+NaturalFixedButtonModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalFixedButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NaturalFixedButtonModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: NaturalFixedButtonModule, declarations: [NaturalFixedButtonComponent], imports: [CommonModule, RouterModule, MatButtonModule, NaturalIconModule], exports: [NaturalFixedButtonComponent] });
+NaturalFixedButtonModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalFixedButtonModule, imports: [CommonModule, RouterModule, MatButtonModule, NaturalIconModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalFixedButtonModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [NaturalFixedButtonComponent],
@@ -8709,11 +8712,11 @@ class NaturalFixedButtonDetailComponent {
         }
     }
 }
-NaturalFixedButtonDetailComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalFixedButtonDetailComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-NaturalFixedButtonDetailComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: NaturalFixedButtonDetailComponent, selector: "natural-fixed-button-detail", inputs: { model: "model", form: "form" }, outputs: { create: "create", delete: "delete" }, ngImport: i0, template: "<natural-fixed-button\n    (click)=\"clickCreate()\"\n    *ngIf=\"!model.id\"\n    [disabled]=\"form.disabled\"\n    [color]=\"form.valid ? 'accent' : 'warn'\"\n    class=\"detail-speed-dial\"\n    icon=\"save\"\n></natural-fixed-button>\n\n<natural-fixed-button\n    (click)=\"clickDelete()\"\n    *ngIf=\"model.id && (!model.permissions || model.permissions.delete)\"\n    [disabled]=\"form.disabled\"\n    class=\"detail-speed-dial\"\n    color=\"warn\"\n    icon=\"delete_forever\"\n    i18n-matTooltip\n    matTooltip=\"Supprimer d\u00E9finitivement\"\n    matTooltipPosition=\"left\"\n></natural-fixed-button>\n", styles: [""], components: [{ type: NaturalFixedButtonComponent, selector: "natural-fixed-button", inputs: ["icon", "link", "color", "disabled"] }], directives: [{ type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i10.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalFixedButtonDetailComponent, decorators: [{
+NaturalFixedButtonDetailComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalFixedButtonDetailComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+NaturalFixedButtonDetailComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: NaturalFixedButtonDetailComponent, selector: "natural-fixed-button-detail", inputs: { model: "model", form: "form" }, outputs: { create: "create", delete: "delete" }, ngImport: i0, template: "<natural-fixed-button\n    (click)=\"clickCreate()\"\n    *ngIf=\"!model.id\"\n    [disabled]=\"form.disabled\"\n    [color]=\"form.valid ? 'accent' : 'warn'\"\n    class=\"detail-speed-dial\"\n    icon=\"save\"\n></natural-fixed-button>\n\n<natural-fixed-button\n    (click)=\"clickDelete()\"\n    *ngIf=\"model.id && (!model.permissions || model.permissions.delete)\"\n    [disabled]=\"form.disabled\"\n    class=\"detail-speed-dial\"\n    color=\"warn\"\n    icon=\"delete_forever\"\n    i18n-matTooltip\n    matTooltip=\"Supprimer d\u00E9finitivement\"\n    matTooltipPosition=\"left\"\n></natural-fixed-button>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: NaturalFixedButtonComponent, selector: "natural-fixed-button", inputs: ["icon", "link", "color", "disabled"] }, { kind: "directive", type: i7.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalFixedButtonDetailComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'natural-fixed-button-detail', template: "<natural-fixed-button\n    (click)=\"clickCreate()\"\n    *ngIf=\"!model.id\"\n    [disabled]=\"form.disabled\"\n    [color]=\"form.valid ? 'accent' : 'warn'\"\n    class=\"detail-speed-dial\"\n    icon=\"save\"\n></natural-fixed-button>\n\n<natural-fixed-button\n    (click)=\"clickDelete()\"\n    *ngIf=\"model.id && (!model.permissions || model.permissions.delete)\"\n    [disabled]=\"form.disabled\"\n    class=\"detail-speed-dial\"\n    color=\"warn\"\n    icon=\"delete_forever\"\n    i18n-matTooltip\n    matTooltip=\"Supprimer d\u00E9finitivement\"\n    matTooltipPosition=\"left\"\n></natural-fixed-button>\n", styles: [""] }]
+            args: [{ selector: 'natural-fixed-button-detail', template: "<natural-fixed-button\n    (click)=\"clickCreate()\"\n    *ngIf=\"!model.id\"\n    [disabled]=\"form.disabled\"\n    [color]=\"form.valid ? 'accent' : 'warn'\"\n    class=\"detail-speed-dial\"\n    icon=\"save\"\n></natural-fixed-button>\n\n<natural-fixed-button\n    (click)=\"clickDelete()\"\n    *ngIf=\"model.id && (!model.permissions || model.permissions.delete)\"\n    [disabled]=\"form.disabled\"\n    class=\"detail-speed-dial\"\n    color=\"warn\"\n    icon=\"delete_forever\"\n    i18n-matTooltip\n    matTooltip=\"Supprimer d\u00E9finitivement\"\n    matTooltipPosition=\"left\"\n></natural-fixed-button>\n" }]
         }], propDecorators: { model: [{
                 type: Input
             }], form: [{
@@ -8726,10 +8729,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImpor
 
 class NaturalFixedButtonDetailModule {
 }
-NaturalFixedButtonDetailModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalFixedButtonDetailModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NaturalFixedButtonDetailModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalFixedButtonDetailModule, declarations: [NaturalFixedButtonDetailComponent], imports: [CommonModule, NaturalFixedButtonModule, MatTooltipModule], exports: [NaturalFixedButtonDetailComponent] });
-NaturalFixedButtonDetailModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalFixedButtonDetailModule, imports: [[CommonModule, NaturalFixedButtonModule, MatTooltipModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalFixedButtonDetailModule, decorators: [{
+NaturalFixedButtonDetailModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalFixedButtonDetailModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NaturalFixedButtonDetailModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: NaturalFixedButtonDetailModule, declarations: [NaturalFixedButtonDetailComponent], imports: [CommonModule, NaturalFixedButtonModule, MatTooltipModule], exports: [NaturalFixedButtonDetailComponent] });
+NaturalFixedButtonDetailModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalFixedButtonDetailModule, imports: [CommonModule, NaturalFixedButtonModule, MatTooltipModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalFixedButtonDetailModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [NaturalFixedButtonDetailComponent],
@@ -9130,17 +9133,17 @@ class NaturalPanelsService {
  * And we cannot make it non-static, because `UrlMatcher` cannot be injected.
  */
 NaturalPanelsService._opened = false;
-NaturalPanelsService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalPanelsService, deps: [{ token: i2$1.Router }, { token: i1$1.MatDialog }, { token: i0.Injector }, { token: PanelsHooksConfig }, { token: i3$1.MediaObserver }], target: i0.ɵɵFactoryTarget.Injectable });
-NaturalPanelsService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalPanelsService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalPanelsService, decorators: [{
+NaturalPanelsService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalPanelsService, deps: [{ token: i2$1.Router }, { token: i1.MatDialog }, { token: i0.Injector }, { token: PanelsHooksConfig }, { token: i3$2.MediaObserver }], target: i0.ɵɵFactoryTarget.Injectable });
+NaturalPanelsService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalPanelsService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalPanelsService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
                 }]
-        }], ctorParameters: function () { return [{ type: i2$1.Router }, { type: i1$1.MatDialog }, { type: i0.Injector }, { type: undefined, decorators: [{
+        }], ctorParameters: function () { return [{ type: i2$1.Router }, { type: i1.MatDialog }, { type: i0.Injector }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [PanelsHooksConfig]
-                }] }, { type: i3$1.MediaObserver }]; } });
+                }] }, { type: i3$2.MediaObserver }]; } });
 
 class NaturalPanelsComponent {
     // PanelsComponent is kind of a "ghost" component to respond to an url matcher in route config,
@@ -9154,9 +9157,9 @@ class NaturalPanelsComponent {
         this.panelsService.stop();
     }
 }
-NaturalPanelsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalPanelsComponent, deps: [{ token: NaturalPanelsService }, { token: i2$1.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component });
-NaturalPanelsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: NaturalPanelsComponent, selector: "natural-panels", ngImport: i0, template: '', isInline: true });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalPanelsComponent, decorators: [{
+NaturalPanelsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalPanelsComponent, deps: [{ token: NaturalPanelsService }, { token: i2$1.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component });
+NaturalPanelsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: NaturalPanelsComponent, selector: "natural-panels", ngImport: i0, template: '', isInline: true });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalPanelsComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'natural-panels',
@@ -9178,10 +9181,10 @@ class NaturalPanelsModule {
         };
     }
 }
-NaturalPanelsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalPanelsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NaturalPanelsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalPanelsModule, declarations: [NaturalPanelsComponent], imports: [CommonModule, RouterModule, MatDialogModule], exports: [NaturalPanelsComponent] });
-NaturalPanelsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalPanelsModule, imports: [[CommonModule, RouterModule, MatDialogModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalPanelsModule, decorators: [{
+NaturalPanelsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalPanelsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NaturalPanelsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: NaturalPanelsModule, declarations: [NaturalPanelsComponent], imports: [CommonModule, RouterModule, MatDialogModule], exports: [NaturalPanelsComponent] });
+NaturalPanelsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalPanelsModule, imports: [CommonModule, RouterModule, MatDialogModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalPanelsModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: declarations$1,
@@ -9241,6 +9244,7 @@ class NaturalRelationsComponent extends NaturalAbstractController {
          * Observable variables/options for listing service usage and apollo watchQuery
          */
         this.variablesManager = new NaturalQueryVariablesManager();
+        this.removing = new Set();
     }
     /**
      * The filter used to filter relations
@@ -9274,7 +9278,11 @@ class NaturalRelationsComponent extends NaturalAbstractController {
      * Refetch result to display it in table
      */
     removeRelation(relation) {
-        this.linkMutationService.unlink(this.main, relation, this.otherName).subscribe();
+        this.removing.add(relation);
+        this.linkMutationService
+            .unlink(this.main, relation, this.otherName)
+            .pipe(finalize(() => this.removing.delete(relation)))
+            .subscribe(() => this.dataSource?.remove(relation));
     }
     /**
      * Link action
@@ -9350,11 +9358,11 @@ class NaturalRelationsComponent extends NaturalAbstractController {
         return this.hierarchicSelectorConfig.filter(c => !!c.selectableAtKey)[0].selectableAtKey;
     }
 }
-NaturalRelationsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalRelationsComponent, deps: [{ token: NaturalLinkMutationService }, { token: NaturalHierarchicSelectorDialogService }], target: i0.ɵɵFactoryTarget.Component });
-NaturalRelationsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: NaturalRelationsComponent, selector: "natural-relations", inputs: { service: "service", placeholder: "placeholder", autocompleteSelectorFilter: "autocompleteSelectorFilter", displayWith: "displayWith", disabled: "disabled", main: "main", hierarchicSelectorFilters: "hierarchicSelectorFilters", hierarchicSelectorConfig: "hierarchicSelectorConfig", otherName: "otherName", filter: "filter" }, outputs: { selectionChange: "selectionChange" }, queries: [{ propertyName: "itemTemplate", first: true, predicate: TemplateRef, descendants: true }], viewQueries: [{ propertyName: "select", first: true, predicate: NaturalSelectComponent, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"body\">\n    <ng-template #defaultNameCell let-item=\"item\">\n        {{ getDisplayFn()(item) }}\n    </ng-template>\n\n    <table *ngIf=\"dataSource\" [dataSource]=\"dataSource\" class=\"natural-row-click\" mat-table>\n        <tr *matHeaderRowDef=\"displayedColumns\" mat-header-row style=\"display: none\"></tr>\n        <tr *matRowDef=\"let row; columns: displayedColumns\" mat-row></tr>\n\n        <ng-container matColumnDef=\"name\">\n            <th *matHeaderCellDef i18n mat-header-cell>Titre</th>\n            <td *matCellDef=\"let item\" mat-cell>\n                <ng-template\n                    [ngTemplateOutletContext]=\"{item: item}\"\n                    [ngTemplateOutlet]=\"itemTemplate ? itemTemplate : defaultNameCell\"\n                ></ng-template>\n            </td>\n        </ng-container>\n\n        <ng-container matColumnDef=\"unlink\">\n            <th *matHeaderCellDef mat-header-cell></th>\n            <td *matCellDef=\"let element\" mat-cell>\n                <button\n                    *ngIf=\"!disabled\"\n                    (click)=\"removeRelation(element)\"\n                    color=\"warn\"\n                    mat-icon-button\n                    i18n-matTooltip\n                    matTooltip=\"Dissocier\"\n                >\n                    <natural-icon name=\"link_off\"></natural-icon>\n                </button>\n            </td>\n        </ng-container>\n    </table>\n\n    <mat-paginator\n        (page)=\"pagination($event)\"\n        *ngIf=\"dataSource?.data && (dataSource?.data?.length || 0) > (dataSource?.data?.pageSize || 0)\"\n        [length]=\"dataSource?.data?.length || 0\"\n        [pageIndex]=\"dataSource?.data?.pageIndex || 0\"\n        [pageSizeOptions]=\"pageSizeOptions\"\n        [pageSize]=\"dataSource?.data?.pageSize || 0\"\n    ></mat-paginator>\n\n    <div *ngIf=\"!loading && dataSource?.data?.length === 0\" class=\"margin-v mat-body\">\n        <span i18n>Aucun r\u00E9sultat</span>\n    </div>\n\n    <mat-progress-spinner *ngIf=\"loading\" [diameter]=\"40\" class=\"loading\" mode=\"indeterminate\"></mat-progress-spinner>\n</div>\n\n<natural-select\n    #select\n    (selectionChange)=\"addRelations([$any($event)])\"\n    *ngIf=\"!hierarchicSelectorConfig && service && !disabled\"\n    [displayWith]=\"getDisplayFn()\"\n    [filter]=\"autocompleteSelectorFilter\"\n    [placeholder]=\"placeholder\"\n    [service]=\"service\"\n    [showIcon]=\"false\"\n></natural-select>\n\n<div *ngIf=\"hierarchicSelectorConfig && !disabled\">\n    <button (click)=\"openNaturalHierarchicSelector()\" color=\"primary\" mat-flat-button>{{ placeholder }}</button>\n</div>\n", styles: [":host{display:flex;flex-direction:column}:host>*:not(:last-child){margin-bottom:20px}:host .body{display:flex;flex-direction:column}:host .loading{margin:20px auto}:host .mat-column-unlink{width:2.5em}\n"], components: [{ type: i3$2.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { type: i3$2.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { type: i3$2.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { type: i1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: NaturalIconComponent, selector: "natural-icon", inputs: ["label", "labelColor", "labelPosition", "name", "size"] }, { type: i6$1.MatPaginator, selector: "mat-paginator", inputs: ["disabled"], exportAs: ["matPaginator"] }, { type: i5$1.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "diameter", "strokeWidth", "mode", "value"], exportAs: ["matProgressSpinner"] }, { type: NaturalSelectComponent, selector: "natural-select", inputs: ["service", "optionRequired", "searchField", "filter", "disabled"] }], directives: [{ type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3$2.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { type: i3$2.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { type: i3$2.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { type: i3$2.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { type: i3$2.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { type: i3$2.MatCellDef, selector: "[matCellDef]" }, { type: i3$2.MatCell, selector: "mat-cell, td[mat-cell]" }, { type: i6.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i10.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalRelationsComponent, decorators: [{
+NaturalRelationsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalRelationsComponent, deps: [{ token: NaturalLinkMutationService }, { token: NaturalHierarchicSelectorDialogService }], target: i0.ɵɵFactoryTarget.Component });
+NaturalRelationsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: NaturalRelationsComponent, selector: "natural-relations", inputs: { service: "service", placeholder: "placeholder", autocompleteSelectorFilter: "autocompleteSelectorFilter", displayWith: "displayWith", disabled: "disabled", main: "main", hierarchicSelectorFilters: "hierarchicSelectorFilters", hierarchicSelectorConfig: "hierarchicSelectorConfig", otherName: "otherName", filter: "filter" }, outputs: { selectionChange: "selectionChange" }, queries: [{ propertyName: "itemTemplate", first: true, predicate: TemplateRef, descendants: true }], viewQueries: [{ propertyName: "select", first: true, predicate: NaturalSelectComponent, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"body\">\n    <ng-template #defaultNameCell let-item=\"item\">\n        {{ getDisplayFn()(item) }}\n    </ng-template>\n\n    <table *ngIf=\"dataSource\" [dataSource]=\"dataSource\" class=\"natural-row-click\" mat-table>\n        <tr *matHeaderRowDef=\"displayedColumns\" mat-header-row style=\"display: none\"></tr>\n        <tr *matRowDef=\"let row; columns: displayedColumns\" mat-row></tr>\n\n        <ng-container matColumnDef=\"name\">\n            <th *matHeaderCellDef i18n mat-header-cell>Titre</th>\n            <td *matCellDef=\"let item\" mat-cell>\n                <ng-template\n                    [ngTemplateOutletContext]=\"{item: item}\"\n                    [ngTemplateOutlet]=\"itemTemplate ? itemTemplate : defaultNameCell\"\n                ></ng-template>\n            </td>\n        </ng-container>\n\n        <ng-container matColumnDef=\"unlink\">\n            <th *matHeaderCellDef mat-header-cell></th>\n            <td *matCellDef=\"let element\" mat-cell>\n                <button\n                    *ngIf=\"!disabled\"\n                    (click)=\"removeRelation(element)\"\n                    [disabled]=\"removing.has(element)\"\n                    color=\"warn\"\n                    mat-icon-button\n                    i18n-matTooltip\n                    matTooltip=\"Dissocier\"\n                >\n                    <natural-icon name=\"link_off\"></natural-icon>\n                </button>\n            </td>\n        </ng-container>\n    </table>\n\n    <mat-paginator\n        (page)=\"pagination($event)\"\n        *ngIf=\"dataSource?.data && (dataSource?.data?.length || 0) > (dataSource?.data?.pageSize || 0)\"\n        [length]=\"dataSource?.data?.length || 0\"\n        [pageIndex]=\"dataSource?.data?.pageIndex || 0\"\n        [pageSizeOptions]=\"pageSizeOptions\"\n        [pageSize]=\"dataSource?.data?.pageSize || 0\"\n    ></mat-paginator>\n\n    <div *ngIf=\"!loading && dataSource?.data?.length === 0\" class=\"margin-v mat-body\">\n        <span i18n>Aucun r\u00E9sultat</span>\n    </div>\n\n    <mat-progress-spinner *ngIf=\"loading\" [diameter]=\"40\" class=\"loading\" mode=\"indeterminate\"></mat-progress-spinner>\n</div>\n\n<natural-select\n    #select\n    (selectionChange)=\"addRelations([$any($event)])\"\n    *ngIf=\"!hierarchicSelectorConfig && service && !disabled\"\n    [displayWith]=\"getDisplayFn()\"\n    [filter]=\"autocompleteSelectorFilter\"\n    [placeholder]=\"placeholder\"\n    [service]=\"service\"\n    [showIcon]=\"false\"\n></natural-select>\n\n<div *ngIf=\"hierarchicSelectorConfig && !disabled\">\n    <button (click)=\"openNaturalHierarchicSelector()\" color=\"primary\" mat-flat-button>{{ placeholder }}</button>\n</div>\n", styles: [":host{display:flex;flex-direction:column}:host>*:not(:last-child){margin-bottom:20px}:host .body{display:flex;flex-direction:column}:host .loading{margin:20px auto}:host .mat-column-unlink{width:2.5em}\n"], dependencies: [{ kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i4.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i7$1.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "diameter", "strokeWidth", "mode", "value"], exportAs: ["matProgressSpinner"] }, { kind: "component", type: NaturalIconComponent, selector: "natural-icon", inputs: ["label", "labelColor", "labelPosition", "name", "size"] }, { kind: "component", type: i7$2.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i7$2.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i7$2.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i7$2.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i7$2.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i7$2.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i7$2.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i7$2.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i7$2.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i7$2.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: NaturalSelectComponent, selector: "natural-select", inputs: ["service", "optionRequired", "searchField", "filter", "disabled"] }, { kind: "component", type: i9.MatPaginator, selector: "mat-paginator", inputs: ["disabled"], exportAs: ["matPaginator"] }, { kind: "directive", type: i7.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalRelationsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'natural-relations', template: "<div class=\"body\">\n    <ng-template #defaultNameCell let-item=\"item\">\n        {{ getDisplayFn()(item) }}\n    </ng-template>\n\n    <table *ngIf=\"dataSource\" [dataSource]=\"dataSource\" class=\"natural-row-click\" mat-table>\n        <tr *matHeaderRowDef=\"displayedColumns\" mat-header-row style=\"display: none\"></tr>\n        <tr *matRowDef=\"let row; columns: displayedColumns\" mat-row></tr>\n\n        <ng-container matColumnDef=\"name\">\n            <th *matHeaderCellDef i18n mat-header-cell>Titre</th>\n            <td *matCellDef=\"let item\" mat-cell>\n                <ng-template\n                    [ngTemplateOutletContext]=\"{item: item}\"\n                    [ngTemplateOutlet]=\"itemTemplate ? itemTemplate : defaultNameCell\"\n                ></ng-template>\n            </td>\n        </ng-container>\n\n        <ng-container matColumnDef=\"unlink\">\n            <th *matHeaderCellDef mat-header-cell></th>\n            <td *matCellDef=\"let element\" mat-cell>\n                <button\n                    *ngIf=\"!disabled\"\n                    (click)=\"removeRelation(element)\"\n                    color=\"warn\"\n                    mat-icon-button\n                    i18n-matTooltip\n                    matTooltip=\"Dissocier\"\n                >\n                    <natural-icon name=\"link_off\"></natural-icon>\n                </button>\n            </td>\n        </ng-container>\n    </table>\n\n    <mat-paginator\n        (page)=\"pagination($event)\"\n        *ngIf=\"dataSource?.data && (dataSource?.data?.length || 0) > (dataSource?.data?.pageSize || 0)\"\n        [length]=\"dataSource?.data?.length || 0\"\n        [pageIndex]=\"dataSource?.data?.pageIndex || 0\"\n        [pageSizeOptions]=\"pageSizeOptions\"\n        [pageSize]=\"dataSource?.data?.pageSize || 0\"\n    ></mat-paginator>\n\n    <div *ngIf=\"!loading && dataSource?.data?.length === 0\" class=\"margin-v mat-body\">\n        <span i18n>Aucun r\u00E9sultat</span>\n    </div>\n\n    <mat-progress-spinner *ngIf=\"loading\" [diameter]=\"40\" class=\"loading\" mode=\"indeterminate\"></mat-progress-spinner>\n</div>\n\n<natural-select\n    #select\n    (selectionChange)=\"addRelations([$any($event)])\"\n    *ngIf=\"!hierarchicSelectorConfig && service && !disabled\"\n    [displayWith]=\"getDisplayFn()\"\n    [filter]=\"autocompleteSelectorFilter\"\n    [placeholder]=\"placeholder\"\n    [service]=\"service\"\n    [showIcon]=\"false\"\n></natural-select>\n\n<div *ngIf=\"hierarchicSelectorConfig && !disabled\">\n    <button (click)=\"openNaturalHierarchicSelector()\" color=\"primary\" mat-flat-button>{{ placeholder }}</button>\n</div>\n", styles: [":host{display:flex;flex-direction:column}:host>*:not(:last-child){margin-bottom:20px}:host .body{display:flex;flex-direction:column}:host .loading{margin:20px auto}:host .mat-column-unlink{width:2.5em}\n"] }]
+            args: [{ selector: 'natural-relations', template: "<div class=\"body\">\n    <ng-template #defaultNameCell let-item=\"item\">\n        {{ getDisplayFn()(item) }}\n    </ng-template>\n\n    <table *ngIf=\"dataSource\" [dataSource]=\"dataSource\" class=\"natural-row-click\" mat-table>\n        <tr *matHeaderRowDef=\"displayedColumns\" mat-header-row style=\"display: none\"></tr>\n        <tr *matRowDef=\"let row; columns: displayedColumns\" mat-row></tr>\n\n        <ng-container matColumnDef=\"name\">\n            <th *matHeaderCellDef i18n mat-header-cell>Titre</th>\n            <td *matCellDef=\"let item\" mat-cell>\n                <ng-template\n                    [ngTemplateOutletContext]=\"{item: item}\"\n                    [ngTemplateOutlet]=\"itemTemplate ? itemTemplate : defaultNameCell\"\n                ></ng-template>\n            </td>\n        </ng-container>\n\n        <ng-container matColumnDef=\"unlink\">\n            <th *matHeaderCellDef mat-header-cell></th>\n            <td *matCellDef=\"let element\" mat-cell>\n                <button\n                    *ngIf=\"!disabled\"\n                    (click)=\"removeRelation(element)\"\n                    [disabled]=\"removing.has(element)\"\n                    color=\"warn\"\n                    mat-icon-button\n                    i18n-matTooltip\n                    matTooltip=\"Dissocier\"\n                >\n                    <natural-icon name=\"link_off\"></natural-icon>\n                </button>\n            </td>\n        </ng-container>\n    </table>\n\n    <mat-paginator\n        (page)=\"pagination($event)\"\n        *ngIf=\"dataSource?.data && (dataSource?.data?.length || 0) > (dataSource?.data?.pageSize || 0)\"\n        [length]=\"dataSource?.data?.length || 0\"\n        [pageIndex]=\"dataSource?.data?.pageIndex || 0\"\n        [pageSizeOptions]=\"pageSizeOptions\"\n        [pageSize]=\"dataSource?.data?.pageSize || 0\"\n    ></mat-paginator>\n\n    <div *ngIf=\"!loading && dataSource?.data?.length === 0\" class=\"margin-v mat-body\">\n        <span i18n>Aucun r\u00E9sultat</span>\n    </div>\n\n    <mat-progress-spinner *ngIf=\"loading\" [diameter]=\"40\" class=\"loading\" mode=\"indeterminate\"></mat-progress-spinner>\n</div>\n\n<natural-select\n    #select\n    (selectionChange)=\"addRelations([$any($event)])\"\n    *ngIf=\"!hierarchicSelectorConfig && service && !disabled\"\n    [displayWith]=\"getDisplayFn()\"\n    [filter]=\"autocompleteSelectorFilter\"\n    [placeholder]=\"placeholder\"\n    [service]=\"service\"\n    [showIcon]=\"false\"\n></natural-select>\n\n<div *ngIf=\"hierarchicSelectorConfig && !disabled\">\n    <button (click)=\"openNaturalHierarchicSelector()\" color=\"primary\" mat-flat-button>{{ placeholder }}</button>\n</div>\n", styles: [":host{display:flex;flex-direction:column}:host>*:not(:last-child){margin-bottom:20px}:host .body{display:flex;flex-direction:column}:host .loading{margin:20px auto}:host .mat-column-unlink{width:2.5em}\n"] }]
         }], ctorParameters: function () { return [{ type: NaturalLinkMutationService }, { type: NaturalHierarchicSelectorDialogService }]; }, propDecorators: { select: [{
                 type: ViewChild,
                 args: [NaturalSelectComponent]
@@ -9387,8 +9395,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImpor
 
 class NaturalRelationsModule {
 }
-NaturalRelationsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalRelationsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NaturalRelationsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalRelationsModule, declarations: [NaturalRelationsComponent], imports: [CommonModule,
+NaturalRelationsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalRelationsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NaturalRelationsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: NaturalRelationsModule, declarations: [NaturalRelationsComponent], imports: [CommonModule,
         MatInputModule,
         MatButtonModule,
         MatProgressSpinnerModule,
@@ -9398,19 +9406,17 @@ NaturalRelationsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0",
         NaturalHierarchicSelectorModule,
         MatPaginatorModule,
         MatTooltipModule], exports: [NaturalRelationsComponent] });
-NaturalRelationsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalRelationsModule, imports: [[
-            CommonModule,
-            MatInputModule,
-            MatButtonModule,
-            MatProgressSpinnerModule,
-            NaturalIconModule,
-            MatTableModule,
-            NaturalSelectModule,
-            NaturalHierarchicSelectorModule,
-            MatPaginatorModule,
-            MatTooltipModule,
-        ]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalRelationsModule, decorators: [{
+NaturalRelationsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalRelationsModule, imports: [CommonModule,
+        MatInputModule,
+        MatButtonModule,
+        MatProgressSpinnerModule,
+        NaturalIconModule,
+        MatTableModule,
+        NaturalSelectModule,
+        NaturalHierarchicSelectorModule,
+        MatPaginatorModule,
+        MatTooltipModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalRelationsModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [NaturalRelationsComponent],
@@ -9538,9 +9544,9 @@ class NaturalSidenavStackService {
         this.currentSidenav.next(this.sidenavs[this.sidenavs.length - 1]);
     }
 }
-NaturalSidenavStackService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSidenavStackService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-NaturalSidenavStackService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSidenavStackService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSidenavStackService, decorators: [{
+NaturalSidenavStackService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalSidenavStackService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+NaturalSidenavStackService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalSidenavStackService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalSidenavStackService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }] });
@@ -9721,20 +9727,19 @@ class NaturalSidenavService extends NaturalAbstractController {
         }
     }
 }
-NaturalSidenavService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSidenavService, deps: [{ token: i3$1.MediaObserver }, { token: i2$1.Router }, { token: SESSION_STORAGE }, { token: NaturalSidenavStackService }], target: i0.ɵɵFactoryTarget.Injectable });
-NaturalSidenavService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSidenavService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSidenavService, decorators: [{
+NaturalSidenavService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalSidenavService, deps: [{ token: i3$2.MediaObserver }, { token: i2$1.Router }, { token: SESSION_STORAGE }, { token: NaturalSidenavStackService }], target: i0.ɵɵFactoryTarget.Injectable });
+NaturalSidenavService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalSidenavService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalSidenavService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
-        }], ctorParameters: function () { return [{ type: i3$1.MediaObserver }, { type: i2$1.Router }, { type: undefined, decorators: [{
+        }], ctorParameters: function () { return [{ type: i3$2.MediaObserver }, { type: i2$1.Router }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [SESSION_STORAGE]
                 }] }, { type: NaturalSidenavStackService }]; } });
 
 class NaturalSidenavContainerComponent {
-    constructor(sidenavService, element) {
+    constructor(sidenavService) {
         this.sidenavService = sidenavService;
-        this.element = element;
         /**
          * The side that the drawer is attached to
          */
@@ -9785,12 +9790,12 @@ class NaturalSidenavContainerComponent {
         this.sidenavService.toggleMinimized();
     }
 }
-NaturalSidenavContainerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSidenavContainerComponent, deps: [{ token: NaturalSidenavService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-NaturalSidenavContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: NaturalSidenavContainerComponent, selector: "natural-sidenav-container", inputs: { name: "name", position: "position", mobileAutoClose: "mobileAutoClose", minimizedWidth: "minimizedWidth", noScroll: "noScroll" }, host: { properties: { "attr.no-scroll": "this.noScroll" } }, providers: [NaturalSidenavService], viewQueries: [{ propertyName: "menuContainer", first: true, predicate: MatSidenavContainer, descendants: true, static: true }, { propertyName: "menuSidenav", first: true, predicate: MatSidenav, descendants: true, static: true }], ngImport: i0, template: "<mat-sidenav-container (backdropClick)=\"sidenavService.setOpened(false)\">\n    <mat-sidenav\n        [mode]=\"sidenavService.activeMode\"\n        [ngClass]=\"sidenavService.isMinimized ? 'menuMinimized' : ''\"\n        [opened]=\"sidenavService.isOpened\"\n        [style.min-width.px]=\"sidenavService.isMinimized && minimizedWidth ? minimizedWidth : null\"\n        [style.width.px]=\"sidenavService.isMinimized && minimizedWidth ? minimizedWidth : null\"\n        [position]=\"position\"\n    >\n        <ng-content select=\"natural-sidenav\"></ng-content>\n    </mat-sidenav>\n\n    <mat-sidenav-content>\n        <div>\n            <ng-content select=\"natural-sidenav-content\"></ng-content>\n        </div>\n    </mat-sidenav-content>\n</mat-sidenav-container>\n", styles: [":host{display:flex;flex-direction:column}:host mat-sidenav-container{display:flex;flex-direction:column;flex:1}:host mat-sidenav-content>div{overflow:auto}:host .menuMinimized{overflow-x:hidden}:host .buttons{display:flex;flex-direction:row;justify-content:flex-end}\n"], components: [{ type: i2$6.MatSidenavContainer, selector: "mat-sidenav-container", exportAs: ["matSidenavContainer"] }, { type: i2$6.MatSidenav, selector: "mat-sidenav", inputs: ["fixedInViewport", "fixedTopGap", "fixedBottomGap"], exportAs: ["matSidenav"] }, { type: i2$6.MatSidenavContent, selector: "mat-sidenav-content" }], directives: [{ type: i6.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSidenavContainerComponent, decorators: [{
+NaturalSidenavContainerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalSidenavContainerComponent, deps: [{ token: NaturalSidenavService }], target: i0.ɵɵFactoryTarget.Component });
+NaturalSidenavContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: NaturalSidenavContainerComponent, selector: "natural-sidenav-container", inputs: { name: "name", position: "position", mobileAutoClose: "mobileAutoClose", minimizedWidth: "minimizedWidth", noScroll: "noScroll" }, host: { properties: { "attr.no-scroll": "this.noScroll" } }, providers: [NaturalSidenavService], viewQueries: [{ propertyName: "menuContainer", first: true, predicate: MatSidenavContainer, descendants: true, static: true }, { propertyName: "menuSidenav", first: true, predicate: MatSidenav, descendants: true, static: true }], ngImport: i0, template: "<mat-sidenav-container (backdropClick)=\"sidenavService.setOpened(false)\">\n    <mat-sidenav\n        [mode]=\"sidenavService.activeMode\"\n        [ngClass]=\"sidenavService.isMinimized ? 'menuMinimized' : ''\"\n        [opened]=\"sidenavService.isOpened\"\n        [style.min-width.px]=\"sidenavService.isMinimized && minimizedWidth ? minimizedWidth : null\"\n        [style.width.px]=\"sidenavService.isMinimized && minimizedWidth ? minimizedWidth : null\"\n        [position]=\"position\"\n    >\n        <ng-content select=\"natural-sidenav\"></ng-content>\n    </mat-sidenav>\n\n    <mat-sidenav-content>\n        <div>\n            <ng-content select=\"natural-sidenav-content\"></ng-content>\n        </div>\n    </mat-sidenav-content>\n</mat-sidenav-container>\n", styles: [":host{display:flex;flex-direction:column}:host mat-sidenav-container{display:flex;flex-direction:column;flex:1}:host mat-sidenav-content>div{overflow:auto}:host .menuMinimized{overflow-x:hidden}:host .buttons{display:flex;flex-direction:row;justify-content:flex-end}\n"], dependencies: [{ kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i3$3.MatSidenav, selector: "mat-sidenav", inputs: ["fixedInViewport", "fixedTopGap", "fixedBottomGap"], exportAs: ["matSidenav"] }, { kind: "component", type: i3$3.MatSidenavContainer, selector: "mat-sidenav-container", exportAs: ["matSidenavContainer"] }, { kind: "component", type: i3$3.MatSidenavContent, selector: "mat-sidenav-content" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalSidenavContainerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'natural-sidenav-container', providers: [NaturalSidenavService], template: "<mat-sidenav-container (backdropClick)=\"sidenavService.setOpened(false)\">\n    <mat-sidenav\n        [mode]=\"sidenavService.activeMode\"\n        [ngClass]=\"sidenavService.isMinimized ? 'menuMinimized' : ''\"\n        [opened]=\"sidenavService.isOpened\"\n        [style.min-width.px]=\"sidenavService.isMinimized && minimizedWidth ? minimizedWidth : null\"\n        [style.width.px]=\"sidenavService.isMinimized && minimizedWidth ? minimizedWidth : null\"\n        [position]=\"position\"\n    >\n        <ng-content select=\"natural-sidenav\"></ng-content>\n    </mat-sidenav>\n\n    <mat-sidenav-content>\n        <div>\n            <ng-content select=\"natural-sidenav-content\"></ng-content>\n        </div>\n    </mat-sidenav-content>\n</mat-sidenav-container>\n", styles: [":host{display:flex;flex-direction:column}:host mat-sidenav-container{display:flex;flex-direction:column;flex:1}:host mat-sidenav-content>div{overflow:auto}:host .menuMinimized{overflow-x:hidden}:host .buttons{display:flex;flex-direction:row;justify-content:flex-end}\n"] }]
-        }], ctorParameters: function () { return [{ type: NaturalSidenavService }, { type: i0.ElementRef }]; }, propDecorators: { name: [{
+        }], ctorParameters: function () { return [{ type: NaturalSidenavService }]; }, propDecorators: { name: [{
                 type: Input
             }], position: [{
                 type: Input
@@ -9814,9 +9819,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImpor
 class NaturalSidenavContentComponent {
     constructor() { }
 }
-NaturalSidenavContentComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSidenavContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-NaturalSidenavContentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: NaturalSidenavContentComponent, selector: "natural-sidenav-content", ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [":host{flex:1;display:flex;flex-direction:column;overflow:auto}\n"] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSidenavContentComponent, decorators: [{
+NaturalSidenavContentComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalSidenavContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+NaturalSidenavContentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: NaturalSidenavContentComponent, selector: "natural-sidenav-content", ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [":host{flex:1;display:flex;flex-direction:column;overflow:auto}\n"] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalSidenavContentComponent, decorators: [{
             type: Component,
             args: [{ selector: 'natural-sidenav-content', template: '<ng-content></ng-content>', styles: [":host{flex:1;display:flex;flex-direction:column;overflow:auto}\n"] }]
         }], ctorParameters: function () { return []; } });
@@ -9824,9 +9829,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImpor
 class NaturalSidenavComponent {
     constructor() { }
 }
-NaturalSidenavComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSidenavComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-NaturalSidenavComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: NaturalSidenavComponent, selector: "natural-sidenav", ngImport: i0, template: '<ng-content></ng-content>', isInline: true });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSidenavComponent, decorators: [{
+NaturalSidenavComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalSidenavComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+NaturalSidenavComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: NaturalSidenavComponent, selector: "natural-sidenav", ngImport: i0, template: '<ng-content></ng-content>', isInline: true });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalSidenavComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'natural-sidenav',
@@ -9836,10 +9841,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImpor
 
 class NaturalSidenavModule {
 }
-NaturalSidenavModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSidenavModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NaturalSidenavModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSidenavModule, declarations: [NaturalSidenavComponent, NaturalSidenavContainerComponent, NaturalSidenavContentComponent], imports: [CommonModule, MatSidenavModule, MatIconModule, MatButtonModule], exports: [NaturalSidenavComponent, NaturalSidenavContainerComponent, NaturalSidenavContentComponent] });
-NaturalSidenavModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSidenavModule, providers: [sessionStorageProvider], imports: [[CommonModule, MatSidenavModule, MatIconModule, MatButtonModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalSidenavModule, decorators: [{
+NaturalSidenavModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalSidenavModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NaturalSidenavModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: NaturalSidenavModule, declarations: [NaturalSidenavComponent, NaturalSidenavContainerComponent, NaturalSidenavContentComponent], imports: [CommonModule, MatSidenavModule, MatIconModule, MatButtonModule], exports: [NaturalSidenavComponent, NaturalSidenavContainerComponent, NaturalSidenavContentComponent] });
+NaturalSidenavModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalSidenavModule, providers: [sessionStorageProvider], imports: [CommonModule, MatSidenavModule, MatIconModule, MatButtonModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalSidenavModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [NaturalSidenavComponent, NaturalSidenavContainerComponent, NaturalSidenavContentComponent],
@@ -9855,21 +9860,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImpor
 
 class NaturalStampComponent {
 }
-NaturalStampComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalStampComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-NaturalStampComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: NaturalStampComponent, selector: "natural-stamp", inputs: { item: "item" }, ngImport: i0, template: "<ng-container *ngIf=\"item\">\n    <div *ngIf=\"item.creationDate || item.creator\">\n        <span class=\"mat-body-2\" i18n>Cr\u00E9ation</span>\n        :\n        <span *ngIf=\"item.creator\">{{ item.creator?.fullName || item.creator?.name }}</span>\n        <span *ngIf=\"item.creator && item.creationDate\">,&nbsp;</span>\n        <span *ngIf=\"item.creationDate\"\n            >{{ item.creationDate | date: 'mediumDate' }} - {{ item.creationDate | date: 'shortTime' }}</span\n        >\n    </div>\n\n    <div *ngIf=\"item.updateDate || item.updater\">\n        <span class=\"mat-body-2\" i18n>Modification</span>\n        :\n        <span *ngIf=\"item.updater\">{{ item.updater?.fullName || item.updater?.name }}</span>\n        <span *ngIf=\"item.updater && item.updateDate\">,&nbsp;</span>\n        <span *ngIf=\"item.updateDate\"\n            >{{ item.updateDate | date: 'mediumDate' }} - {{ item.updateDate | date: 'shortTime' }}</span\n        >\n    </div>\n</ng-container>\n", directives: [{ type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "date": i6.DatePipe } });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalStampComponent, decorators: [{
+NaturalStampComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalStampComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+NaturalStampComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: NaturalStampComponent, selector: "natural-stamp", inputs: { item: "item" }, ngImport: i0, template: "<ng-container *ngIf=\"item\">\n    <div *ngIf=\"item.creationDate || item.creator\">\n        <span class=\"mat-body-2\" i18n>Cr\u00E9ation</span>\n        :\n        <span *ngIf=\"item.creator\">{{ item.creator.fullName || item.creator.name }}</span>\n        <span *ngIf=\"item.creator && item.creationDate\">,&nbsp;</span>\n        <span *ngIf=\"item.creationDate\"\n            >{{ item.creationDate | date: 'mediumDate' }} - {{ item.creationDate | date: 'shortTime' }}</span\n        >\n    </div>\n\n    <div *ngIf=\"item.updateDate || item.updater\">\n        <span class=\"mat-body-2\" i18n>Modification</span>\n        :\n        <span *ngIf=\"item.updater\">{{ item.updater.fullName || item.updater.name }}</span>\n        <span *ngIf=\"item.updater && item.updateDate\">,&nbsp;</span>\n        <span *ngIf=\"item.updateDate\"\n            >{{ item.updateDate | date: 'mediumDate' }} - {{ item.updateDate | date: 'shortTime' }}</span\n        >\n    </div>\n</ng-container>\n", dependencies: [{ kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$3.DatePipe, name: "date" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalStampComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'natural-stamp', template: "<ng-container *ngIf=\"item\">\n    <div *ngIf=\"item.creationDate || item.creator\">\n        <span class=\"mat-body-2\" i18n>Cr\u00E9ation</span>\n        :\n        <span *ngIf=\"item.creator\">{{ item.creator?.fullName || item.creator?.name }}</span>\n        <span *ngIf=\"item.creator && item.creationDate\">,&nbsp;</span>\n        <span *ngIf=\"item.creationDate\"\n            >{{ item.creationDate | date: 'mediumDate' }} - {{ item.creationDate | date: 'shortTime' }}</span\n        >\n    </div>\n\n    <div *ngIf=\"item.updateDate || item.updater\">\n        <span class=\"mat-body-2\" i18n>Modification</span>\n        :\n        <span *ngIf=\"item.updater\">{{ item.updater?.fullName || item.updater?.name }}</span>\n        <span *ngIf=\"item.updater && item.updateDate\">,&nbsp;</span>\n        <span *ngIf=\"item.updateDate\"\n            >{{ item.updateDate | date: 'mediumDate' }} - {{ item.updateDate | date: 'shortTime' }}</span\n        >\n    </div>\n</ng-container>\n" }]
+            args: [{ selector: 'natural-stamp', template: "<ng-container *ngIf=\"item\">\n    <div *ngIf=\"item.creationDate || item.creator\">\n        <span class=\"mat-body-2\" i18n>Cr\u00E9ation</span>\n        :\n        <span *ngIf=\"item.creator\">{{ item.creator.fullName || item.creator.name }}</span>\n        <span *ngIf=\"item.creator && item.creationDate\">,&nbsp;</span>\n        <span *ngIf=\"item.creationDate\"\n            >{{ item.creationDate | date: 'mediumDate' }} - {{ item.creationDate | date: 'shortTime' }}</span\n        >\n    </div>\n\n    <div *ngIf=\"item.updateDate || item.updater\">\n        <span class=\"mat-body-2\" i18n>Modification</span>\n        :\n        <span *ngIf=\"item.updater\">{{ item.updater.fullName || item.updater.name }}</span>\n        <span *ngIf=\"item.updater && item.updateDate\">,&nbsp;</span>\n        <span *ngIf=\"item.updateDate\"\n            >{{ item.updateDate | date: 'mediumDate' }} - {{ item.updateDate | date: 'shortTime' }}</span\n        >\n    </div>\n</ng-container>\n" }]
         }], propDecorators: { item: [{
                 type: Input
             }] } });
 
 class NaturalStampModule {
 }
-NaturalStampModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalStampModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NaturalStampModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalStampModule, declarations: [NaturalStampComponent], imports: [CommonModule], exports: [NaturalStampComponent] });
-NaturalStampModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalStampModule, imports: [[CommonModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalStampModule, decorators: [{
+NaturalStampModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalStampModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NaturalStampModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: NaturalStampModule, declarations: [NaturalStampComponent], imports: [CommonModule], exports: [NaturalStampComponent] });
+NaturalStampModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalStampModule, imports: [CommonModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalStampModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [NaturalStampComponent],
@@ -9912,9 +9917,9 @@ class NaturalTableButtonComponent {
         }
     }
 }
-NaturalTableButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalTableButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-NaturalTableButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: NaturalTableButtonComponent, selector: "natural-table-button", inputs: { queryParams: "queryParams", queryParamsHandling: "queryParamsHandling", label: "label", icon: "icon", href: "href", navigate: "navigate", fragment: "fragment", preserveFragment: "preserveFragment", raised: "raised", color: "color" }, usesOnChanges: true, ngImport: i0, template: "<!-- Because directives can't be applied conditionally (routerLink, mat-button and mat-icon-button), we have to use different elements -->\n\n<!-- Edge case of a button without any kind of link at all -->\n<span *ngIf=\"type === 'none'\">\n    <natural-icon *ngIf=\"icon\" [name]=\"icon\"></natural-icon>\n    <span *ngIf=\"label\">{{ label }}</span>\n</span>\n\n<ng-container *ngIf=\"!raised\">\n    <!-- App routed link with label... -->\n    <a\n        *ngIf=\"type === 'routerLink' && label\"\n        [color]=\"color\"\n        [queryParams]=\"queryParams\"\n        [queryParamsHandling]=\"queryParamsHandling\"\n        [routerLink]=\"navigate\"\n        [fragment]=\"fragment\"\n        [preserveFragment]=\"preserveFragment\"\n        mat-button\n    >\n        <natural-icon *ngIf=\"icon\" [name]=\"icon\"></natural-icon>\n        <span>{{ label }}</span>\n    </a>\n\n    <!-- ... and without label -->\n    <a\n        *ngIf=\"type === 'routerLink' && !label\"\n        [color]=\"color\"\n        [queryParams]=\"queryParams\"\n        [queryParamsHandling]=\"queryParamsHandling\"\n        [routerLink]=\"navigate\"\n        [fragment]=\"fragment\"\n        [preserveFragment]=\"preserveFragment\"\n        mat-icon-button\n    >\n        <natural-icon *ngIf=\"icon\" [name]=\"icon\"></natural-icon>\n    </a>\n\n    <!-- External link with label... -->\n    <a *ngIf=\"type === 'href' && label\" [attr.href]=\"href\" [color]=\"color\" mat-button target=\"_blank\">\n        <natural-icon *ngIf=\"icon\" [name]=\"icon\"></natural-icon>\n        <span>{{ label }}</span>\n    </a>\n\n    <!-- ... and without label -->\n    <a *ngIf=\"type === 'href' && !label\" [attr.href]=\"href\" [color]=\"color\" mat-icon-button target=\"_blank\">\n        <natural-icon *ngIf=\"icon\" [name]=\"icon\"></natural-icon>\n    </a>\n</ng-container>\n\n<ng-container *ngIf=\"raised\">\n    <!-- App routed link with label... -->\n    <a\n        *ngIf=\"type === 'routerLink' && label\"\n        [color]=\"color\"\n        [queryParams]=\"queryParams\"\n        [queryParamsHandling]=\"queryParamsHandling\"\n        [routerLink]=\"navigate\"\n        [fragment]=\"fragment\"\n        [preserveFragment]=\"preserveFragment\"\n        mat-raised-button\n    >\n        <natural-icon *ngIf=\"icon\" [name]=\"icon\"></natural-icon>\n        <span>{{ label }}</span>\n    </a>\n\n    <!-- ... and without label -->\n    <a\n        *ngIf=\"type === 'routerLink' && !label\"\n        [color]=\"color\"\n        [queryParams]=\"queryParams\"\n        [queryParamsHandling]=\"queryParamsHandling\"\n        [routerLink]=\"navigate\"\n        [fragment]=\"fragment\"\n        [preserveFragment]=\"preserveFragment\"\n        mat-icon-button\n        mat-raised-button\n    >\n        <natural-icon *ngIf=\"icon\" [name]=\"icon\"></natural-icon>\n    </a>\n\n    <!-- External link with label... -->\n    <a *ngIf=\"type === 'href' && label\" [attr.href]=\"href\" [color]=\"color\" mat-raised-button target=\"_blank\">\n        <natural-icon *ngIf=\"icon\" [name]=\"icon\"></natural-icon>\n        <span>{{ label }}</span>\n    </a>\n\n    <!-- ... and without label -->\n    <a\n        *ngIf=\"type === 'href' && !label\"\n        [attr.href]=\"href\"\n        [color]=\"color\"\n        mat-icon-button\n        mat-raised-button\n        target=\"_blank\"\n    >\n        <natural-icon *ngIf=\"icon\" [name]=\"icon\"></natural-icon>\n    </a>\n</ng-container>\n", styles: ["natural-table-button{flex:1;display:flex;flex-direction:row;justify-content:flex-start;align-items:center}natural-table-button a.mat-button{flex:1;display:flex;flex-direction:row;align-items:center;justify-content:flex-start}natural-table-button a.mat-button .mat-button-wrapper{display:flex;flex-direction:row;align-items:center}natural-table-button a.mat-button .mat-button-wrapper>*{display:flex;flex-direction:row;align-items:center}natural-table-button a.mat-button .mat-button-wrapper>:not(:last-child){margin-right:5px}natural-table-button>span{padding:0 16px}\n"], components: [{ type: NaturalIconComponent, selector: "natural-icon", inputs: ["label", "labelColor", "labelPosition", "name", "size"] }, { type: i1.MatAnchor, selector: "a[mat-button], a[mat-raised-button], a[mat-icon-button], a[mat-fab],             a[mat-mini-fab], a[mat-stroked-button], a[mat-flat-button]", inputs: ["disabled", "disableRipple", "color", "tabIndex"], exportAs: ["matButton", "matAnchor"] }], directives: [{ type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }], encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalTableButtonComponent, decorators: [{
+NaturalTableButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalTableButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+NaturalTableButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: NaturalTableButtonComponent, selector: "natural-table-button", inputs: { queryParams: "queryParams", queryParamsHandling: "queryParamsHandling", label: "label", icon: "icon", href: "href", navigate: "navigate", fragment: "fragment", preserveFragment: "preserveFragment", raised: "raised", color: "color" }, usesOnChanges: true, ngImport: i0, template: "<!-- Because directives can't be applied conditionally (routerLink, mat-button and mat-icon-button), we have to use different elements -->\n\n<!-- Edge case of a button without any kind of link at all -->\n<span *ngIf=\"type === 'none'\">\n    <natural-icon *ngIf=\"icon\" [name]=\"icon\"></natural-icon>\n    <span *ngIf=\"label\">{{ label }}</span>\n</span>\n\n<ng-container *ngIf=\"!raised\">\n    <!-- App routed link with label... -->\n    <a\n        *ngIf=\"type === 'routerLink' && label\"\n        [color]=\"color\"\n        [queryParams]=\"queryParams\"\n        [queryParamsHandling]=\"queryParamsHandling\"\n        [routerLink]=\"navigate\"\n        [fragment]=\"fragment\"\n        [preserveFragment]=\"preserveFragment\"\n        mat-button\n    >\n        <natural-icon *ngIf=\"icon\" [name]=\"icon\"></natural-icon>\n        <span>{{ label }}</span>\n    </a>\n\n    <!-- ... and without label -->\n    <a\n        *ngIf=\"type === 'routerLink' && !label\"\n        [color]=\"color\"\n        [queryParams]=\"queryParams\"\n        [queryParamsHandling]=\"queryParamsHandling\"\n        [routerLink]=\"navigate\"\n        [fragment]=\"fragment\"\n        [preserveFragment]=\"preserveFragment\"\n        mat-icon-button\n    >\n        <natural-icon *ngIf=\"icon\" [name]=\"icon\"></natural-icon>\n    </a>\n\n    <!-- External link with label... -->\n    <a *ngIf=\"type === 'href' && label\" [attr.href]=\"href\" [color]=\"color\" mat-button target=\"_blank\">\n        <natural-icon *ngIf=\"icon\" [name]=\"icon\"></natural-icon>\n        <span>{{ label }}</span>\n    </a>\n\n    <!-- ... and without label -->\n    <a *ngIf=\"type === 'href' && !label\" [attr.href]=\"href\" [color]=\"color\" mat-icon-button target=\"_blank\">\n        <natural-icon *ngIf=\"icon\" [name]=\"icon\"></natural-icon>\n    </a>\n</ng-container>\n\n<ng-container *ngIf=\"raised\">\n    <!-- App routed link with label... -->\n    <a\n        *ngIf=\"type === 'routerLink' && label\"\n        [color]=\"color\"\n        [queryParams]=\"queryParams\"\n        [queryParamsHandling]=\"queryParamsHandling\"\n        [routerLink]=\"navigate\"\n        [fragment]=\"fragment\"\n        [preserveFragment]=\"preserveFragment\"\n        mat-raised-button\n    >\n        <natural-icon *ngIf=\"icon\" [name]=\"icon\"></natural-icon>\n        <span>{{ label }}</span>\n    </a>\n\n    <!-- ... and without label -->\n    <a\n        *ngIf=\"type === 'routerLink' && !label\"\n        [color]=\"color\"\n        [queryParams]=\"queryParams\"\n        [queryParamsHandling]=\"queryParamsHandling\"\n        [routerLink]=\"navigate\"\n        [fragment]=\"fragment\"\n        [preserveFragment]=\"preserveFragment\"\n        mat-icon-button\n        mat-raised-button\n    >\n        <natural-icon *ngIf=\"icon\" [name]=\"icon\"></natural-icon>\n    </a>\n\n    <!-- External link with label... -->\n    <a *ngIf=\"type === 'href' && label\" [attr.href]=\"href\" [color]=\"color\" mat-raised-button target=\"_blank\">\n        <natural-icon *ngIf=\"icon\" [name]=\"icon\"></natural-icon>\n        <span>{{ label }}</span>\n    </a>\n\n    <!-- ... and without label -->\n    <a\n        *ngIf=\"type === 'href' && !label\"\n        [attr.href]=\"href\"\n        [color]=\"color\"\n        mat-icon-button\n        mat-raised-button\n        target=\"_blank\"\n    >\n        <natural-icon *ngIf=\"icon\" [name]=\"icon\"></natural-icon>\n    </a>\n</ng-container>\n", styles: ["natural-table-button{flex:1;display:flex;flex-direction:row;justify-content:flex-start;align-items:center}natural-table-button a.mat-button{flex:1;display:flex;flex-direction:row;align-items:center;justify-content:flex-start}natural-table-button a.mat-button .mat-button-wrapper{display:flex;flex-direction:row;align-items:center}natural-table-button a.mat-button .mat-button-wrapper>*{display:flex;flex-direction:row;align-items:center}natural-table-button a.mat-button .mat-button-wrapper>:not(:last-child){margin-right:5px}natural-table-button>span{padding:0 16px}\n"], dependencies: [{ kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { kind: "component", type: i4.MatAnchor, selector: "a[mat-button], a[mat-raised-button], a[mat-icon-button], a[mat-fab],             a[mat-mini-fab], a[mat-stroked-button], a[mat-flat-button]", inputs: ["disabled", "disableRipple", "color", "tabIndex"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: NaturalIconComponent, selector: "natural-icon", inputs: ["label", "labelColor", "labelPosition", "name", "size"] }], encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalTableButtonComponent, decorators: [{
             type: Component,
             args: [{ selector: 'natural-table-button', encapsulation: ViewEncapsulation.None, template: "<!-- Because directives can't be applied conditionally (routerLink, mat-button and mat-icon-button), we have to use different elements -->\n\n<!-- Edge case of a button without any kind of link at all -->\n<span *ngIf=\"type === 'none'\">\n    <natural-icon *ngIf=\"icon\" [name]=\"icon\"></natural-icon>\n    <span *ngIf=\"label\">{{ label }}</span>\n</span>\n\n<ng-container *ngIf=\"!raised\">\n    <!-- App routed link with label... -->\n    <a\n        *ngIf=\"type === 'routerLink' && label\"\n        [color]=\"color\"\n        [queryParams]=\"queryParams\"\n        [queryParamsHandling]=\"queryParamsHandling\"\n        [routerLink]=\"navigate\"\n        [fragment]=\"fragment\"\n        [preserveFragment]=\"preserveFragment\"\n        mat-button\n    >\n        <natural-icon *ngIf=\"icon\" [name]=\"icon\"></natural-icon>\n        <span>{{ label }}</span>\n    </a>\n\n    <!-- ... and without label -->\n    <a\n        *ngIf=\"type === 'routerLink' && !label\"\n        [color]=\"color\"\n        [queryParams]=\"queryParams\"\n        [queryParamsHandling]=\"queryParamsHandling\"\n        [routerLink]=\"navigate\"\n        [fragment]=\"fragment\"\n        [preserveFragment]=\"preserveFragment\"\n        mat-icon-button\n    >\n        <natural-icon *ngIf=\"icon\" [name]=\"icon\"></natural-icon>\n    </a>\n\n    <!-- External link with label... -->\n    <a *ngIf=\"type === 'href' && label\" [attr.href]=\"href\" [color]=\"color\" mat-button target=\"_blank\">\n        <natural-icon *ngIf=\"icon\" [name]=\"icon\"></natural-icon>\n        <span>{{ label }}</span>\n    </a>\n\n    <!-- ... and without label -->\n    <a *ngIf=\"type === 'href' && !label\" [attr.href]=\"href\" [color]=\"color\" mat-icon-button target=\"_blank\">\n        <natural-icon *ngIf=\"icon\" [name]=\"icon\"></natural-icon>\n    </a>\n</ng-container>\n\n<ng-container *ngIf=\"raised\">\n    <!-- App routed link with label... -->\n    <a\n        *ngIf=\"type === 'routerLink' && label\"\n        [color]=\"color\"\n        [queryParams]=\"queryParams\"\n        [queryParamsHandling]=\"queryParamsHandling\"\n        [routerLink]=\"navigate\"\n        [fragment]=\"fragment\"\n        [preserveFragment]=\"preserveFragment\"\n        mat-raised-button\n    >\n        <natural-icon *ngIf=\"icon\" [name]=\"icon\"></natural-icon>\n        <span>{{ label }}</span>\n    </a>\n\n    <!-- ... and without label -->\n    <a\n        *ngIf=\"type === 'routerLink' && !label\"\n        [color]=\"color\"\n        [queryParams]=\"queryParams\"\n        [queryParamsHandling]=\"queryParamsHandling\"\n        [routerLink]=\"navigate\"\n        [fragment]=\"fragment\"\n        [preserveFragment]=\"preserveFragment\"\n        mat-icon-button\n        mat-raised-button\n    >\n        <natural-icon *ngIf=\"icon\" [name]=\"icon\"></natural-icon>\n    </a>\n\n    <!-- External link with label... -->\n    <a *ngIf=\"type === 'href' && label\" [attr.href]=\"href\" [color]=\"color\" mat-raised-button target=\"_blank\">\n        <natural-icon *ngIf=\"icon\" [name]=\"icon\"></natural-icon>\n        <span>{{ label }}</span>\n    </a>\n\n    <!-- ... and without label -->\n    <a\n        *ngIf=\"type === 'href' && !label\"\n        [attr.href]=\"href\"\n        [color]=\"color\"\n        mat-icon-button\n        mat-raised-button\n        target=\"_blank\"\n    >\n        <natural-icon *ngIf=\"icon\" [name]=\"icon\"></natural-icon>\n    </a>\n</ng-container>\n", styles: ["natural-table-button{flex:1;display:flex;flex-direction:row;justify-content:flex-start;align-items:center}natural-table-button a.mat-button{flex:1;display:flex;flex-direction:row;align-items:center;justify-content:flex-start}natural-table-button a.mat-button .mat-button-wrapper{display:flex;flex-direction:row;align-items:center}natural-table-button a.mat-button .mat-button-wrapper>*{display:flex;flex-direction:row;align-items:center}natural-table-button a.mat-button .mat-button-wrapper>:not(:last-child){margin-right:5px}natural-table-button>span{padding:0 16px}\n"] }]
         }], propDecorators: { queryParams: [{
@@ -9941,10 +9946,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImpor
 
 class NaturalTableButtonModule {
 }
-NaturalTableButtonModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalTableButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NaturalTableButtonModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalTableButtonModule, declarations: [NaturalTableButtonComponent], imports: [CommonModule, RouterModule, MatButtonModule, NaturalIconModule], exports: [NaturalTableButtonComponent] });
-NaturalTableButtonModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalTableButtonModule, imports: [[CommonModule, RouterModule, MatButtonModule, NaturalIconModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalTableButtonModule, decorators: [{
+NaturalTableButtonModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalTableButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NaturalTableButtonModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: NaturalTableButtonModule, declarations: [NaturalTableButtonComponent], imports: [CommonModule, RouterModule, MatButtonModule, NaturalIconModule], exports: [NaturalTableButtonComponent] });
+NaturalTableButtonModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalTableButtonModule, imports: [CommonModule, RouterModule, MatButtonModule, NaturalIconModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalTableButtonModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [NaturalTableButtonComponent],
@@ -10013,21 +10018,21 @@ class NaturalDialogTriggerComponent {
         }
     }
 }
-NaturalDialogTriggerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalDialogTriggerComponent, deps: [{ token: i1$1.MatDialog }, { token: i2$1.ActivatedRoute }, { token: i2$1.Router }], target: i0.ɵɵFactoryTarget.Component });
-NaturalDialogTriggerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: NaturalDialogTriggerComponent, selector: "ng-component", ngImport: i0, template: '', isInline: true });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalDialogTriggerComponent, decorators: [{
+NaturalDialogTriggerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalDialogTriggerComponent, deps: [{ token: i1.MatDialog }, { token: i2$1.ActivatedRoute }, { token: i2$1.Router }], target: i0.ɵɵFactoryTarget.Component });
+NaturalDialogTriggerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: NaturalDialogTriggerComponent, selector: "ng-component", ngImport: i0, template: '', isInline: true });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalDialogTriggerComponent, decorators: [{
             type: Component,
             args: [{
                     template: '',
                 }]
-        }], ctorParameters: function () { return [{ type: i1$1.MatDialog }, { type: i2$1.ActivatedRoute }, { type: i2$1.Router }]; } });
+        }], ctorParameters: function () { return [{ type: i1.MatDialog }, { type: i2$1.ActivatedRoute }, { type: i2$1.Router }]; } });
 
 class NaturalDialogTriggerModule {
 }
-NaturalDialogTriggerModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalDialogTriggerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NaturalDialogTriggerModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalDialogTriggerModule, declarations: [NaturalDialogTriggerComponent], imports: [CommonModule, MatDialogModule], exports: [NaturalDialogTriggerComponent] });
-NaturalDialogTriggerModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalDialogTriggerModule, imports: [[CommonModule, MatDialogModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalDialogTriggerModule, decorators: [{
+NaturalDialogTriggerModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalDialogTriggerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NaturalDialogTriggerModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: NaturalDialogTriggerModule, declarations: [NaturalDialogTriggerComponent], imports: [CommonModule, MatDialogModule], exports: [NaturalDialogTriggerComponent] });
+NaturalDialogTriggerModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalDialogTriggerModule, imports: [CommonModule, MatDialogModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalDialogTriggerModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [NaturalDialogTriggerComponent],
@@ -10176,9 +10181,9 @@ class AvatarService {
             .reduce((previous, current) => previous + current);
     }
 }
-AvatarService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: AvatarService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-AvatarService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: AvatarService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: AvatarService, decorators: [{
+AvatarService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: AvatarService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+AvatarService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: AvatarService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: AvatarService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
@@ -10304,8 +10309,8 @@ class AvatarComponent {
         };
     }
 }
-AvatarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: AvatarComponent, deps: [{ token: AvatarService }], target: i0.ɵɵFactoryTarget.Component });
-AvatarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.0", type: AvatarComponent, selector: "natural-avatar", inputs: { image: "image", initials: "initials", gravatar: "gravatar", size: "size", textSizeRatio: "textSizeRatio", bgColor: "bgColor", fgColor: "fgColor", borderRadius: "borderRadius", textMaximumLength: "textMaximumLength" }, usesOnChanges: true, ngImport: i0, template: `
+AvatarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: AvatarComponent, deps: [{ token: AvatarService }], target: i0.ɵɵFactoryTarget.Component });
+AvatarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: AvatarComponent, selector: "natural-avatar", inputs: { image: "image", initials: "initials", gravatar: "gravatar", size: "size", textSizeRatio: "textSizeRatio", bgColor: "bgColor", fgColor: "fgColor", borderRadius: "borderRadius", textMaximumLength: "textMaximumLength" }, usesOnChanges: true, ngImport: i0, template: `
         <div class="avatar-container" [ngStyle]="hostStyle">
             <img
                 *ngIf="avatarSrc"
@@ -10321,19 +10326,10 @@ AvatarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", versio
                 {{ avatarText }}
             </div>
         </div>
-    `, isInline: true, styles: [":host{border-radius:50%}\n"], directives: [{ type: i6.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: AvatarComponent, decorators: [{
+    `, isInline: true, styles: [":host{border-radius:50%}\n"], dependencies: [{ kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: AvatarComponent, decorators: [{
             type: Component,
-            args: [{
-                    selector: 'natural-avatar',
-                    styles: [
-                        `
-            :host {
-                border-radius: 50%;
-            }
-        `,
-                    ],
-                    template: `
+            args: [{ selector: 'natural-avatar', template: `
         <div class="avatar-container" [ngStyle]="hostStyle">
             <img
                 *ngIf="avatarSrc"
@@ -10349,8 +10345,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImpor
                 {{ avatarText }}
             </div>
         </div>
-    `,
-                }]
+    `, styles: [":host{border-radius:50%}\n"] }]
         }], ctorParameters: function () { return [{ type: AvatarService }]; }, propDecorators: { image: [{
                 type: Input
             }], initials: [{
@@ -10374,10 +10369,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImpor
 const declarations = [AvatarComponent];
 class NaturalAvatarModule {
 }
-NaturalAvatarModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalAvatarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NaturalAvatarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalAvatarModule, declarations: [AvatarComponent], imports: [CommonModule], exports: [AvatarComponent] });
-NaturalAvatarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalAvatarModule, imports: [[CommonModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalAvatarModule, decorators: [{
+NaturalAvatarModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalAvatarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NaturalAvatarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: NaturalAvatarModule, declarations: [AvatarComponent], imports: [CommonModule], exports: [AvatarComponent] });
+NaturalAvatarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalAvatarModule, imports: [CommonModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalAvatarModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule],
@@ -10392,10 +10387,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImpor
 
 class NaturalMatomoModule {
 }
-NaturalMatomoModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalMatomoModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NaturalMatomoModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalMatomoModule });
-NaturalMatomoModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalMatomoModule });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalMatomoModule, decorators: [{
+NaturalMatomoModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalMatomoModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NaturalMatomoModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: NaturalMatomoModule });
+NaturalMatomoModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalMatomoModule });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalMatomoModule, decorators: [{
             type: NgModule,
             args: [{}]
         }] });
@@ -10484,9 +10479,9 @@ class NaturalMatomoService {
         });
     }
 }
-NaturalMatomoService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalMatomoService, deps: [{ token: i2$1.Router }, { token: DOCUMENT }, { token: PLATFORM_ID }, { token: i2$2.Title }], target: i0.ɵɵFactoryTarget.Injectable });
-NaturalMatomoService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalMatomoService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalMatomoService, decorators: [{
+NaturalMatomoService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalMatomoService, deps: [{ token: i2$1.Router }, { token: DOCUMENT }, { token: PLATFORM_ID }, { token: i2$2.Title }], target: i0.ɵɵFactoryTarget.Injectable });
+NaturalMatomoService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalMatomoService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalMatomoService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
@@ -10578,14 +10573,14 @@ class NaturalErrorHandler extends ErrorHandler {
         }
     }
 }
-NaturalErrorHandler.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalErrorHandler, deps: [{ token: i1$a.HttpClient }, { token: DOCUMENT }, { token: NaturalLoggerConfigUrl, optional: true }, { token: NaturalLoggerConfigExtra, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
-NaturalErrorHandler.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalErrorHandler, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalErrorHandler, decorators: [{
+NaturalErrorHandler.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalErrorHandler, deps: [{ token: i1$8.HttpClient }, { token: DOCUMENT }, { token: NaturalLoggerConfigUrl, optional: true }, { token: NaturalLoggerConfigExtra, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
+NaturalErrorHandler.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalErrorHandler, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalErrorHandler, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
                 }]
-        }], ctorParameters: function () { return [{ type: i1$a.HttpClient }, { type: Document, decorators: [{
+        }], ctorParameters: function () { return [{ type: i1$8.HttpClient }, { type: Document, decorators: [{
                     type: Inject,
                     args: [DOCUMENT]
                 }] }, { type: undefined, decorators: [{
@@ -10622,10 +10617,10 @@ class NaturalErrorModule {
         };
     }
 }
-NaturalErrorModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalErrorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NaturalErrorModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalErrorModule, imports: [HttpClientModule] });
-NaturalErrorModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalErrorModule, imports: [[HttpClientModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.0", ngImport: i0, type: NaturalErrorModule, decorators: [{
+NaturalErrorModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalErrorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NaturalErrorModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: NaturalErrorModule, imports: [HttpClientModule] });
+NaturalErrorModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalErrorModule, imports: [HttpClientModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: NaturalErrorModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [HttpClientModule],