@ajf/material 13.2.15 → 15.1.1

package/fesm2015/ajf-material-forms.mjs

@@ -1,15 +1,15 @@
-import * as i1$1 from '@ajf/core/forms';
+import * as i1 from '@ajf/core/forms';
 import { AjfBaseFieldComponent, AJF_WARNING_ALERT_SERVICE, AjfInputFieldComponent as AjfInputFieldComponent$1, AjfFieldWithChoicesComponent, AJF_SEARCH_ALERT_THRESHOLD, AjfTableFieldComponent as AjfTableFieldComponent$1, AjfVideoUrlFieldComponent as AjfVideoUrlFieldComponent$1, AjfFieldService as AjfFieldService$1, AjfFieldType, AjfReadOnlyFieldComponent, AjfReadOnlyTableFieldComponent, AjfReadOnlySelectFieldComponent, AjfFileFieldComponent, AjfReadOnlyFileFieldComponent, AjfImageFieldComponent, AjfReadOnlyImageFieldComponent, AjfReadOnlyVideoUrlFieldComponent, AjfFormField as AjfFormField$1, AjfFormRenderer as AjfFormRenderer$1, AjfFormsModule as AjfFormsModule$1 } from '@ajf/core/forms';
 import * as i0 from '@angular/core';
 import { Component, ChangeDetectionStrategy, ViewEncapsulation, Injectable, Inject, ViewChild, Optional, Input, NgModule } from '@angular/core';
-import * as i2$1 from '@angular/material/slide-toggle';
-import { MatSlideToggleModule } from '@angular/material/slide-toggle';
-import * as i3 from '@angular/common';
+import * as i2$1 from '@angular/common';
 import { CommonModule } from '@angular/common';
-import * as i4 from '@angular/forms';
+import * as i3 from '@angular/material/slide-toggle';
+import { MatSlideToggleModule } from '@angular/material/slide-toggle';
+import * as i6 from '@angular/forms';
 import { ReactiveFormsModule } from '@angular/forms';
 import { map } from 'rxjs/operators';
-import * as i1 from '@angular/material/button';
+import * as i5 from '@angular/material/button';
 import { MatButtonModule } from '@angular/material/button';
 import * as i2 from '@angular/material/dialog';
 import { MatDialogModule } from '@angular/material/dialog';
@@ -17,42 +17,45 @@ import * as i2$2 from '@ajf/material/calendar';
 import { AjfCalendarModule } from '@ajf/material/calendar';
 import * as i4$1 from '@angular/material/input';
 import { MatInput, MatInputModule } from '@angular/material/input';
-import * as i2$3 from '@angular/material/form-field';
+import * as i3$1 from '@angular/material/datepicker';
+import { MatDatepickerModule } from '@angular/material/datepicker';
+import * as i4 from '@angular/material/form-field';
 import { MatFormFieldModule } from '@angular/material/form-field';
-import * as i3$1 from '@ngneat/transloco';
-import * as i2$4 from '@ajf/material/barcode';
+import * as i3$2 from '@ngneat/transloco';
+import * as i2$3 from '@ajf/material/barcode';
 import { AjfBarcodeModule } from '@ajf/material/barcode';
-import * as i2$5 from '@angular/material/select';
-import { MatSelectModule } from '@angular/material/select';
-import * as i3$2 from '@angular/material/core';
-import * as i4$2 from '@ajf/material/checkbox-group';
+import * as i2$4 from '@ajf/material/checkbox-group';
 import { AjfCheckboxGroupModule } from '@ajf/material/checkbox-group';
-import * as i7 from '@ajf/core/checkbox-group';
+import * as i3$3 from '@ajf/core/checkbox-group';
+import * as i5$1 from '@angular/material/select';
+import { MatSelectModule } from '@angular/material/select';
+import * as i6$1 from '@angular/material/core';
+import { MatNativeDateModule } from '@angular/material/core';
 import { AjfRange } from '@ajf/core/range';
-import * as i2$6 from '@angular/material/slider';
+import * as i4$2 from '@angular/material/slider';
 import { MatSliderModule } from '@angular/material/slider';
-import * as i4$3 from '@angular/material/radio';
+import * as i3$4 from '@angular/material/radio';
 import { MatRadioModule } from '@angular/material/radio';
-import * as i4$4 from '@ajf/core/common';
+import * as i4$3 from '@ajf/core/common';
 import { AjfCommonModule } from '@ajf/core/common';
-import * as i5 from '@angular/cdk/text-field';
+import * as i5$2 from '@angular/cdk/text-field';
 import { TextFieldModule } from '@angular/cdk/text-field';
-import * as i2$7 from '@ajf/material/time';
+import * as i2$5 from '@ajf/material/time';
 import { AjfTimeModule } from '@ajf/material/time';
-import * as i2$8 from '@angular/platform-browser';
-import * as i3$3 from '@angular/common/http';
-import * as i2$9 from '@angular/material/toolbar';
-import { MatToolbarModule } from '@angular/material/toolbar';
-import * as i3$4 from '@angular/material/button-toggle';
-import { MatButtonToggleModule } from '@angular/material/button-toggle';
-import * as i4$5 from '@angular/material/icon';
-import { MatIconModule } from '@angular/material/icon';
-import * as i6 from '@ajf/material/page-slider';
+import * as i2$6 from '@angular/platform-browser';
+import * as i3$5 from '@angular/common/http';
+import * as i2$7 from '@ajf/core/page-slider';
+import * as i3$6 from '@ajf/material/page-slider';
 import { AjfPageSliderModule } from '@ajf/material/page-slider';
-import * as i7$1 from '@ajf/core/page-slider';
-import * as i8 from '@angular/material/card';
+import * as i6$2 from '@angular/material/button-toggle';
+import { MatButtonToggleModule } from '@angular/material/button-toggle';
+import * as i7 from '@angular/material/card';
 import { MatCardModule } from '@angular/material/card';
-import * as i12 from '@angular/material/tooltip';
+import * as i8 from '@angular/material/icon';
+import { MatIconModule } from '@angular/material/icon';
+import * as i9 from '@angular/material/toolbar';
+import { MatToolbarModule } from '@angular/material/toolbar';
+import * as i10 from '@angular/material/tooltip';
 import { MatTooltipModule } from '@angular/material/tooltip';
 import { AjfTranslocoModule } from '@ajf/core/transloco';
 
@@ -82,9 +85,9 @@ class AjfFieldWarningDialog {
         this.message = '';
     }
 }
-AjfFieldWarningDialog.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfFieldWarningDialog, deps: [], target: i0.ɵɵFactoryTarget.Component });
-AjfFieldWarningDialog.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.5", type: AjfFieldWarningDialog, selector: "ng-component", ngImport: i0, template: "<mat-dialog-content><div [innerHTML]=\"message\"></div></mat-dialog-content>\n<mat-dialog-actions>\n  <button mat-button [mat-dialog-close]=\"true\">Ok</button>\n  <button mat-button [mat-dialog-close]=\"false\">Cancel</button>\n</mat-dialog-actions>\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: i2.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i2.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }, { type: i2.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfFieldWarningDialog, decorators: [{
+AjfFieldWarningDialog.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfFieldWarningDialog, deps: [], target: i0.ɵɵFactoryTarget.Component });
+AjfFieldWarningDialog.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: AjfFieldWarningDialog, selector: "ng-component", ngImport: i0, template: "<mat-dialog-content><div [innerHTML]=\"message\"></div></mat-dialog-content>\n<mat-dialog-actions>\n  <button mat-button [mat-dialog-close]=\"true\">Ok</button>\n  <button mat-button [mat-dialog-close]=\"false\">Cancel</button>\n</mat-dialog-actions>\n", dependencies: [{ kind: "component", type: i5.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i2.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i2.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: i2.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfFieldWarningDialog, decorators: [{
             type: Component,
             args: [{ changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<mat-dialog-content><div [innerHTML]=\"message\"></div></mat-dialog-content>\n<mat-dialog-actions>\n  <button mat-button [mat-dialog-close]=\"true\">Ok</button>\n  <button mat-button [mat-dialog-close]=\"false\">Cancel</button>\n</mat-dialog-actions>\n" }]
         }] });
@@ -99,9 +102,9 @@ class AjfWarningAlertService {
         return dialog.afterClosed().pipe(map((result) => ({ result })));
     }
 }
-AjfWarningAlertService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfWarningAlertService, deps: [{ token: i2.MatDialog }], target: i0.ɵɵFactoryTarget.Injectable });
-AjfWarningAlertService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfWarningAlertService });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfWarningAlertService, decorators: [{
+AjfWarningAlertService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfWarningAlertService, deps: [{ token: i2.MatDialog }], target: i0.ɵɵFactoryTarget.Injectable });
+AjfWarningAlertService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfWarningAlertService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfWarningAlertService, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: i2.MatDialog }]; } });
 
@@ -131,13 +134,13 @@ class AjfBooleanFieldComponent extends AjfBaseFieldComponent {
         super(cdr, service, was);
     }
 }
-AjfBooleanFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfBooleanFieldComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.AjfFormRendererService }, { token: AJF_WARNING_ALERT_SERVICE }], target: i0.ɵɵFactoryTarget.Component });
-AjfBooleanFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.5", type: AjfBooleanFieldComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<mat-slide-toggle *ngIf=\"control|async as ctrl\" [formControl]=\"ctrl!\"></mat-slide-toggle>\n", styles: [""], components: [{ type: i2$1.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["disabled", "disableRipple", "color", "tabIndex", "name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "checked"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], pipes: { "async": i3.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfBooleanFieldComponent, decorators: [{
+AjfBooleanFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfBooleanFieldComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.AjfFormRendererService }, { token: AJF_WARNING_ALERT_SERVICE }], target: i0.ɵɵFactoryTarget.Component });
+AjfBooleanFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: AjfBooleanFieldComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<mat-slide-toggle *ngIf=\"control|async as ctrl\" [formControl]=\"ctrl!\"></mat-slide-toggle>\n", styles: [""], dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["disabled", "disableRipple", "color", "tabIndex"], exportAs: ["matSlideToggle"] }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: i2$1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfBooleanFieldComponent, decorators: [{
             type: Component,
-            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<mat-slide-toggle *ngIf=\"control|async as ctrl\" [formControl]=\"ctrl!\"></mat-slide-toggle>\n", styles: [""] }]
+            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<mat-slide-toggle *ngIf=\"control|async as ctrl\" [formControl]=\"ctrl!\"></mat-slide-toggle>\n" }]
         }], ctorParameters: function () {
-        return [{ type: i0.ChangeDetectorRef }, { type: i1$1.AjfFormRendererService }, { type: AjfWarningAlertService, decorators: [{
+        return [{ type: i0.ChangeDetectorRef }, { type: i1.AjfFormRendererService }, { type: AjfWarningAlertService, decorators: [{
                         type: Inject,
                         args: [AJF_WARNING_ALERT_SERVICE]
                     }] }];
@@ -169,13 +172,13 @@ class AjfDateFieldComponent extends AjfBaseFieldComponent {
         super(cdr, service, was);
     }
 }
-AjfDateFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfDateFieldComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.AjfFormRendererService }, { token: AJF_WARNING_ALERT_SERVICE }], target: i0.ɵɵFactoryTarget.Component });
-AjfDateFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.5", type: AjfDateFieldComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<ajf-calendar\n  *ngIf=\"control|async as ctrl\"\n  selectionMode=\"day\"\n  [dateOnlyForDay]=\"true\"\n  [minDate]=\"instance!.node.minDate|ajfDateValue\"\n  [maxDate]=\"instance!.node.maxDate|ajfDateValue\"\n  [formControl]=\"ctrl!\"\n></ajf-calendar>\n", styles: [""], components: [{ type: i2$2.AjfCalendarComponent, selector: "ajf-calendar" }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], pipes: { "ajfDateValue": i1$1.AjfDateValuePipe, "async": i3.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfDateFieldComponent, decorators: [{
+AjfDateFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfDateFieldComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.AjfFormRendererService }, { token: AJF_WARNING_ALERT_SERVICE }], target: i0.ɵɵFactoryTarget.Component });
+AjfDateFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: AjfDateFieldComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<ajf-calendar\n  *ngIf=\"control|async as ctrl\"\n  selectionMode=\"day\"\n  [dateOnlyForDay]=\"true\"\n  [minDate]=\"instance!.node.minDate|ajfDateValue\"\n  [maxDate]=\"instance!.node.maxDate|ajfDateValue\"\n  [formControl]=\"ctrl!\"\n></ajf-calendar>\n", styles: [""], dependencies: [{ kind: "component", type: i2$2.AjfCalendarComponent, selector: "ajf-calendar" }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: i2$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.AjfDateValuePipe, name: "ajfDateValue" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfDateFieldComponent, decorators: [{
             type: Component,
-            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ajf-calendar\n  *ngIf=\"control|async as ctrl\"\n  selectionMode=\"day\"\n  [dateOnlyForDay]=\"true\"\n  [minDate]=\"instance!.node.minDate|ajfDateValue\"\n  [maxDate]=\"instance!.node.maxDate|ajfDateValue\"\n  [formControl]=\"ctrl!\"\n></ajf-calendar>\n", styles: [""] }]
+            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ajf-calendar\n  *ngIf=\"control|async as ctrl\"\n  selectionMode=\"day\"\n  [dateOnlyForDay]=\"true\"\n  [minDate]=\"instance!.node.minDate|ajfDateValue\"\n  [maxDate]=\"instance!.node.maxDate|ajfDateValue\"\n  [formControl]=\"ctrl!\"\n></ajf-calendar>\n" }]
         }], ctorParameters: function () {
-        return [{ type: i0.ChangeDetectorRef }, { type: i1$1.AjfFormRendererService }, { type: AjfWarningAlertService, decorators: [{
+        return [{ type: i0.ChangeDetectorRef }, { type: i1.AjfFormRendererService }, { type: AjfWarningAlertService, decorators: [{
                         type: Inject,
                         args: [AJF_WARNING_ALERT_SERVICE]
                     }] }];
@@ -227,16 +230,16 @@ class AjfDateInputFieldComponent extends AjfBaseFieldComponent {
         this._maxDateStr = this._dvs.transform(this.instance.node.maxDate);
     }
 }
-AjfDateInputFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfDateInputFieldComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.AjfFormRendererService }, { token: AJF_WARNING_ALERT_SERVICE }, { token: i1$1.AjfDateValueStringPipe }], target: i0.ɵɵFactoryTarget.Component });
-AjfDateInputFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.5", type: AjfDateInputFieldComponent, selector: "ng-component", viewQueries: [{ propertyName: "input", first: true, predicate: MatInput, descendants: true }], usesInheritance: true, ngImport: i0, template: "<mat-form-field *ngIf=\"control|async as ctrl\">\n  <input matInput type=\"date\"\n      [attr.aria-label]=\"instance!|ajfNodeCompleteName\"\n      [min]=\"instance!.node.minDate|ajfDateValueString\"\n      [max]=\"instance!.node.maxDate|ajfDateValueString\"\n      (change)=\"onChange()\"\n      [formControl]=\"ctrl!\">\n</mat-form-field>\n", styles: [""], components: [{ type: i2$3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4$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"] }, { type: i4.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], pipes: { "async": i3.AsyncPipe, "ajfNodeCompleteName": i1$1.AjfNodeCompleteNamePipe, "ajfDateValueString": i1$1.AjfDateValueStringPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfDateInputFieldComponent, decorators: [{
+AjfDateInputFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfDateInputFieldComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.AjfFormRendererService }, { token: AJF_WARNING_ALERT_SERVICE }, { token: i1.AjfDateValueStringPipe }], target: i0.ɵɵFactoryTarget.Component });
+AjfDateInputFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: AjfDateInputFieldComponent, selector: "ng-component", viewQueries: [{ propertyName: "input", first: true, predicate: MatInput, descendants: true }], usesInheritance: true, ngImport: i0, template: "<mat-form-field *ngIf=\"control|async as ctrl\">\n  <input\n    matInput\n    [matDatepicker]=\"picker\"\n    [attr.aria-label]=\"instance!|ajfNodeCompleteName\"\n    [min]=\"instance!.node.minDate|ajfDateValueString\"\n    [max]=\"instance!.node.maxDate|ajfDateValueString\"\n    (change)=\"onChange()\"\n    [formControl]=\"ctrl!\"\n  />\n  <mat-datepicker-toggle matIconSuffix [for]=\"picker\"></mat-datepicker-toggle>\n  <mat-datepicker #picker></mat-datepicker>\n</mat-form-field>\n", styles: [""], dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3$1.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i3$1.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i3$1.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i4$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: i6.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: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: i2$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.AjfDateValueStringPipe, name: "ajfDateValueString" }, { kind: "pipe", type: i1.AjfNodeCompleteNamePipe, name: "ajfNodeCompleteName" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfDateInputFieldComponent, decorators: [{
             type: Component,
-            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<mat-form-field *ngIf=\"control|async as ctrl\">\n  <input matInput type=\"date\"\n      [attr.aria-label]=\"instance!|ajfNodeCompleteName\"\n      [min]=\"instance!.node.minDate|ajfDateValueString\"\n      [max]=\"instance!.node.maxDate|ajfDateValueString\"\n      (change)=\"onChange()\"\n      [formControl]=\"ctrl!\">\n</mat-form-field>\n", styles: [""] }]
+            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<mat-form-field *ngIf=\"control|async as ctrl\">\n  <input\n    matInput\n    [matDatepicker]=\"picker\"\n    [attr.aria-label]=\"instance!|ajfNodeCompleteName\"\n    [min]=\"instance!.node.minDate|ajfDateValueString\"\n    [max]=\"instance!.node.maxDate|ajfDateValueString\"\n    (change)=\"onChange()\"\n    [formControl]=\"ctrl!\"\n  />\n  <mat-datepicker-toggle matIconSuffix [for]=\"picker\"></mat-datepicker-toggle>\n  <mat-datepicker #picker></mat-datepicker>\n</mat-form-field>\n" }]
         }], ctorParameters: function () {
-        return [{ type: i0.ChangeDetectorRef }, { type: i1$1.AjfFormRendererService }, { type: AjfWarningAlertService, decorators: [{
+        return [{ type: i0.ChangeDetectorRef }, { type: i1.AjfFormRendererService }, { type: AjfWarningAlertService, decorators: [{
                         type: Inject,
                         args: [AJF_WARNING_ALERT_SERVICE]
-                    }] }, { type: i1$1.AjfDateValueStringPipe }];
+                    }] }, { type: i1.AjfDateValueStringPipe }];
     }, propDecorators: { input: [{
                 type: ViewChild,
                 args: [MatInput, { static: false }]
@@ -268,13 +271,13 @@ class AjfEmptyFieldComponent extends AjfBaseFieldComponent {
         super(cdr, service, was);
     }
 }
-AjfEmptyFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfEmptyFieldComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.AjfFormRendererService }, { token: AJF_WARNING_ALERT_SERVICE }], target: i0.ɵɵFactoryTarget.Component });
-AjfEmptyFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.5", type: AjfEmptyFieldComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"instance\">\n  <h1 [innerHTML]=\"instance.node.label | transloco\"></h1>\n  <div [innerHTML]=\"instance.node.HTML | transloco\"></div>\n</ng-container>\n", styles: [""], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "transloco": i3$1.TranslocoPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfEmptyFieldComponent, decorators: [{
+AjfEmptyFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfEmptyFieldComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.AjfFormRendererService }, { token: AJF_WARNING_ALERT_SERVICE }], target: i0.ɵɵFactoryTarget.Component });
+AjfEmptyFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: AjfEmptyFieldComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"instance\">\n  <h1 [innerHTML]=\"instance.node.label | transloco\"></h1>\n  <div [innerHTML]=\"instance.node.HTML | transloco\"></div>\n</ng-container>\n", styles: [""], dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i3$2.TranslocoPipe, name: "transloco" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfEmptyFieldComponent, decorators: [{
             type: Component,
-            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ng-container *ngIf=\"instance\">\n  <h1 [innerHTML]=\"instance.node.label | transloco\"></h1>\n  <div [innerHTML]=\"instance.node.HTML | transloco\"></div>\n</ng-container>\n", styles: [""] }]
+            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ng-container *ngIf=\"instance\">\n  <h1 [innerHTML]=\"instance.node.label | transloco\"></h1>\n  <div [innerHTML]=\"instance.node.HTML | transloco\"></div>\n</ng-container>\n" }]
         }], ctorParameters: function () {
-        return [{ type: i0.ChangeDetectorRef }, { type: i1$1.AjfFormRendererService }, { type: AjfWarningAlertService, decorators: [{
+        return [{ type: i0.ChangeDetectorRef }, { type: i1.AjfFormRendererService }, { type: AjfWarningAlertService, decorators: [{
                         type: Inject,
                         args: [AJF_WARNING_ALERT_SERVICE]
                     }] }];
@@ -306,13 +309,13 @@ class AjfBarcodeFieldComponent extends AjfBaseFieldComponent {
         super(cdr, service, was);
     }
 }
-AjfBarcodeFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfBarcodeFieldComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.AjfFormRendererService }, { token: AJF_WARNING_ALERT_SERVICE }], target: i0.ɵɵFactoryTarget.Component });
-AjfBarcodeFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.5", type: AjfBarcodeFieldComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<ajf-barcode *ngIf=\"control|async as ctrl\" [formControl]=\"ctrl!\"></ajf-barcode>\n", styles: [""], components: [{ type: i2$4.AjfBarcodeComponent, selector: "ajf-barcode" }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], pipes: { "async": i3.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfBarcodeFieldComponent, decorators: [{
+AjfBarcodeFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfBarcodeFieldComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.AjfFormRendererService }, { token: AJF_WARNING_ALERT_SERVICE }], target: i0.ɵɵFactoryTarget.Component });
+AjfBarcodeFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: AjfBarcodeFieldComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<ajf-barcode *ngIf=\"control|async as ctrl\" [formControl]=\"ctrl!\"></ajf-barcode>\n", styles: [""], dependencies: [{ kind: "component", type: i2$3.AjfBarcodeComponent, selector: "ajf-barcode" }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: i2$1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfBarcodeFieldComponent, decorators: [{
             type: Component,
-            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ajf-barcode *ngIf=\"control|async as ctrl\" [formControl]=\"ctrl!\"></ajf-barcode>\n", styles: [""] }]
+            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ajf-barcode *ngIf=\"control|async as ctrl\" [formControl]=\"ctrl!\"></ajf-barcode>\n" }]
         }], ctorParameters: function () {
-        return [{ type: i0.ChangeDetectorRef }, { type: i1$1.AjfFormRendererService }, { type: AjfWarningAlertService, decorators: [{
+        return [{ type: i0.ChangeDetectorRef }, { type: i1.AjfFormRendererService }, { type: AjfWarningAlertService, decorators: [{
                         type: Inject,
                         args: [AJF_WARNING_ALERT_SERVICE]
                     }] }];
@@ -344,13 +347,13 @@ class AjfInputFieldComponent extends AjfInputFieldComponent$1 {
         super(cdr, service, was);
     }
 }
-AjfInputFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfInputFieldComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.AjfFormRendererService }, { token: AJF_WARNING_ALERT_SERVICE }], target: i0.ɵɵFactoryTarget.Component });
-AjfInputFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.5", type: AjfInputFieldComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<mat-form-field *ngIf=\"control|async as ctrl\">\n  <input matInput *ngIf=\"type === 'text'\" type=\"text\" [formControl]=\"ctrl!\"\n    [readonly]=\"instance!|ajfIsReadonlyInputField\" [attr.aria-labelledby]=\"instance!.node.name\">\n  <input matInput *ngIf=\"type === 'number'\" type=\"number\" [formControl]=\"ctrl!\"\n    [readonly]=\"instance!|ajfIsReadonlyInputField\" [attr.aria-labelledby]=\"instance!.node.name\">\n</mat-form-field>\n", styles: [""], components: [{ type: i2$3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4$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"] }, { type: i4.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i4.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }], pipes: { "async": i3.AsyncPipe, "ajfIsReadonlyInputField": i1$1.AjfIsReadonlyInputFieldPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfInputFieldComponent, decorators: [{
+AjfInputFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfInputFieldComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.AjfFormRendererService }, { token: AJF_WARNING_ALERT_SERVICE }], target: i0.ɵɵFactoryTarget.Component });
+AjfInputFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: AjfInputFieldComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<mat-form-field *ngIf=\"control|async as ctrl\">\n  <input matInput *ngIf=\"type === 'text'\" type=\"text\" [formControl]=\"ctrl!\"\n    [readonly]=\"instance!|ajfIsReadonlyInputField\" [attr.aria-labelledby]=\"instance!.node.name\">\n  <input matInput *ngIf=\"type === 'number'\" type=\"number\" [formControl]=\"ctrl!\"\n    [readonly]=\"instance!|ajfIsReadonlyInputField\" [attr.aria-labelledby]=\"instance!.node.name\">\n</mat-form-field>\n", styles: [""], dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$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: i6.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: i6.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: i2$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.AjfIsReadonlyInputFieldPipe, name: "ajfIsReadonlyInputField" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfInputFieldComponent, decorators: [{
             type: Component,
-            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<mat-form-field *ngIf=\"control|async as ctrl\">\n  <input matInput *ngIf=\"type === 'text'\" type=\"text\" [formControl]=\"ctrl!\"\n    [readonly]=\"instance!|ajfIsReadonlyInputField\" [attr.aria-labelledby]=\"instance!.node.name\">\n  <input matInput *ngIf=\"type === 'number'\" type=\"number\" [formControl]=\"ctrl!\"\n    [readonly]=\"instance!|ajfIsReadonlyInputField\" [attr.aria-labelledby]=\"instance!.node.name\">\n</mat-form-field>\n", styles: [""] }]
+            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<mat-form-field *ngIf=\"control|async as ctrl\">\n  <input matInput *ngIf=\"type === 'text'\" type=\"text\" [formControl]=\"ctrl!\"\n    [readonly]=\"instance!|ajfIsReadonlyInputField\" [attr.aria-labelledby]=\"instance!.node.name\">\n  <input matInput *ngIf=\"type === 'number'\" type=\"number\" [formControl]=\"ctrl!\"\n    [readonly]=\"instance!|ajfIsReadonlyInputField\" [attr.aria-labelledby]=\"instance!.node.name\">\n</mat-form-field>\n" }]
         }], ctorParameters: function () {
-        return [{ type: i0.ChangeDetectorRef }, { type: i1$1.AjfFormRendererService }, { type: AjfWarningAlertService, decorators: [{
+        return [{ type: i0.ChangeDetectorRef }, { type: i1.AjfFormRendererService }, { type: AjfWarningAlertService, decorators: [{
                         type: Inject,
                         args: [AJF_WARNING_ALERT_SERVICE]
                     }] }];
@@ -382,13 +385,13 @@ class AjfMultipleChoiceFieldComponent extends AjfFieldWithChoicesComponent {
         super(cdr, service, was, searchThreshold);
     }
 }
-AjfMultipleChoiceFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfMultipleChoiceFieldComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.AjfFormRendererService }, { token: AJF_WARNING_ALERT_SERVICE }, { token: AJF_SEARCH_ALERT_THRESHOLD, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-AjfMultipleChoiceFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.5", type: AjfMultipleChoiceFieldComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"instance\">\n  <ng-container *ngIf=\"!(instance|ajfExpandFieldWithChoices:searchThreshold); else expanded\">\n    <mat-select *ngIf=\"control|async as ctrl\" [formControl]=\"ctrl!\" [multiple]=\"true\">\n      <mat-option [value]=\"choice.value\"\n          *ngFor=\"let choice of instance!.filteredChoices\">\n        {{ choice.label | transloco }}\n      </mat-option>\n    </mat-select>\n  </ng-container>\n</ng-container>\n<ng-template #expanded>\n  <ajf-checkbox-group *ngIf=\"control|async as ctrl\" class=\"ajf-choices-container\"\n      [formControl]=\"ctrl!\">\n    <ajf-checkbox-group-item *ngFor=\"let choice of instance!.filteredChoices\"\n        [value]=\"choice.value\">\n      {{ choice.label | transloco }}\n    </ajf-checkbox-group-item>\n  </ajf-checkbox-group>\n</ng-template>\n", styles: [""], components: [{ type: i2$5.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i3$2.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { type: i4$2.CheckboxGroupItem, selector: "ajf-checkbox-group-item" }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i7.AjfCheckboxGroup, selector: "ajf-checkbox-group,[ajf-checkbox-group]", inputs: ["value", "name", "disabled"], outputs: ["change"] }], pipes: { "ajfExpandFieldWithChoices": i1$1.AjfExpandFieldWithChoicesPipe, "async": i3.AsyncPipe, "transloco": i3$1.TranslocoPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfMultipleChoiceFieldComponent, decorators: [{
+AjfMultipleChoiceFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfMultipleChoiceFieldComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.AjfFormRendererService }, { token: AJF_WARNING_ALERT_SERVICE }, { token: AJF_SEARCH_ALERT_THRESHOLD, optional: true }], target: i0.ɵɵFactoryTarget.Component });
+AjfMultipleChoiceFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: AjfMultipleChoiceFieldComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"instance\">\n  <ng-container *ngIf=\"!(instance|ajfExpandFieldWithChoices:searchThreshold); else expanded\">\n    <mat-select *ngIf=\"control|async as ctrl\" [formControl]=\"ctrl!\" [multiple]=\"true\">\n      <mat-option [value]=\"choice.value\"\n          *ngFor=\"let choice of instance!.filteredChoices\">\n        {{ choice.label | transloco }}\n      </mat-option>\n    </mat-select>\n  </ng-container>\n</ng-container>\n<ng-template #expanded>\n  <ajf-checkbox-group *ngIf=\"control|async as ctrl\" class=\"ajf-choices-container\"\n      [formControl]=\"ctrl!\">\n    <ajf-checkbox-group-item *ngFor=\"let choice of instance!.filteredChoices\"\n        [value]=\"choice.value\">\n      {{ choice.label | transloco }}\n    </ajf-checkbox-group-item>\n  </ajf-checkbox-group>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "component", type: i2$4.CheckboxGroupItem, selector: "ajf-checkbox-group-item" }, { kind: "directive", type: i3$3.AjfCheckboxGroup, selector: "ajf-checkbox-group,[ajf-checkbox-group]", inputs: ["value", "name", "disabled"], outputs: ["change"] }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5$1.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i6$1.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: i3$2.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i2$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.AjfExpandFieldWithChoicesPipe, name: "ajfExpandFieldWithChoices" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfMultipleChoiceFieldComponent, decorators: [{
             type: Component,
-            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ng-container *ngIf=\"instance\">\n  <ng-container *ngIf=\"!(instance|ajfExpandFieldWithChoices:searchThreshold); else expanded\">\n    <mat-select *ngIf=\"control|async as ctrl\" [formControl]=\"ctrl!\" [multiple]=\"true\">\n      <mat-option [value]=\"choice.value\"\n          *ngFor=\"let choice of instance!.filteredChoices\">\n        {{ choice.label | transloco }}\n      </mat-option>\n    </mat-select>\n  </ng-container>\n</ng-container>\n<ng-template #expanded>\n  <ajf-checkbox-group *ngIf=\"control|async as ctrl\" class=\"ajf-choices-container\"\n      [formControl]=\"ctrl!\">\n    <ajf-checkbox-group-item *ngFor=\"let choice of instance!.filteredChoices\"\n        [value]=\"choice.value\">\n      {{ choice.label | transloco }}\n    </ajf-checkbox-group-item>\n  </ajf-checkbox-group>\n</ng-template>\n", styles: [""] }]
+            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ng-container *ngIf=\"instance\">\n  <ng-container *ngIf=\"!(instance|ajfExpandFieldWithChoices:searchThreshold); else expanded\">\n    <mat-select *ngIf=\"control|async as ctrl\" [formControl]=\"ctrl!\" [multiple]=\"true\">\n      <mat-option [value]=\"choice.value\"\n          *ngFor=\"let choice of instance!.filteredChoices\">\n        {{ choice.label | transloco }}\n      </mat-option>\n    </mat-select>\n  </ng-container>\n</ng-container>\n<ng-template #expanded>\n  <ajf-checkbox-group *ngIf=\"control|async as ctrl\" class=\"ajf-choices-container\"\n      [formControl]=\"ctrl!\">\n    <ajf-checkbox-group-item *ngFor=\"let choice of instance!.filteredChoices\"\n        [value]=\"choice.value\">\n      {{ choice.label | transloco }}\n    </ajf-checkbox-group-item>\n  </ajf-checkbox-group>\n</ng-template>\n" }]
         }], ctorParameters: function () {
-        return [{ type: i0.ChangeDetectorRef }, { type: i1$1.AjfFormRendererService }, { type: AjfWarningAlertService, decorators: [{
+        return [{ type: i0.ChangeDetectorRef }, { type: i1.AjfFormRendererService }, { type: AjfWarningAlertService, decorators: [{
                         type: Inject,
                         args: [AJF_WARNING_ALERT_SERVICE]
                     }] }, { type: undefined, decorators: [{
@@ -425,13 +428,13 @@ class AjfRangeFieldComponent extends AjfRange {
         super(cdr, service, was);
     }
 }
-AjfRangeFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfRangeFieldComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.AjfFormRendererService }, { token: AJF_WARNING_ALERT_SERVICE }], target: i0.ɵɵFactoryTarget.Component });
-AjfRangeFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.5", type: AjfRangeFieldComponent, selector: "ajf-range", usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"control|async as ctrl\">\n  <mat-slider\n    thumbLabel\n    [formControl]=\"ctrl!\"\n    [tickInterval]=\"step\"\n    [step]=\"step\"\n    [min]=\"start\"\n    [max]=\"end\"\n    [attr.aria-label]=\"name\"\n    [attr.name]=\"name\"\n  ></mat-slider>\n  <div class=\"ajf-range-label\">\n    <label>{{ctrl.value}}</label>\n  </div>\n</ng-container>\n", styles: [".ajf-range-label{display:inline-block;padding:0 10px}\n"], components: [{ type: i2$6.MatSlider, selector: "mat-slider", inputs: ["disabled", "color", "tabIndex", "invert", "max", "min", "step", "thumbLabel", "tickInterval", "value", "displayWith", "valueText", "vertical"], outputs: ["change", "input", "valueChange"], exportAs: ["matSlider"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], pipes: { "async": i3.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfRangeFieldComponent, decorators: [{
+AjfRangeFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfRangeFieldComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.AjfFormRendererService }, { token: AJF_WARNING_ALERT_SERVICE }], target: i0.ɵɵFactoryTarget.Component });
+AjfRangeFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: AjfRangeFieldComponent, selector: "ajf-range", usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"control|async as ctrl\">\n  <mat-slider\n    discrete\n    showTickMarks\n    [step]=\"step\"\n    [min]=\"start\"\n    [max]=\"end\"\n    [attr.aria-label]=\"name\"\n    [attr.name]=\"name\"\n  ><input matSliderThumb [value]=\"ctrl.value\" [formControl]=\"ctrl\" /></mat-slider>\n  <div class=\"ajf-range-label\">\n    <label>{{ctrl.value}}</label>\n  </div>\n</ng-container>\n", styles: [".ajf-range-label{display:inline-block;padding:0 10px}\n"], dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i6.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: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i4$2.MatSlider, selector: "mat-slider", inputs: ["color", "disableRipple", "disabled", "discrete", "showTickMarks", "min", "max", "step", "displayWith"], exportAs: ["matSlider"] }, { kind: "directive", type: i4$2.MatSliderThumb, selector: "input[matSliderThumb]", inputs: ["value"], outputs: ["valueChange", "dragStart", "dragEnd"], exportAs: ["matSliderThumb"] }, { kind: "pipe", type: i2$1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfRangeFieldComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ajf-range', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ng-container *ngIf=\"control|async as ctrl\">\n  <mat-slider\n    thumbLabel\n    [formControl]=\"ctrl!\"\n    [tickInterval]=\"step\"\n    [step]=\"step\"\n    [min]=\"start\"\n    [max]=\"end\"\n    [attr.aria-label]=\"name\"\n    [attr.name]=\"name\"\n  ></mat-slider>\n  <div class=\"ajf-range-label\">\n    <label>{{ctrl.value}}</label>\n  </div>\n</ng-container>\n", styles: [".ajf-range-label{display:inline-block;padding:0 10px}\n"] }]
+            args: [{ selector: 'ajf-range', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ng-container *ngIf=\"control|async as ctrl\">\n  <mat-slider\n    discrete\n    showTickMarks\n    [step]=\"step\"\n    [min]=\"start\"\n    [max]=\"end\"\n    [attr.aria-label]=\"name\"\n    [attr.name]=\"name\"\n  ><input matSliderThumb [value]=\"ctrl.value\" [formControl]=\"ctrl\" /></mat-slider>\n  <div class=\"ajf-range-label\">\n    <label>{{ctrl.value}}</label>\n  </div>\n</ng-container>\n", styles: [".ajf-range-label{display:inline-block;padding:0 10px}\n"] }]
         }], ctorParameters: function () {
-        return [{ type: i0.ChangeDetectorRef }, { type: i1$1.AjfFormRendererService }, { type: AjfWarningAlertService, decorators: [{
+        return [{ type: i0.ChangeDetectorRef }, { type: i1.AjfFormRendererService }, { type: AjfWarningAlertService, decorators: [{
                         type: Inject,
                         args: [AJF_WARNING_ALERT_SERVICE]
                     }] }];
@@ -463,13 +466,13 @@ class AjfSingleChoiceFieldComponent extends AjfFieldWithChoicesComponent {
         super(cdr, service, was, searchThreshold);
     }
 }
-AjfSingleChoiceFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfSingleChoiceFieldComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.AjfFormRendererService }, { token: AJF_WARNING_ALERT_SERVICE }, { token: AJF_SEARCH_ALERT_THRESHOLD, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-AjfSingleChoiceFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.5", type: AjfSingleChoiceFieldComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"instance\">\n  <ng-container *ngIf=\"!(instance|ajfExpandFieldWithChoices:searchThreshold) ; else expanded\">\n    <mat-select *ngIf=\"control|async as ctrl\" [formControl]=\"ctrl!\">\n      <mat-option [value]=\"choice.value\"\n          *ngFor=\"let choice of instance!.filteredChoices\">\n        {{ choice.label | transloco }}\n      </mat-option>\n    </mat-select>\n  </ng-container>\n</ng-container>\n<ng-template #expanded>\n  <mat-radio-group *ngIf=\"control|async as ctrl\" class=\"ajf-choices-container\"\n      [attr.aria-labelledby]=\"instance!.node.name\"\n      [formControl]=\"ctrl!\">\n    <mat-radio-button [value]=\"choice.value\"\n        *ngFor=\"let choice of instance!.filteredChoices\">\n      {{ choice.label | transloco }}\n    </mat-radio-button>\n  </mat-radio-group>\n</ng-template>\n", styles: [""], components: [{ type: i2$5.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i3$2.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { type: i4$3.MatRadioButton, selector: "mat-radio-button", inputs: ["disableRipple", "tabIndex"], exportAs: ["matRadioButton"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4$3.MatRadioGroup, selector: "mat-radio-group", exportAs: ["matRadioGroup"] }], pipes: { "ajfExpandFieldWithChoices": i1$1.AjfExpandFieldWithChoicesPipe, "async": i3.AsyncPipe, "transloco": i3$1.TranslocoPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfSingleChoiceFieldComponent, decorators: [{
+AjfSingleChoiceFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfSingleChoiceFieldComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.AjfFormRendererService }, { token: AJF_WARNING_ALERT_SERVICE }, { token: AJF_SEARCH_ALERT_THRESHOLD, optional: true }], target: i0.ɵɵFactoryTarget.Component });
+AjfSingleChoiceFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: AjfSingleChoiceFieldComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"instance\">\n  <ng-container *ngIf=\"!(instance|ajfExpandFieldWithChoices:searchThreshold) ; else expanded\">\n    <mat-select *ngIf=\"control|async as ctrl\" [formControl]=\"ctrl!\">\n      <mat-option [value]=\"choice.value\"\n          *ngFor=\"let choice of instance!.filteredChoices\">\n        {{ choice.label | transloco }}\n      </mat-option>\n    </mat-select>\n  </ng-container>\n</ng-container>\n<ng-template #expanded>\n  <mat-radio-group *ngIf=\"control|async as ctrl\" class=\"ajf-choices-container\"\n      [attr.aria-labelledby]=\"instance!.node.name\"\n      [formControl]=\"ctrl!\">\n    <mat-radio-button [value]=\"choice.value\"\n        *ngFor=\"let choice of instance!.filteredChoices\">\n      {{ choice.label | transloco }}\n    </mat-radio-button>\n  </mat-radio-group>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$4.MatRadioGroup, selector: "mat-radio-group", exportAs: ["matRadioGroup"] }, { kind: "component", type: i3$4.MatRadioButton, selector: "mat-radio-button", inputs: ["disableRipple", "tabIndex"], exportAs: ["matRadioButton"] }, { kind: "component", type: i5$1.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i6$1.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: i3$2.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i2$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.AjfExpandFieldWithChoicesPipe, name: "ajfExpandFieldWithChoices" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfSingleChoiceFieldComponent, decorators: [{
             type: Component,
-            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ng-container *ngIf=\"instance\">\n  <ng-container *ngIf=\"!(instance|ajfExpandFieldWithChoices:searchThreshold) ; else expanded\">\n    <mat-select *ngIf=\"control|async as ctrl\" [formControl]=\"ctrl!\">\n      <mat-option [value]=\"choice.value\"\n          *ngFor=\"let choice of instance!.filteredChoices\">\n        {{ choice.label | transloco }}\n      </mat-option>\n    </mat-select>\n  </ng-container>\n</ng-container>\n<ng-template #expanded>\n  <mat-radio-group *ngIf=\"control|async as ctrl\" class=\"ajf-choices-container\"\n      [attr.aria-labelledby]=\"instance!.node.name\"\n      [formControl]=\"ctrl!\">\n    <mat-radio-button [value]=\"choice.value\"\n        *ngFor=\"let choice of instance!.filteredChoices\">\n      {{ choice.label | transloco }}\n    </mat-radio-button>\n  </mat-radio-group>\n</ng-template>\n", styles: [""] }]
+            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ng-container *ngIf=\"instance\">\n  <ng-container *ngIf=\"!(instance|ajfExpandFieldWithChoices:searchThreshold) ; else expanded\">\n    <mat-select *ngIf=\"control|async as ctrl\" [formControl]=\"ctrl!\">\n      <mat-option [value]=\"choice.value\"\n          *ngFor=\"let choice of instance!.filteredChoices\">\n        {{ choice.label | transloco }}\n      </mat-option>\n    </mat-select>\n  </ng-container>\n</ng-container>\n<ng-template #expanded>\n  <mat-radio-group *ngIf=\"control|async as ctrl\" class=\"ajf-choices-container\"\n      [attr.aria-labelledby]=\"instance!.node.name\"\n      [formControl]=\"ctrl!\">\n    <mat-radio-button [value]=\"choice.value\"\n        *ngFor=\"let choice of instance!.filteredChoices\">\n      {{ choice.label | transloco }}\n    </mat-radio-button>\n  </mat-radio-group>\n</ng-template>\n" }]
         }], ctorParameters: function () {
-        return [{ type: i0.ChangeDetectorRef }, { type: i1$1.AjfFormRendererService }, { type: AjfWarningAlertService, decorators: [{
+        return [{ type: i0.ChangeDetectorRef }, { type: i1.AjfFormRendererService }, { type: AjfWarningAlertService, decorators: [{
                         type: Inject,
                         args: [AJF_WARNING_ALERT_SERVICE]
                     }] }, { type: undefined, decorators: [{
@@ -506,13 +509,13 @@ class AjfTableFieldComponent extends AjfTableFieldComponent$1 {
         super(cdr, service, was);
     }
 }
-AjfTableFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfTableFieldComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.AjfFormRendererService }, { token: AJF_WARNING_ALERT_SERVICE }], target: i0.ɵɵFactoryTarget.Component });
-AjfTableFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.5", type: AjfTableFieldComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<table *ngIf=\"instance\" class=\"ajf-table-field\">\n  <ng-container *ngIf=\"instance.node as node\">\n    <ng-container *ngFor=\"let columns of instance.controls; let row = index\">\n      <tr [ngClass]=\"row | ajfTableRowClass\">\n        <td>\n          <ng-container *ngIf=\"columns.length > 0 && columns[0]\">\n            {{ columns[0] | ajfTranslateIfString | ajfFormatIfNumber: '.0-2' }}\n          </ng-container>\n        </td>\n        <ng-container *ngIf=\"columns.length > 1\">\n          <td *ngFor=\"let c of columns[1]; let column = index\">\n            <ng-container *ngIf=\"row === 0; else controlCell\">\n              {{ c | ajfTranslateIfString | ajfFormatIfNumber: '.0-2' }}\n            </ng-container>\n            <ng-template #controlCell>\n              <ng-container *ngIf=\"c|ajfGetTableCellControl as contr\">\n                <ng-container *ngIf=\"contr\">\n                  <ng-container\n                    *ngIf=\"contr!.show && (node.rows[row-1][column]|ajfIsCellEditable); else plainTextCell\"\n                  >\n                    <ng-container *ngIf=\"contr.type === 'number';else genericInput\">\n                      <input\n                        (focusout)=\"contr!.show = false\"\n                        type=\"number\"\n                        [formControl]=\"contr.control\"\n                        (keydown.tab)=\"goToNextCell($event, row, column)\"\n                        autofocus\n                      />\n                    </ng-container>\n                    <ng-template #genericInput>\n                      <input\n                        (focusout)=\"contr!.show = false\"\n                        [type]=\"contr.type\"\n                        [formControl]=\"contr.control\"\n                        (keydown.tab)=\"goToNextCell($event, row, column)\"\n                        autofocus\n                      />\n                    </ng-template>\n                  </ng-container>\n\n                  <ng-template #plainTextCell>\n                    <span class=\"ajf-table-cell\" (click)=\"goToCell(row, column)\"\n                      >{{ contr.control!.value | ajfTranslateIfString | ajfFormatIfNumber: '.0-2'\n                      }}</span\n                    >\n                  </ng-template>\n                </ng-container>\n              </ng-container>\n            </ng-template>\n          </td>\n        </ng-container>\n      </tr>\n    </ng-container>\n  </ng-container>\n</table>\n", styles: ["table.ajf-table-field{border-collapse:collapse;border-spacing:0;width:100%}table.ajf-table-field tr td{position:relative;min-width:2em;border-top:solid 1px #cccccc;border-left:solid 1px #cccccc}table.ajf-table-field tr td span,table.ajf-table-field tr td input{cursor:text;width:100%;box-sizing:border-box;outline:none;display:inline-block;font-family:inherit;font-size:inherit;line-height:inherit;text-align:center;position:relative;min-height:22px;border:none}table.ajf-table-field tr td:last-child span,table.ajf-table-field tr td:last-child input{border-right-color:#ccc}table.ajf-table-field tr:last-of-type td span,table.ajf-table-field tr:last-of-type td input{border-bottom-color:#ccc}\n"], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i4.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { type: i4.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], pipes: { "ajfTableRowClass": i1$1.AjfTableRowClass, "ajfFormatIfNumber": i4$4.FormatIfNumber, "ajfTranslateIfString": i4$4.TranslateIfString, "ajfGetTableCellControl": i1$1.AjfGetTableCellControlPipe, "ajfIsCellEditable": i1$1.AjfIsCellEditablePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfTableFieldComponent, decorators: [{
+AjfTableFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfTableFieldComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.AjfFormRendererService }, { token: AJF_WARNING_ALERT_SERVICE }], target: i0.ɵɵFactoryTarget.Component });
+AjfTableFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: AjfTableFieldComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<table *ngIf=\"instance\" class=\"ajf-table-field\">\n  <ng-container *ngIf=\"instance.node as node\">\n    <ng-container *ngFor=\"let columns of instance.controls; let row = index\">\n      <tr [ngClass]=\"row | ajfTableRowClass\">\n        <td>\n          <ng-container *ngIf=\"columns.length > 0 && columns[0]\">\n            {{ columns[0] | ajfTranslateIfString | ajfFormatIfNumber: '.0-2' }}\n          </ng-container>\n        </td>\n        <ng-container *ngIf=\"columns.length > 1\">\n          <td *ngFor=\"let c of columns[1]; let column = index\">\n            <ng-container *ngIf=\"row === 0; else controlCell\">\n              {{ c | ajfTranslateIfString | ajfFormatIfNumber: '.0-2' }}\n            </ng-container>\n            <ng-template #controlCell>\n              <ng-container *ngIf=\"c|ajfGetTableCellControl as contr\">\n                <ng-container *ngIf=\"contr\">\n                  <ng-container\n                    *ngIf=\"contr!.show && (node.rows[row-1][column]|ajfIsCellEditable); else plainTextCell\"\n                  >\n                    <ng-container *ngIf=\"contr.type === 'number';else genericInput\">\n                      <input\n                        (focusout)=\"contr!.show = false\"\n                        type=\"number\"\n                        [formControl]=\"contr.control\"\n                        (keydown.tab)=\"goToNextCell($event, row, column)\"\n                        autofocus\n                      />\n                    </ng-container>\n                    <ng-template #genericInput>\n                      <input\n                        (focusout)=\"contr!.show = false\"\n                        [type]=\"contr.type\"\n                        [formControl]=\"contr.control\"\n                        (keydown.tab)=\"goToNextCell($event, row, column)\"\n                        autofocus\n                      />\n                    </ng-template>\n                  </ng-container>\n\n                  <ng-template #plainTextCell>\n                    <span class=\"ajf-table-cell\" (click)=\"goToCell(row, column)\"\n                      >{{ contr.control!.value | ajfTranslateIfString | ajfFormatIfNumber: '.0-2'\n                      }}</span\n                    >\n                  </ng-template>\n                </ng-container>\n              </ng-container>\n            </ng-template>\n          </td>\n        </ng-container>\n      </tr>\n    </ng-container>\n  </ng-container>\n</table>\n", styles: ["table.ajf-table-field{border-collapse:collapse;border-spacing:0;width:100%}table.ajf-table-field tr td{position:relative;min-width:2em;border-top:solid 1px #cccccc;border-left:solid 1px #cccccc}table.ajf-table-field tr td span,table.ajf-table-field tr td input{cursor:text;width:100%;box-sizing:border-box;outline:none;display:inline-block;font-family:inherit;font-size:inherit;line-height:inherit;text-align:center;position:relative;min-height:22px;border:none}table.ajf-table-field tr td:last-child span,table.ajf-table-field tr td:last-child input{border-right-color:#ccc}table.ajf-table-field tr:last-of-type td span,table.ajf-table-field tr:last-of-type td input{border-bottom-color:#ccc}\n"], dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i6.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: i6.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: i4$3.FormatIfNumber, name: "ajfFormatIfNumber" }, { kind: "pipe", type: i4$3.TranslateIfString, name: "ajfTranslateIfString" }, { kind: "pipe", type: i1.AjfGetTableCellControlPipe, name: "ajfGetTableCellControl" }, { kind: "pipe", type: i1.AjfIsCellEditablePipe, name: "ajfIsCellEditable" }, { kind: "pipe", type: i1.AjfTableRowClass, name: "ajfTableRowClass" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfTableFieldComponent, decorators: [{
             type: Component,
             args: [{ changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<table *ngIf=\"instance\" class=\"ajf-table-field\">\n  <ng-container *ngIf=\"instance.node as node\">\n    <ng-container *ngFor=\"let columns of instance.controls; let row = index\">\n      <tr [ngClass]=\"row | ajfTableRowClass\">\n        <td>\n          <ng-container *ngIf=\"columns.length > 0 && columns[0]\">\n            {{ columns[0] | ajfTranslateIfString | ajfFormatIfNumber: '.0-2' }}\n          </ng-container>\n        </td>\n        <ng-container *ngIf=\"columns.length > 1\">\n          <td *ngFor=\"let c of columns[1]; let column = index\">\n            <ng-container *ngIf=\"row === 0; else controlCell\">\n              {{ c | ajfTranslateIfString | ajfFormatIfNumber: '.0-2' }}\n            </ng-container>\n            <ng-template #controlCell>\n              <ng-container *ngIf=\"c|ajfGetTableCellControl as contr\">\n                <ng-container *ngIf=\"contr\">\n                  <ng-container\n                    *ngIf=\"contr!.show && (node.rows[row-1][column]|ajfIsCellEditable); else plainTextCell\"\n                  >\n                    <ng-container *ngIf=\"contr.type === 'number';else genericInput\">\n                      <input\n                        (focusout)=\"contr!.show = false\"\n                        type=\"number\"\n                        [formControl]=\"contr.control\"\n                        (keydown.tab)=\"goToNextCell($event, row, column)\"\n                        autofocus\n                      />\n                    </ng-container>\n                    <ng-template #genericInput>\n                      <input\n                        (focusout)=\"contr!.show = false\"\n                        [type]=\"contr.type\"\n                        [formControl]=\"contr.control\"\n                        (keydown.tab)=\"goToNextCell($event, row, column)\"\n                        autofocus\n                      />\n                    </ng-template>\n                  </ng-container>\n\n                  <ng-template #plainTextCell>\n                    <span class=\"ajf-table-cell\" (click)=\"goToCell(row, column)\"\n                      >{{ contr.control!.value | ajfTranslateIfString | ajfFormatIfNumber: '.0-2'\n                      }}</span\n                    >\n                  </ng-template>\n                </ng-container>\n              </ng-container>\n            </ng-template>\n          </td>\n        </ng-container>\n      </tr>\n    </ng-container>\n  </ng-container>\n</table>\n", styles: ["table.ajf-table-field{border-collapse:collapse;border-spacing:0;width:100%}table.ajf-table-field tr td{position:relative;min-width:2em;border-top:solid 1px #cccccc;border-left:solid 1px #cccccc}table.ajf-table-field tr td span,table.ajf-table-field tr td input{cursor:text;width:100%;box-sizing:border-box;outline:none;display:inline-block;font-family:inherit;font-size:inherit;line-height:inherit;text-align:center;position:relative;min-height:22px;border:none}table.ajf-table-field tr td:last-child span,table.ajf-table-field tr td:last-child input{border-right-color:#ccc}table.ajf-table-field tr:last-of-type td span,table.ajf-table-field tr:last-of-type td input{border-bottom-color:#ccc}\n"] }]
         }], ctorParameters: function () {
-        return [{ type: i0.ChangeDetectorRef }, { type: i1$1.AjfFormRendererService }, { type: AjfWarningAlertService, decorators: [{
+        return [{ type: i0.ChangeDetectorRef }, { type: i1.AjfFormRendererService }, { type: AjfWarningAlertService, decorators: [{
                         type: Inject,
                         args: [AJF_WARNING_ALERT_SERVICE]
                     }] }];
@@ -544,13 +547,13 @@ class AjfTextFieldComponent extends AjfInputFieldComponent$1 {
         super(cdr, service, was);
     }
 }
-AjfTextFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfTextFieldComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.AjfFormRendererService }, { token: AJF_WARNING_ALERT_SERVICE }], target: i0.ɵɵFactoryTarget.Component });
-AjfTextFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.5", type: AjfTextFieldComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<mat-form-field *ngIf=\"control|async as ctrl\">\n  <textarea matInput cdkTextareaAutosize [formControl]=\"ctrl!\"></textarea>\n</mat-form-field>\n", styles: [""], components: [{ type: i2$3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4$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"] }, { type: i5.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { type: i4.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], pipes: { "async": i3.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfTextFieldComponent, decorators: [{
+AjfTextFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfTextFieldComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.AjfFormRendererService }, { token: AJF_WARNING_ALERT_SERVICE }], target: i0.ɵɵFactoryTarget.Component });
+AjfTextFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: AjfTextFieldComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<mat-form-field *ngIf=\"control|async as ctrl\">\n  <textarea matInput cdkTextareaAutosize [formControl]=\"ctrl!\"></textarea>\n</mat-form-field>\n", styles: [""], dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$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: i5$2.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "directive", type: i6.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: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: i2$1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfTextFieldComponent, decorators: [{
             type: Component,
-            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<mat-form-field *ngIf=\"control|async as ctrl\">\n  <textarea matInput cdkTextareaAutosize [formControl]=\"ctrl!\"></textarea>\n</mat-form-field>\n", styles: [""] }]
+            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<mat-form-field *ngIf=\"control|async as ctrl\">\n  <textarea matInput cdkTextareaAutosize [formControl]=\"ctrl!\"></textarea>\n</mat-form-field>\n" }]
         }], ctorParameters: function () {
-        return [{ type: i0.ChangeDetectorRef }, { type: i1$1.AjfFormRendererService }, { type: AjfWarningAlertService, decorators: [{
+        return [{ type: i0.ChangeDetectorRef }, { type: i1.AjfFormRendererService }, { type: AjfWarningAlertService, decorators: [{
                         type: Inject,
                         args: [AJF_WARNING_ALERT_SERVICE]
                     }] }];
@@ -582,13 +585,13 @@ class AjfTimeFieldComponent extends AjfBaseFieldComponent {
         super(cdr, service, was);
     }
 }
-AjfTimeFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfTimeFieldComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.AjfFormRendererService }, { token: AJF_WARNING_ALERT_SERVICE }], target: i0.ɵɵFactoryTarget.Component });
-AjfTimeFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.5", type: AjfTimeFieldComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<ajf-time *ngIf=\"control|async as ctrl\" [formControl]=\"ctrl!\"></ajf-time>\n", styles: [""], components: [{ type: i2$7.AjfTime, selector: "ajf-time" }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], pipes: { "async": i3.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfTimeFieldComponent, decorators: [{
+AjfTimeFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfTimeFieldComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.AjfFormRendererService }, { token: AJF_WARNING_ALERT_SERVICE }], target: i0.ɵɵFactoryTarget.Component });
+AjfTimeFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: AjfTimeFieldComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<ajf-time *ngIf=\"control|async as ctrl\" [formControl]=\"ctrl!\"></ajf-time>\n", styles: [""], dependencies: [{ kind: "component", type: i2$5.AjfTime, selector: "ajf-time" }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: i2$1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfTimeFieldComponent, decorators: [{
             type: Component,
-            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ajf-time *ngIf=\"control|async as ctrl\" [formControl]=\"ctrl!\"></ajf-time>\n", styles: [""] }]
+            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ajf-time *ngIf=\"control|async as ctrl\" [formControl]=\"ctrl!\"></ajf-time>\n" }]
         }], ctorParameters: function () {
-        return [{ type: i0.ChangeDetectorRef }, { type: i1$1.AjfFormRendererService }, { type: AjfWarningAlertService, decorators: [{
+        return [{ type: i0.ChangeDetectorRef }, { type: i1.AjfFormRendererService }, { type: AjfWarningAlertService, decorators: [{
                         type: Inject,
                         args: [AJF_WARNING_ALERT_SERVICE]
                     }] }];
@@ -620,16 +623,16 @@ class AjfVideoUrlFieldComponent extends AjfVideoUrlFieldComponent$1 {
         super(cdr, service, was, domSanitizer, httpClient);
     }
 }
-AjfVideoUrlFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfVideoUrlFieldComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.AjfFormRendererService }, { token: AJF_WARNING_ALERT_SERVICE }, { token: i2$8.DomSanitizer }, { token: i3$3.HttpClient }], target: i0.ɵɵFactoryTarget.Component });
-AjfVideoUrlFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.5", type: AjfVideoUrlFieldComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"control|async as ctrl\">\n  <mat-form-field class=\"ajf-video-input\">\n    <input matInput type=\"url\" [formControl]=\"ctrl!\">\n  </mat-form-field>\n  <div class=\"ajf-video-thumbnail\">\n    <ng-container *ngIf=\"validUrl|async\">\n      <a target=\"_blank\" [href]=\"ctrl.value\">\n        <img *ngIf=\"videoThumbnail|async as thumb\" [src]=\"thumb\" class=\"\" alt=\"\">\n      </a>\n    </ng-container>\n  </div>\n</ng-container>\n", styles: [".ajf-video-input{width:100%}.ajf-video-thumbnail{width:212px;height:120px;background-color:#eee;display:flex;align-items:center;justify-content:center}.ajf-video-thumbnail img{flex:1 1 auto}\n"], components: [{ type: i2$3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4$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"] }, { type: i4.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], pipes: { "async": i3.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfVideoUrlFieldComponent, decorators: [{
+AjfVideoUrlFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfVideoUrlFieldComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.AjfFormRendererService }, { token: AJF_WARNING_ALERT_SERVICE }, { token: i2$6.DomSanitizer }, { token: i3$5.HttpClient }], target: i0.ɵɵFactoryTarget.Component });
+AjfVideoUrlFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: AjfVideoUrlFieldComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"control|async as ctrl\">\n  <mat-form-field class=\"ajf-video-input\">\n    <input matInput type=\"url\" [formControl]=\"ctrl!\">\n  </mat-form-field>\n  <div class=\"ajf-video-thumbnail\">\n    <ng-container *ngIf=\"validUrl|async\">\n      <a target=\"_blank\" [href]=\"ctrl.value\">\n        <img *ngIf=\"videoThumbnail|async as thumb\" [src]=\"thumb\" class=\"\" alt=\"\">\n      </a>\n    </ng-container>\n  </div>\n</ng-container>\n", styles: [".ajf-video-input{width:100%}.ajf-video-thumbnail{width:212px;height:120px;background-color:#eee;display:flex;align-items:center;justify-content:center}.ajf-video-thumbnail img{flex:1 1 auto}\n"], dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$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: i6.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: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: i2$1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfVideoUrlFieldComponent, decorators: [{
             type: Component,
             args: [{ changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ng-container *ngIf=\"control|async as ctrl\">\n  <mat-form-field class=\"ajf-video-input\">\n    <input matInput type=\"url\" [formControl]=\"ctrl!\">\n  </mat-form-field>\n  <div class=\"ajf-video-thumbnail\">\n    <ng-container *ngIf=\"validUrl|async\">\n      <a target=\"_blank\" [href]=\"ctrl.value\">\n        <img *ngIf=\"videoThumbnail|async as thumb\" [src]=\"thumb\" class=\"\" alt=\"\">\n      </a>\n    </ng-container>\n  </div>\n</ng-container>\n", styles: [".ajf-video-input{width:100%}.ajf-video-thumbnail{width:212px;height:120px;background-color:#eee;display:flex;align-items:center;justify-content:center}.ajf-video-thumbnail img{flex:1 1 auto}\n"] }]
         }], ctorParameters: function () {
-        return [{ type: i0.ChangeDetectorRef }, { type: i1$1.AjfFormRendererService }, { type: AjfWarningAlertService, decorators: [{
+        return [{ type: i0.ChangeDetectorRef }, { type: i1.AjfFormRendererService }, { type: AjfWarningAlertService, decorators: [{
                         type: Inject,
                         args: [AJF_WARNING_ALERT_SERVICE]
-                    }] }, { type: i2$8.DomSanitizer }, { type: i3$3.HttpClient }];
+                    }] }, { type: i2$6.DomSanitizer }, { type: i3$5.HttpClient }];
     } });
 
 /**
@@ -725,9 +728,9 @@ class AjfFieldService extends AjfFieldService$1 {
         };
     }
 }
-AjfFieldService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfFieldService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-AjfFieldService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfFieldService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfFieldService, decorators: [{
+AjfFieldService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfFieldService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+AjfFieldService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfFieldService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfFieldService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }], ctorParameters: function () { return []; } });
@@ -759,11 +762,11 @@ class AjfFormField extends AjfFormField$1 {
         this.componentsMap = fieldService.componentsMap;
     }
 }
-AjfFormField.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfFormField, deps: [{ token: i0.ChangeDetectorRef }, { token: AjfFieldService }], target: i0.ɵɵFactoryTarget.Component });
-AjfFormField.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.5", type: AjfFormField, selector: "ajf-field,ajf-form-field", usesInheritance: true, ngImport: i0, template: "<div\n    *ngIf=\"instance\"\n    [ngClass]=\"'ajf-field-' + (instance|ajfNodeCompleteName)\"\n    [class.ajf-validated]=\"instance.validationResults|ajfFieldIsValid\"\n>\n  <ng-template ajf-field-host></ng-template>\n</div>\n<ng-container *ngIf=\"instance && instance.node && instance.node.attachments\">\n  <a *ngFor=\"let attachment of instance.node.attachments\"\n    [href]=\"attachment.value\" target=\"_blank\">{{attachment.label | transloco}}</a>\n</ng-container>\n<div *ngIf=\"!readonly && instance && instance.validationResults\" class=\"ajf-errors\">\n  <ng-container *ngFor=\"let res of instance.validationResults\">\n    <div class=\"error\" *ngIf=\"!res.result\">\n      {{ res.error|transloco }}\n    </div>\n  </ng-container>\n</div>\n", styles: ["ajf-field .ajf-choices-container{display:flex;flex-direction:row;flex-wrap:wrap;align-items:stretch}ajf-field .ajf-item-container{position:relative}ajf-field .ajf-errors{font-style:italic;padding:5px}ajf-field tr.ajf-row-odd{background-color:gray}table{border-collapse:collapse;border-spacing:0}table tr td{position:relative}table tr td span,table tr td input{cursor:text;position:absolute;width:100%;box-sizing:border-box;outline:none;top:0;right:0;bottom:0;left:0;display:inline-block;border-top:solid 1px #cccccc;border-right:solid 1px transparent;border-bottom:solid 1px transparent;border-left:solid 1px #cccccc;font-family:inherit;font-size:inherit;line-height:inherit;text-align:center}table tr td:last-child span,table tr td:last-child input{border-right-color:#ccc}table tr:last-of-type td span,table tr:last-of-type td input{border-bottom-color:#ccc}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1$1.AjfFieldHost, selector: "[ajf-field-host]" }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "ajfNodeCompleteName": i1$1.AjfNodeCompleteNamePipe, "ajfFieldIsValid": i1$1.AjfFieldIsValidPipe, "transloco": i3$1.TranslocoPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfFormField, decorators: [{
+AjfFormField.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfFormField, deps: [{ token: i0.ChangeDetectorRef }, { token: AjfFieldService }], target: i0.ɵɵFactoryTarget.Component });
+AjfFormField.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: AjfFormField, selector: "ajf-field,ajf-form-field", usesInheritance: true, ngImport: i0, template: "<div\n    *ngIf=\"instance\"\n    [ngClass]=\"'ajf-field-' + (instance|ajfNodeCompleteName)\"\n    [class.ajf-validated]=\"instance.validationResults|ajfFieldIsValid\"\n>\n  <ng-template ajf-field-host></ng-template>\n</div>\n<ng-container *ngIf=\"instance && instance.node && instance.node.attachments\">\n  <a *ngFor=\"let attachment of instance.node.attachments\"\n    [href]=\"attachment.value\" target=\"_blank\">{{attachment.label | transloco}}</a>\n</ng-container>\n<div *ngIf=\"!readonly && instance && instance.validationResults\" class=\"ajf-errors\">\n  <ng-container *ngFor=\"let res of instance.validationResults\">\n    <div class=\"error\" *ngIf=\"!res.result\">\n      {{ res.error|transloco }}\n    </div>\n  </ng-container>\n</div>\n", styles: ["ajf-field .ajf-choices-container{display:flex;flex-direction:row;flex-wrap:wrap;align-items:stretch}ajf-field .ajf-item-container{position:relative}ajf-field .ajf-errors{font-style:italic;padding:5px}ajf-field tr.ajf-row-odd{background-color:gray}table{border-collapse:collapse;border-spacing:0}table tr td{position:relative}table tr td span,table tr td input{cursor:text;position:absolute;width:100%;box-sizing:border-box;outline:none;inset:0;display:inline-block;border-top:solid 1px #cccccc;border-right:solid 1px transparent;border-bottom:solid 1px transparent;border-left:solid 1px #cccccc;font-family:inherit;font-size:inherit;line-height:inherit;text-align:center}table tr td:last-child span,table tr td:last-child input{border-right-color:#ccc}table tr:last-of-type td span,table tr:last-of-type td input{border-bottom-color:#ccc}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"], dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.AjfFieldHost, selector: "[ajf-field-host]" }, { kind: "pipe", type: i3$2.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i1.AjfFieldIsValidPipe, name: "ajfFieldIsValid" }, { kind: "pipe", type: i1.AjfNodeCompleteNamePipe, name: "ajfNodeCompleteName" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfFormField, decorators: [{
             type: Component,
-            args: [{ selector: 'ajf-field,ajf-form-field', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div\n    *ngIf=\"instance\"\n    [ngClass]=\"'ajf-field-' + (instance|ajfNodeCompleteName)\"\n    [class.ajf-validated]=\"instance.validationResults|ajfFieldIsValid\"\n>\n  <ng-template ajf-field-host></ng-template>\n</div>\n<ng-container *ngIf=\"instance && instance.node && instance.node.attachments\">\n  <a *ngFor=\"let attachment of instance.node.attachments\"\n    [href]=\"attachment.value\" target=\"_blank\">{{attachment.label | transloco}}</a>\n</ng-container>\n<div *ngIf=\"!readonly && instance && instance.validationResults\" class=\"ajf-errors\">\n  <ng-container *ngFor=\"let res of instance.validationResults\">\n    <div class=\"error\" *ngIf=\"!res.result\">\n      {{ res.error|transloco }}\n    </div>\n  </ng-container>\n</div>\n", styles: ["ajf-field .ajf-choices-container{display:flex;flex-direction:row;flex-wrap:wrap;align-items:stretch}ajf-field .ajf-item-container{position:relative}ajf-field .ajf-errors{font-style:italic;padding:5px}ajf-field tr.ajf-row-odd{background-color:gray}table{border-collapse:collapse;border-spacing:0}table tr td{position:relative}table tr td span,table tr td input{cursor:text;position:absolute;width:100%;box-sizing:border-box;outline:none;top:0;right:0;bottom:0;left:0;display:inline-block;border-top:solid 1px #cccccc;border-right:solid 1px transparent;border-bottom:solid 1px transparent;border-left:solid 1px #cccccc;font-family:inherit;font-size:inherit;line-height:inherit;text-align:center}table tr td:last-child span,table tr td:last-child input{border-right-color:#ccc}table tr:last-of-type td span,table tr:last-of-type td input{border-bottom-color:#ccc}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"] }]
+            args: [{ selector: 'ajf-field,ajf-form-field', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div\n    *ngIf=\"instance\"\n    [ngClass]=\"'ajf-field-' + (instance|ajfNodeCompleteName)\"\n    [class.ajf-validated]=\"instance.validationResults|ajfFieldIsValid\"\n>\n  <ng-template ajf-field-host></ng-template>\n</div>\n<ng-container *ngIf=\"instance && instance.node && instance.node.attachments\">\n  <a *ngFor=\"let attachment of instance.node.attachments\"\n    [href]=\"attachment.value\" target=\"_blank\">{{attachment.label | transloco}}</a>\n</ng-container>\n<div *ngIf=\"!readonly && instance && instance.validationResults\" class=\"ajf-errors\">\n  <ng-container *ngFor=\"let res of instance.validationResults\">\n    <div class=\"error\" *ngIf=\"!res.result\">\n      {{ res.error|transloco }}\n    </div>\n  </ng-container>\n</div>\n", styles: ["ajf-field .ajf-choices-container{display:flex;flex-direction:row;flex-wrap:wrap;align-items:stretch}ajf-field .ajf-item-container{position:relative}ajf-field .ajf-errors{font-style:italic;padding:5px}ajf-field tr.ajf-row-odd{background-color:gray}table{border-collapse:collapse;border-spacing:0}table tr td{position:relative}table tr td span,table tr td input{cursor:text;position:absolute;width:100%;box-sizing:border-box;outline:none;inset:0;display:inline-block;border-top:solid 1px #cccccc;border-right:solid 1px transparent;border-bottom:solid 1px transparent;border-left:solid 1px #cccccc;font-family:inherit;font-size:inherit;line-height:inherit;text-align:center}table tr td:last-child span,table tr td:last-child input{border-right-color:#ccc}table tr:last-of-type td span,table tr:last-of-type td input{border-bottom-color:#ccc}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: AjfFieldService }]; } });
 
 /**
@@ -793,12 +796,12 @@ class AjfFormRenderer extends AjfFormRenderer$1 {
         this.topBar = false;
     }
 }
-AjfFormRenderer.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfFormRenderer, deps: [{ token: i1$1.AjfFormRendererService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-AjfFormRenderer.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.5", type: AjfFormRenderer, selector: "ajf-form", inputs: { topBar: "topBar" }, usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"formGroup|async as fg\">\n  <form [class.ajf-form-readonly]=\"readonly\" novalidate [formGroup]=\"fg!\">\n    <div class=\"ajf-form-container\">\n      <mat-toolbar *ngIf=\"!hideTopToolbar && topBar\" class=\"ajf-btn-strip\">\n        <mat-button-toggle-group>\n          <ng-container *ngFor=\"let slideInstance of (slides|async); trackBy: trackNodeById\">\n            <mat-button-toggle\n              *ngIf=\"slideInstance.node.label && slideInstance.node.label.length > 0\"\n              class=\"ajf-topbar-button\"\n              (click)=\"scrollToSlide(slideInstance)\"\n            >\n              {{slideInstance.node.label | transloco}}\n              <mat-icon *ngIf=\"!slideInstance.valid\" class=\"ajf-warning\">warning</mat-icon>\n              <mat-icon *ngIf=\"slideInstance.valid\" class=\"ajf-success\">check</mat-icon>\n            </mat-button-toggle>\n          </ng-container>\n        </mat-button-toggle-group>\n      </mat-toolbar>\n      <mat-toolbar *ngIf=\"!hideTopToolbar\">\n        {{ title }}\n        <span class=\"ajf-spacer\"></span>\n        <!-- this content projection allow to add buttons on toolbar -->\n        <ng-content select=\"[ajfFormTopToolbarButtons]\"></ng-content>\n        <!-- apply a default save button only when ajfFormSaveButton is empty -->\n        <span *ngIf=\"!saveDisabled\" (click)=\"onSave($event)\">\n          <span #saveButton\n            ><ng-content select=\"[ajfFormSaveButton]\"></ng-content\n          ></span>\n          <button\n            *ngIf=\"saveButton && saveButton.childNodes && saveButton.childNodes.length === 0\"\n            mat-button\n            default\n          >\n            {{'Save'|transloco}}\n          </button>\n        </span>\n      </mat-toolbar>\n      <div class=\"ajf-slider-container\">\n        <ajf-page-slider\n          (orientationChange)=\"orientationChangeHandler($event)\"\n          [fixedOrientation]=\"fixedOrientation\"\n          [hideNavigationButtons]=\"hideNavigationButtons\"\n          [orientation]=\"orientation\"\n          #formSlider\n        >\n          <ng-container *ngIf=\"(slides|async) as curSlides\">\n            <ng-container *ngIf=\"curSlides!.length > 0 && hasStartMessage\">\n              <ajf-page-slider-item>\n                <div class=\"ajf-form-page\">\n                  <mat-card>\n                    <mat-card-header>\n                      <div class=\"ajf-page-slider-item-header\">\n                        <h2>\n                          <span class=\"ajf-form-header-number\"> 1 &rarr; </span>\n                          <span class=\"ajf-title\">\n                            <ng-content\n                              select=\"[ajfFormStartMessageTitle]\"\n                            ></ng-content>\n                          </span>\n                        </h2>\n                      </div>\n                    </mat-card-header>\n                    <mat-card-content>\n                      <ng-content select=\"[ajfFormStartMessage]\"></ng-content>\n                    </mat-card-content>\n                  </mat-card>\n                </div>\n              </ajf-page-slider-item>\n            </ng-container>\n            <ng-container\n              *ngFor=\"let slideInstance of curSlides; trackBy:trackNodeById\"\n            >\n              <!-- non repeating slides -->\n              <ng-container *ngIf=\"slideInstance.visible\">\n                <ng-container\n                  *ngIf=\"!(slideInstance|ajfIsRepeatingSlideInstance)\"\n                >\n                  <ajf-page-slider-item>\n                    <div class=\"ajf-form-page\">\n                      <mat-card>\n                        <mat-card-header>\n                          <div class=\"ajf-page-slider-item-header\">\n                            <h2>\n                              <span class=\"ajf-form-header-number\"\n                                >{{ slideInstance.position + (hasStartMessage |\n                                ajfBoolToInt) }} &rarr;</span\n                              >\n                              <span\n                                [innerHTML]=\"slideInstance.node.label | transloco\"\n                              ></span>\n                            </h2>\n                            <mat-icon\n                              class=\"ajf-warning\"\n                              *ngIf=\"!slideInstance.valid\"\n                              >warning</mat-icon\n                            >\n                            <mat-icon\n                              class=\"ajf-success\"\n                              *ngIf=\"slideInstance.valid\"\n                              >check</mat-icon\n                            >\n                          </div>\n                        </mat-card-header>\n                        <mat-card-content>\n                          <ng-template\n                            ngFor\n                            let-fieldInstance\n                            [ngForOf]=\"slideInstance.flatNodes\"\n                            [ngForTrackBy]=\"trackNodeById\"\n                          >\n                            <div\n                              [ngClass]=\"'ajf-' + (fieldInstance|ajfAsFieldInstance).node.size\"\n                              class=\"ajf-field-entry\"\n                              *ngIf=\"fieldInstance.visible\"\n                            >\n                              <i\n                                [class]=\"(fieldInstance|ajfAsFieldInstance).node.fieldType | ajfFieldIcon\"\n                                item-right\n                              ></i>\n                              <p>\n                                {{\n                                ((fieldInstance|ajfAsFieldInstance).node.description\n                                || '') | transloco }}\n                              </p>\n                              <label\n                                [attr.id]=\"fieldInstance.node.name\"\n                                *ngIf=\"(fieldInstance|ajfAsFieldInstance).node.fieldType !== 7\"\n                                [innerHTML]=\"fieldInstance.node.label | transloco\"\n                              ></label>\n                              <mat-icon\n                                class=\"ajf-tooltip-icon\"\n                                *ngIf=\"(fieldInstance|ajfAsFieldInstance).node?.hint as hint\"\n                                [matTooltip]=\"hint\"\n                                matTooltipPosition=\"right\"\n                              >\n                                {{(fieldInstance|ajfAsFieldInstance).node?.hintIcon\n                                || 'help'}}</mat-icon\n                              >\n                              <ajf-field\n                                [instance]=\"fieldInstance|ajfAsFieldInstance\"\n                                [readonly]=\"readonly || !slideInstance.editable\"\n                              >\n                              </ajf-field>\n                            </div>\n                          </ng-template>\n                        </mat-card-content>\n                      </mat-card>\n                    </div>\n                  </ajf-page-slider-item>\n                </ng-container>\n                <!-- repeating slides -->\n                <ng-container\n                  *ngIf=\"(slideInstance|ajfIsRepeatingSlideInstance)\"\n                >\n                  <ajf-page-slider-item\n                    *ngFor=\"let curRep of ((slideInstance|ajfAsRepeatingSlideInstance).reps|ajfRange); let idx = index; let lastSlide = last\"\n                  >\n                    <div class=\"ajf-form-page\">\n                      <mat-card>\n                        <mat-card-header>\n                          <div class=\"ajf-page-slider-item-header\">\n                            <h2>\n                              <span class=\"ajf-form-header-number\"\n                                >{{ slideInstance.position|ajfIncrement:idx +\n                                (hasStartMessage | ajfBoolToInt) }} &rarr;</span\n                              >\n                              <span\n                                [innerHTML]=\"slideInstance.node.label | transloco\"\n                              ></span>\n                            </h2>\n                            <mat-icon\n                              class=\"ajf-warning\"\n                              *ngIf=\"!(slideInstance|ajfValidSlide:idx)\"\n                              >warning</mat-icon\n                            >\n                            <mat-icon\n                              class=\"ajf-success\"\n                              *ngIf=\"(slideInstance|ajfValidSlide:idx)\"\n                              >check</mat-icon\n                            >\n                          </div>\n                        </mat-card-header>\n                        <mat-card-content>\n                          <div\n                            *ngIf=\"lastSlide && !readonly\"\n                            class=\"ajf-group-actions\"\n                          >\n                            <button\n                              (click)=\"addGroup(slideInstance)\"\n                              [disabled]=\"!(slideInstance|ajfAsRepeatingSlideInstance).canAdd || ((slideInstance|ajfAsRepeatingSlideInstance).node?.disableRemoval && !slideInstance.valid)\"\n                              mat-mini-fab\n                            >\n                              <mat-icon>add</mat-icon>\n                            </button>\n                            <button\n                              (click)=\"removeGroup(slideInstance)\"\n                              [disabled]=\"!(slideInstance|ajfAsRepeatingSlideInstance).canRemove || (slideInstance|ajfAsRepeatingSlideInstance).node?.disableRemoval\"\n                              mat-mini-fab\n                            >\n                              <mat-icon>remove</mat-icon>\n                            </button>\n                          </div>\n                          <ng-template\n                            ngFor\n                            let-fieldInstance\n                            [ngForOf]=\"slideInstance.slideNodes[idx]\"\n                            [ngForTrackBy]=\"trackNodeById\"\n                          >\n                            <div\n                              [ngClass]=\"'ajf-' + (fieldInstance|ajfAsFieldInstance).node.size\"\n                              class=\"ajf-field-entry\"\n                              *ngIf=\"fieldInstance.visible\"\n                            >\n                              <i\n                                [class]=\"(fieldInstance|ajfAsFieldInstance).node.fieldType | ajfFieldIcon\"\n                                item-right\n                              ></i>\n                              <p>\n                                {{\n                                ((fieldInstance|ajfAsFieldInstance).node.description\n                                || '') | transloco }}\n                              </p>\n                              <label\n                                [attr.id]=\"fieldInstance.node.name\"\n                                [innerHTML]=\"fieldInstance.node.label | transloco\"\n                              ></label>\n                              <mat-icon\n                                class=\"ajf-tooltip-icon\"\n                                *ngIf=\"(fieldInstance|ajfAsFieldInstance).node?.hint as hint\"\n                                [matTooltip]=\"hint\"\n                                matTooltipPosition=\"right\"\n                              >\n                                {{(fieldInstance|ajfAsFieldInstance).node?.hintIcon\n                                || 'help'}}</mat-icon\n                              >\n                              <ajf-field\n                                [instance]=\"fieldInstance|ajfAsFieldInstance\"\n                                [readonly]=\"readonly || (!lastSlide && (slideInstance|ajfAsRepeatingSlideInstance).node?.disableRemoval)\"\n                              >\n                              </ajf-field>\n                            </div>\n                          </ng-template>\n                        </mat-card-content>\n                      </mat-card>\n                    </div>\n                  </ajf-page-slider-item>\n                </ng-container>\n              </ng-container>\n            </ng-container>\n            <ng-container\n              *ngIf=\"curSlides && curSlides!.length > 0 && hasEndMessage\"\n            >\n              <ajf-page-slider-item>\n                <div class=\"ajf-form-page\">\n                  <mat-card>\n                    <mat-card-header>\n                      <div class=\"ajf-page-slider-item-header\">\n                        <h2>\n                          <span\n                            *ngIf=\"(slidesNum|async) as snum\"\n                            class=\"ajf-form-header-number\"\n                          >\n                            {{ snum! + (hasStartMessage | ajfBoolToInt ) + 1 }}\n                            &rarr;\n                          </span>\n                          <span class=\"ajf-title\">\n                            <ng-content\n                              select=\"[ajfFormEndMessageTitle]\"\n                            ></ng-content>\n                          </span>\n                        </h2>\n                      </div>\n                    </mat-card-header>\n                    <mat-card-content>\n                      <ng-content select=\"[ajfFormEndMessage]\"></ng-content>\n                    </mat-card-content>\n                  </mat-card>\n                </div>\n              </ajf-page-slider-item>\n            </ng-container>\n          </ng-container>\n          <div ajfPageSliderBar *ngIf=\"!hideBottomToolbar\">\n            <div class=\"ajf-left-bar\">\n              <div class=\"ajf-errors\" *ngIf=\"((errors | async) || 0) > 0\">\n                <button mat-button (click)=\"goToPrevError()\" danger>\n                  <mat-icon>arrow_upward</mat-icon>\n                </button>\n                <button mat-button (click)=\"goToNextError()\" danger>\n                  <mat-icon>arrow_downward</mat-icon>\n                </button>\n              </div>\n              <div class=\"ajf-info-box ajf-error\">\n                <div class=\"ajf-title\">{{'Errors'|transloco}}</div>\n                <div class=\"ajf-content\">\n                  {{ errors | async }} / {{ slidesNum|async }}\n                </div>\n              </div>\n            </div>\n          </div>\n        </ajf-page-slider>\n      </div>\n    </div>\n  </form>\n</ng-container>\n", styles: ["ajf-form{display:block}ajf-form .ajf-form-readonly .ajf-field-entry>label{font-weight:700}ajf-form .ajf-form-container{display:flex;flex-direction:column;position:absolute;top:0;right:0;bottom:0;left:0}ajf-form .ajf-form-container mat-toolbar.ajf-hidden{opacity:0}ajf-form .ajf-form-container .ajf-btn-strip .mat-button-toggle-group{overflow-x:auto}ajf-form .ajf-form-container .ajf-topbar-button{font-size:.8em}ajf-form .ajf-form-container mat-icon.ajf-warning{color:#f53d3d}ajf-form .ajf-form-container mat-icon.ajf-success{color:#32db64}ajf-form .ajf-form-container>.ajf-slider-container{flex:1;position:relative}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider{height:100%}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content{padding:16px}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page{flex:1;max-height:100%}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card{margin:1em 0 3em}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card>mat-card-content{display:flex;flex-wrap:wrap;flex-direction:row;align-content:flex-start;position:relative}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card>mat-card-content .ajf-group-actions{position:absolute;right:0;top:-30px;padding:15px;z-index:10}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card>mat-card-content>.ajf-field-entry{flex:1 0 auto;padding-left:10px;padding-right:10px;width:100%}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card>mat-card-content>.ajf-field-entry .mat-icon{vertical-align:bottom;margin-left:5px}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card>mat-card-content>.ajf-field-entry.ajf-normal{width:100%}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card>mat-card-content>.ajf-field-entry.ajf-small{width:50%}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card>mat-card-content>.ajf-field-entry.ajf-smaller{width:33%}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card>mat-card-content>.ajf-field-entry.ajf-tiny{width:25%}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card>mat-card-content>.ajf-field-entry.ajf-mini{width:20%}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider .ajf-page-slider-item-header{display:flex;align-items:center;width:100%}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider .ajf-page-slider-item-header>h2{flex:1}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider .ajf-page-slider-item-header>h2>.ajf-form-header-number{margin-right:.5em}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider .ajf-page-slider-item-header h2>.ajf-title{display:inline-block;margin-right:40px;white-space:normal;vertical-align:top}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider [ajfPageSliderBar] .ajf-left-bar{display:flex;align-items:flex-start;flex-direction:row;position:absolute;bottom:0}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider [ajfPageSliderBar] .ajf-left-bar .ajf-right-button{float:right}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider [ajfPageSliderBar] .ajf-left-bar .ajf-button-icon-only ion-icon{padding:0 .1em}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider [ajfPageSliderBar] .ajf-left-bar .ajf-info-box{height:40px;padding:4px}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider [ajfPageSliderBar] .ajf-left-bar .ajf-info-box>div{height:16px;line-height:16px}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider [ajfPageSliderBar] .ajf-left-bar .ajf-info-box>div.ajf-content{font-weight:700}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider [ajfPageSliderBar] .ajf-left-bar .ajf-info-box.ajf-error{order:2;color:red}ajf-form .ajf-form-container .ajf-spacer{flex:1 0 auto}\n"], components: [{ type: i2$9.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { type: i3$4.MatButtonToggle, selector: "mat-button-toggle", inputs: ["disableRipple", "aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "appearance", "checked", "disabled"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { type: i4$5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { 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: i6.AjfPageSlider, selector: "ajf-page-slider" }, { type: i7$1.AjfPageSliderItem, selector: "ajf-page-slider-item", outputs: ["scroll"] }, { type: i8.MatCard, selector: "mat-card", exportAs: ["matCard"] }, { type: i8.MatCardHeader, selector: "mat-card-header" }, { type: AjfFormField, selector: "ajf-field,ajf-form-field" }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i3$4.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i8.MatCardContent, selector: "mat-card-content, [mat-card-content], [matCardContent]" }, { type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i12.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }], pipes: { "async": i3.AsyncPipe, "transloco": i3$1.TranslocoPipe, "ajfIsRepeatingSlideInstance": i1$1.AjfIsRepeatingSlideInstancePipe, "ajfBoolToInt": i1$1.AjfBoolToIntPipe, "ajfAsFieldInstance": i1$1.AjfAsFieldInstancePipe, "ajfFieldIcon": i1$1.AjfFieldIconPipe, "ajfRange": i1$1.AjfRangePipe, "ajfAsRepeatingSlideInstance": i1$1.AjfAsRepeatingSlideInstancePipe, "ajfIncrement": i1$1.AjfIncrementPipe, "ajfValidSlide": i1$1.AjfValidSlidePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfFormRenderer, decorators: [{
+AjfFormRenderer.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfFormRenderer, deps: [{ token: i1.AjfFormRendererService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+AjfFormRenderer.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: AjfFormRenderer, selector: "ajf-form", inputs: { topBar: "topBar" }, usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"formGroup|async as fg\">\n  <form [class.ajf-form-readonly]=\"readonly\" novalidate [formGroup]=\"fg!\">\n    <div class=\"ajf-form-container\">\n      <mat-toolbar *ngIf=\"!hideTopToolbar && topBar\" class=\"ajf-btn-strip\">\n        <mat-button-toggle-group>\n          <ng-container\n            *ngFor=\"let slideInstance of (slides|async); let idx = index; trackBy: trackNodeById\"\n          >\n            <mat-button-toggle\n              *ngIf=\"slideInstance.node.label && slideInstance.node.label.length > 0\"\n              class=\"ajf-topbar-button\"\n              (click)=\"scrollToSlide(slideInstance)\"\n              [checked]=\"isSlideToggleChecked(slideInstance, formSlider.currentPage)\"\n              [disabled]=\"slideInstance.visible === false\"\n            >\n              {{slideInstance.node.label | transloco}} {{ getRepeatingSlideRepIndex(slideInstance,\n              formSlider.currentPage)|async}}\n              <mat-icon *ngIf=\"!slideInstance.valid\" class=\"ajf-warning\">warning</mat-icon>\n              <mat-icon *ngIf=\"slideInstance.valid\" class=\"ajf-success\">check</mat-icon>\n            </mat-button-toggle>\n          </ng-container>\n        </mat-button-toggle-group>\n      </mat-toolbar>\n      <mat-toolbar *ngIf=\"!hideTopToolbar\">\n        {{ title }}\n        <span class=\"ajf-spacer\"></span>\n        <!-- this content projection allow to add buttons on toolbar -->\n        <ng-content select=\"[ajfFormTopToolbarButtons]\"></ng-content>\n        <!-- apply a default save button only when ajfFormSaveButton is empty -->\n        <span *ngIf=\"!saveDisabled\" (click)=\"onSave($event)\">\n          <span #saveButton><ng-content select=\"[ajfFormSaveButton]\"></ng-content></span>\n          <button\n            *ngIf=\"saveButton && saveButton.childNodes && saveButton.childNodes.length === 0\"\n            mat-button\n            default\n          >\n            {{'Save'|transloco}}\n          </button>\n        </span>\n      </mat-toolbar>\n      <div class=\"ajf-slider-container\">\n        <ajf-page-slider\n          (orientationChange)=\"orientationChangeHandler($event)\"\n          [fixedOrientation]=\"fixedOrientation\"\n          [hideNavigationButtons]=\"hideNavigationButtons\"\n          [orientation]=\"orientation\"\n          #formSlider\n        >\n          <ng-container *ngIf=\"(slides|async) as curSlides\">\n            <ng-container *ngIf=\"curSlides!.length > 0 && hasStartMessage\">\n              <ajf-page-slider-item>\n                <div class=\"ajf-form-page\">\n                  <mat-card appearance=\"outlined\">\n                    <mat-card-header>\n                      <div class=\"ajf-page-slider-item-header\">\n                        <h2>\n                          <span class=\"ajf-form-header-number\"> 1 &rarr; </span>\n                          <span class=\"ajf-title\">\n                            <ng-content select=\"[ajfFormStartMessageTitle]\"></ng-content>\n                          </span>\n                        </h2>\n                      </div>\n                    </mat-card-header>\n                    <mat-card-content>\n                      <ng-content select=\"[ajfFormStartMessage]\"></ng-content>\n                    </mat-card-content>\n                  </mat-card>\n                </div>\n              </ajf-page-slider-item>\n            </ng-container>\n            <ng-container *ngFor=\"let slideInstance of curSlides; trackBy:trackNodeById\">\n              <!-- non repeating slides -->\n              <ng-container *ngIf=\"slideInstance.visible\">\n                <ng-container *ngIf=\"!(slideInstance|ajfIsRepeatingSlideInstance)\">\n                  <ajf-page-slider-item>\n                    <div class=\"ajf-form-page\">\n                      <mat-card appearance=\"outlined\">\n                        <mat-card-header>\n                          <div class=\"ajf-page-slider-item-header\">\n                            <h2>\n                              <span class=\"ajf-form-header-number\"\n                                >{{ slideInstance.position + (hasStartMessage | ajfBoolToInt) }}\n                                &rarr;</span\n                              >\n                              <span [innerHTML]=\"slideInstance.node.label | transloco\"></span>\n                            </h2>\n                            <mat-icon class=\"ajf-warning\" *ngIf=\"!slideInstance.valid\"\n                              >warning</mat-icon\n                            >\n                            <mat-icon class=\"ajf-success\" *ngIf=\"slideInstance.valid\"\n                              >check</mat-icon\n                            >\n                          </div>\n                        </mat-card-header>\n                        <mat-card-content>\n                          <ng-template\n                            ngFor\n                            let-fieldInstance\n                            [ngForOf]=\"slideInstance.flatNodes\"\n                            [ngForTrackBy]=\"trackNodeById\"\n                          >\n                            <div\n                              [ngClass]=\"'ajf-' + (fieldInstance|ajfAsFieldInstance).node.size\"\n                              class=\"ajf-field-entry\"\n                              *ngIf=\"fieldInstance.visible\"\n                            >\n                              <i\n                                [class]=\"(fieldInstance|ajfAsFieldInstance).node.fieldType | ajfFieldIcon\"\n                                item-right\n                              ></i>\n                              <p>\n                                {{ ((fieldInstance|ajfAsFieldInstance).node.description || '') |\n                                transloco }}\n                              </p>\n                              <label\n                                [attr.id]=\"fieldInstance.node.name\"\n                                *ngIf=\"(fieldInstance|ajfAsFieldInstance).node.fieldType !== 7\"\n                                [innerHTML]=\"fieldInstance.node.label | transloco\"\n                              ></label>\n                              <mat-icon\n                                class=\"ajf-tooltip-icon\"\n                                *ngIf=\"(fieldInstance|ajfAsFieldInstance).node?.hint as hint\"\n                                [matTooltip]=\"hint\"\n                                matTooltipPosition=\"right\"\n                              >\n                                {{(fieldInstance|ajfAsFieldInstance).node.hintIcon ||\n                                'help'}}</mat-icon\n                              >\n                              <ajf-field\n                                [instance]=\"fieldInstance|ajfAsFieldInstance\"\n                                [readonly]=\"readonly || !slideInstance.editable\"\n                              >\n                              </ajf-field>\n                            </div>\n                          </ng-template>\n                        </mat-card-content>\n                      </mat-card>\n                    </div>\n                  </ajf-page-slider-item>\n                </ng-container>\n                <!-- repeating slides -->\n                <ng-container *ngIf=\"(slideInstance|ajfIsRepeatingSlideInstance)\">\n                  <ajf-page-slider-item\n                    *ngFor=\"let curRep of ((slideInstance|ajfAsRepeatingSlideInstance).reps|ajfRange); let idx = index; let lastSlide = last\"\n                  >\n                    <div class=\"ajf-form-page\">\n                      <mat-card appearance=\"outlined\">\n                        <mat-card-header>\n                          <div class=\"ajf-page-slider-item-header\">\n                            <h2>\n                              <span class=\"ajf-form-header-number\"\n                                >{{ slideInstance.position|ajfIncrement:idx + (hasStartMessage |\n                                ajfBoolToInt) }} &rarr;</span\n                              >\n                              <span [innerHTML]=\"slideInstance.node.label | transloco\"></span>\n                            </h2>\n                            <mat-icon class=\"ajf-warning\" *ngIf=\"!(slideInstance|ajfValidSlide:idx)\"\n                              >warning</mat-icon\n                            >\n                            <mat-icon class=\"ajf-success\" *ngIf=\"(slideInstance|ajfValidSlide:idx)\"\n                              >check</mat-icon\n                            >\n                          </div>\n                        </mat-card-header>\n                        <mat-card-content>\n                          <div *ngIf=\"lastSlide && !readonly\" class=\"ajf-group-actions\">\n                            <button\n                              (click)=\"addGroup(slideInstance)\"\n                              [disabled]=\"!(slideInstance|ajfAsRepeatingSlideInstance).canAdd || ((slideInstance|ajfAsRepeatingSlideInstance).node.disableRemoval && !slideInstance.valid)\"\n                              mat-mini-fab\n                            >\n                              <mat-icon>add</mat-icon>\n                            </button>\n                            <button\n                              (click)=\"removeGroup(slideInstance)\"\n                              [disabled]=\"!(slideInstance|ajfAsRepeatingSlideInstance).canRemove || (slideInstance|ajfAsRepeatingSlideInstance).node.disableRemoval\"\n                              mat-mini-fab\n                            >\n                              <mat-icon>remove</mat-icon>\n                            </button>\n                          </div>\n                          <ng-template\n                            ngFor\n                            let-fieldInstance\n                            [ngForOf]=\"slideInstance.slideNodes[idx]\"\n                            [ngForTrackBy]=\"trackNodeById\"\n                          >\n                            <div\n                              [ngClass]=\"'ajf-' + (fieldInstance|ajfAsFieldInstance).node.size\"\n                              class=\"ajf-field-entry\"\n                              *ngIf=\"fieldInstance.visible\"\n                            >\n                              <i\n                                [class]=\"(fieldInstance|ajfAsFieldInstance).node.fieldType | ajfFieldIcon\"\n                                item-right\n                              ></i>\n                              <p>\n                                {{ ((fieldInstance|ajfAsFieldInstance).node.description || '') |\n                                transloco }}\n                              </p>\n                              <label\n                                [attr.id]=\"fieldInstance.node.name\"\n                                [innerHTML]=\"fieldInstance.node.label | transloco\"\n                              ></label>\n                              <mat-icon\n                                class=\"ajf-tooltip-icon\"\n                                *ngIf=\"(fieldInstance|ajfAsFieldInstance).node?.hint as hint\"\n                                [matTooltip]=\"hint\"\n                                matTooltipPosition=\"right\"\n                              >\n                                {{(fieldInstance|ajfAsFieldInstance).node.hintIcon ||\n                                'help'}}</mat-icon\n                              >\n                              <ajf-field\n                                [instance]=\"fieldInstance|ajfAsFieldInstance\"\n                                [readonly]=\"readonly || (!lastSlide && (slideInstance|ajfAsRepeatingSlideInstance).node.disableRemoval)\"\n                              >\n                              </ajf-field>\n                            </div>\n                          </ng-template>\n                        </mat-card-content>\n                      </mat-card>\n                    </div>\n                  </ajf-page-slider-item>\n                </ng-container>\n              </ng-container>\n            </ng-container>\n            <ng-container *ngIf=\"curSlides && curSlides!.length > 0 && hasEndMessage\">\n              <ajf-page-slider-item>\n                <div class=\"ajf-form-page\">\n                  <mat-card appearance=\"outlined\">\n                    <mat-card-header>\n                      <div class=\"ajf-page-slider-item-header\">\n                        <h2>\n                          <span *ngIf=\"(slidesNum|async) as snum\" class=\"ajf-form-header-number\">\n                            {{ snum! + (hasStartMessage | ajfBoolToInt ) + 1 }} &rarr;\n                          </span>\n                          <span class=\"ajf-title\">\n                            <ng-content select=\"[ajfFormEndMessageTitle]\"></ng-content>\n                          </span>\n                        </h2>\n                      </div>\n                    </mat-card-header>\n                    <mat-card-content>\n                      <ng-content select=\"[ajfFormEndMessage]\"></ng-content>\n                    </mat-card-content>\n                  </mat-card>\n                </div>\n              </ajf-page-slider-item>\n            </ng-container>\n          </ng-container>\n          <div ajfPageSliderBar *ngIf=\"!hideBottomToolbar\">\n            <div class=\"ajf-left-bar\">\n              <div class=\"ajf-errors\" *ngIf=\"((errors | async) || 0) > 0\">\n                <button mat-button (click)=\"goToPrevError()\" danger>\n                  <mat-icon>arrow_upward</mat-icon>\n                </button>\n                <button mat-button (click)=\"goToNextError()\" danger>\n                  <mat-icon>arrow_downward</mat-icon>\n                </button>\n              </div>\n              <div class=\"ajf-info-box ajf-error\">\n                <div class=\"ajf-title\">{{'Errors'|transloco}}</div>\n                <div class=\"ajf-content\">{{ errors | async }} / {{ slidesNum|async }}</div>\n              </div>\n            </div>\n          </div>\n        </ajf-page-slider>\n      </div>\n    </div>\n  </form>\n</ng-container>\n", styles: ["ajf-form{display:block}ajf-form .ajf-form-readonly .ajf-field-entry>label{font-weight:700}ajf-form .ajf-form-container{display:flex;flex-direction:column;position:absolute;inset:0}ajf-form .ajf-form-container mat-toolbar.ajf-hidden{opacity:0}ajf-form .ajf-form-container .ajf-btn-strip .mat-button-toggle-group{overflow-x:auto}ajf-form .ajf-form-container .ajf-topbar-button{font-size:.8em}ajf-form .ajf-form-container mat-icon.ajf-warning{color:#f53d3d}ajf-form .ajf-form-container mat-icon.ajf-success{color:#32db64}ajf-form .ajf-form-container>.ajf-slider-container{flex:1;position:relative}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider{height:100%}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content{padding:16px}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page{flex:1;max-height:100%}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card{margin:1em 0 3em}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card>mat-card-content{display:flex;flex-wrap:wrap;flex-direction:row;align-content:flex-start;position:relative}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card>mat-card-content .ajf-group-actions{position:absolute;right:0;top:-30px;padding:15px;z-index:10}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card>mat-card-content>.ajf-field-entry{flex:1 0 auto;padding-left:10px;padding-right:10px;width:100%}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card>mat-card-content>.ajf-field-entry .mat-icon{vertical-align:bottom;margin-left:5px}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card>mat-card-content>.ajf-field-entry.ajf-normal{width:100%}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card>mat-card-content>.ajf-field-entry.ajf-small{width:50%}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card>mat-card-content>.ajf-field-entry.ajf-smaller{width:33%}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card>mat-card-content>.ajf-field-entry.ajf-tiny{width:25%}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card>mat-card-content>.ajf-field-entry.ajf-mini{width:20%}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider .ajf-page-slider-item-header{display:flex;align-items:center;width:100%}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider .ajf-page-slider-item-header>h2{flex:1}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider .ajf-page-slider-item-header>h2>.ajf-form-header-number{margin-right:.5em}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider .ajf-page-slider-item-header h2>.ajf-title{display:inline-block;margin-right:40px;white-space:normal;vertical-align:top}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider [ajfPageSliderBar] .ajf-left-bar{display:flex;align-items:flex-start;flex-direction:row;position:absolute;bottom:0}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider [ajfPageSliderBar] .ajf-left-bar .ajf-right-button{float:right}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider [ajfPageSliderBar] .ajf-left-bar .ajf-button-icon-only ion-icon{padding:0 .1em}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider [ajfPageSliderBar] .ajf-left-bar .ajf-info-box{height:40px;padding:4px}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider [ajfPageSliderBar] .ajf-left-bar .ajf-info-box>div{height:16px;line-height:16px}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider [ajfPageSliderBar] .ajf-left-bar .ajf-info-box>div.ajf-content{font-weight:700}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider [ajfPageSliderBar] .ajf-left-bar .ajf-info-box.ajf-error{order:2;color:red}ajf-form .ajf-form-container .ajf-spacer{flex:1 0 auto}\n"], dependencies: [{ kind: "component", type: i2$7.AjfPageSliderItem, selector: "ajf-page-slider-item", outputs: ["scroll"] }, { kind: "component", type: i3$6.AjfPageSlider, selector: "ajf-page-slider" }, { kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5.MatMiniFabButton, selector: "button[mat-mini-fab]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i6$2.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i6$2.MatButtonToggle, selector: "mat-button-toggle", inputs: ["disableRipple", "aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "appearance", "checked", "disabled"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "component", type: i7.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i7.MatCardContent, selector: "mat-card-content" }, { kind: "component", type: i7.MatCardHeader, selector: "mat-card-header" }, { kind: "component", type: i8.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i9.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "directive", type: i10.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "directive", type: i6.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i6.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i6.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: AjfFormField, selector: "ajf-field,ajf-form-field" }, { kind: "pipe", type: i3$2.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i2$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.AjfAsFieldInstancePipe, name: "ajfAsFieldInstance" }, { kind: "pipe", type: i1.AjfAsRepeatingSlideInstancePipe, name: "ajfAsRepeatingSlideInstance" }, { kind: "pipe", type: i1.AjfBoolToIntPipe, name: "ajfBoolToInt" }, { kind: "pipe", type: i1.AjfFieldIconPipe, name: "ajfFieldIcon" }, { kind: "pipe", type: i1.AjfIncrementPipe, name: "ajfIncrement" }, { kind: "pipe", type: i1.AjfIsRepeatingSlideInstancePipe, name: "ajfIsRepeatingSlideInstance" }, { kind: "pipe", type: i1.AjfRangePipe, name: "ajfRange" }, { kind: "pipe", type: i1.AjfValidSlidePipe, name: "ajfValidSlide" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfFormRenderer, decorators: [{
             type: Component,
-            args: [{ selector: 'ajf-form', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"formGroup|async as fg\">\n  <form [class.ajf-form-readonly]=\"readonly\" novalidate [formGroup]=\"fg!\">\n    <div class=\"ajf-form-container\">\n      <mat-toolbar *ngIf=\"!hideTopToolbar && topBar\" class=\"ajf-btn-strip\">\n        <mat-button-toggle-group>\n          <ng-container *ngFor=\"let slideInstance of (slides|async); trackBy: trackNodeById\">\n            <mat-button-toggle\n              *ngIf=\"slideInstance.node.label && slideInstance.node.label.length > 0\"\n              class=\"ajf-topbar-button\"\n              (click)=\"scrollToSlide(slideInstance)\"\n            >\n              {{slideInstance.node.label | transloco}}\n              <mat-icon *ngIf=\"!slideInstance.valid\" class=\"ajf-warning\">warning</mat-icon>\n              <mat-icon *ngIf=\"slideInstance.valid\" class=\"ajf-success\">check</mat-icon>\n            </mat-button-toggle>\n          </ng-container>\n        </mat-button-toggle-group>\n      </mat-toolbar>\n      <mat-toolbar *ngIf=\"!hideTopToolbar\">\n        {{ title }}\n        <span class=\"ajf-spacer\"></span>\n        <!-- this content projection allow to add buttons on toolbar -->\n        <ng-content select=\"[ajfFormTopToolbarButtons]\"></ng-content>\n        <!-- apply a default save button only when ajfFormSaveButton is empty -->\n        <span *ngIf=\"!saveDisabled\" (click)=\"onSave($event)\">\n          <span #saveButton\n            ><ng-content select=\"[ajfFormSaveButton]\"></ng-content\n          ></span>\n          <button\n            *ngIf=\"saveButton && saveButton.childNodes && saveButton.childNodes.length === 0\"\n            mat-button\n            default\n          >\n            {{'Save'|transloco}}\n          </button>\n        </span>\n      </mat-toolbar>\n      <div class=\"ajf-slider-container\">\n        <ajf-page-slider\n          (orientationChange)=\"orientationChangeHandler($event)\"\n          [fixedOrientation]=\"fixedOrientation\"\n          [hideNavigationButtons]=\"hideNavigationButtons\"\n          [orientation]=\"orientation\"\n          #formSlider\n        >\n          <ng-container *ngIf=\"(slides|async) as curSlides\">\n            <ng-container *ngIf=\"curSlides!.length > 0 && hasStartMessage\">\n              <ajf-page-slider-item>\n                <div class=\"ajf-form-page\">\n                  <mat-card>\n                    <mat-card-header>\n                      <div class=\"ajf-page-slider-item-header\">\n                        <h2>\n                          <span class=\"ajf-form-header-number\"> 1 &rarr; </span>\n                          <span class=\"ajf-title\">\n                            <ng-content\n                              select=\"[ajfFormStartMessageTitle]\"\n                            ></ng-content>\n                          </span>\n                        </h2>\n                      </div>\n                    </mat-card-header>\n                    <mat-card-content>\n                      <ng-content select=\"[ajfFormStartMessage]\"></ng-content>\n                    </mat-card-content>\n                  </mat-card>\n                </div>\n              </ajf-page-slider-item>\n            </ng-container>\n            <ng-container\n              *ngFor=\"let slideInstance of curSlides; trackBy:trackNodeById\"\n            >\n              <!-- non repeating slides -->\n              <ng-container *ngIf=\"slideInstance.visible\">\n                <ng-container\n                  *ngIf=\"!(slideInstance|ajfIsRepeatingSlideInstance)\"\n                >\n                  <ajf-page-slider-item>\n                    <div class=\"ajf-form-page\">\n                      <mat-card>\n                        <mat-card-header>\n                          <div class=\"ajf-page-slider-item-header\">\n                            <h2>\n                              <span class=\"ajf-form-header-number\"\n                                >{{ slideInstance.position + (hasStartMessage |\n                                ajfBoolToInt) }} &rarr;</span\n                              >\n                              <span\n                                [innerHTML]=\"slideInstance.node.label | transloco\"\n                              ></span>\n                            </h2>\n                            <mat-icon\n                              class=\"ajf-warning\"\n                              *ngIf=\"!slideInstance.valid\"\n                              >warning</mat-icon\n                            >\n                            <mat-icon\n                              class=\"ajf-success\"\n                              *ngIf=\"slideInstance.valid\"\n                              >check</mat-icon\n                            >\n                          </div>\n                        </mat-card-header>\n                        <mat-card-content>\n                          <ng-template\n                            ngFor\n                            let-fieldInstance\n                            [ngForOf]=\"slideInstance.flatNodes\"\n                            [ngForTrackBy]=\"trackNodeById\"\n                          >\n                            <div\n                              [ngClass]=\"'ajf-' + (fieldInstance|ajfAsFieldInstance).node.size\"\n                              class=\"ajf-field-entry\"\n                              *ngIf=\"fieldInstance.visible\"\n                            >\n                              <i\n                                [class]=\"(fieldInstance|ajfAsFieldInstance).node.fieldType | ajfFieldIcon\"\n                                item-right\n                              ></i>\n                              <p>\n                                {{\n                                ((fieldInstance|ajfAsFieldInstance).node.description\n                                || '') | transloco }}\n                              </p>\n                              <label\n                                [attr.id]=\"fieldInstance.node.name\"\n                                *ngIf=\"(fieldInstance|ajfAsFieldInstance).node.fieldType !== 7\"\n                                [innerHTML]=\"fieldInstance.node.label | transloco\"\n                              ></label>\n                              <mat-icon\n                                class=\"ajf-tooltip-icon\"\n                                *ngIf=\"(fieldInstance|ajfAsFieldInstance).node?.hint as hint\"\n                                [matTooltip]=\"hint\"\n                                matTooltipPosition=\"right\"\n                              >\n                                {{(fieldInstance|ajfAsFieldInstance).node?.hintIcon\n                                || 'help'}}</mat-icon\n                              >\n                              <ajf-field\n                                [instance]=\"fieldInstance|ajfAsFieldInstance\"\n                                [readonly]=\"readonly || !slideInstance.editable\"\n                              >\n                              </ajf-field>\n                            </div>\n                          </ng-template>\n                        </mat-card-content>\n                      </mat-card>\n                    </div>\n                  </ajf-page-slider-item>\n                </ng-container>\n                <!-- repeating slides -->\n                <ng-container\n                  *ngIf=\"(slideInstance|ajfIsRepeatingSlideInstance)\"\n                >\n                  <ajf-page-slider-item\n                    *ngFor=\"let curRep of ((slideInstance|ajfAsRepeatingSlideInstance).reps|ajfRange); let idx = index; let lastSlide = last\"\n                  >\n                    <div class=\"ajf-form-page\">\n                      <mat-card>\n                        <mat-card-header>\n                          <div class=\"ajf-page-slider-item-header\">\n                            <h2>\n                              <span class=\"ajf-form-header-number\"\n                                >{{ slideInstance.position|ajfIncrement:idx +\n                                (hasStartMessage | ajfBoolToInt) }} &rarr;</span\n                              >\n                              <span\n                                [innerHTML]=\"slideInstance.node.label | transloco\"\n                              ></span>\n                            </h2>\n                            <mat-icon\n                              class=\"ajf-warning\"\n                              *ngIf=\"!(slideInstance|ajfValidSlide:idx)\"\n                              >warning</mat-icon\n                            >\n                            <mat-icon\n                              class=\"ajf-success\"\n                              *ngIf=\"(slideInstance|ajfValidSlide:idx)\"\n                              >check</mat-icon\n                            >\n                          </div>\n                        </mat-card-header>\n                        <mat-card-content>\n                          <div\n                            *ngIf=\"lastSlide && !readonly\"\n                            class=\"ajf-group-actions\"\n                          >\n                            <button\n                              (click)=\"addGroup(slideInstance)\"\n                              [disabled]=\"!(slideInstance|ajfAsRepeatingSlideInstance).canAdd || ((slideInstance|ajfAsRepeatingSlideInstance).node?.disableRemoval && !slideInstance.valid)\"\n                              mat-mini-fab\n                            >\n                              <mat-icon>add</mat-icon>\n                            </button>\n                            <button\n                              (click)=\"removeGroup(slideInstance)\"\n                              [disabled]=\"!(slideInstance|ajfAsRepeatingSlideInstance).canRemove || (slideInstance|ajfAsRepeatingSlideInstance).node?.disableRemoval\"\n                              mat-mini-fab\n                            >\n                              <mat-icon>remove</mat-icon>\n                            </button>\n                          </div>\n                          <ng-template\n                            ngFor\n                            let-fieldInstance\n                            [ngForOf]=\"slideInstance.slideNodes[idx]\"\n                            [ngForTrackBy]=\"trackNodeById\"\n                          >\n                            <div\n                              [ngClass]=\"'ajf-' + (fieldInstance|ajfAsFieldInstance).node.size\"\n                              class=\"ajf-field-entry\"\n                              *ngIf=\"fieldInstance.visible\"\n                            >\n                              <i\n                                [class]=\"(fieldInstance|ajfAsFieldInstance).node.fieldType | ajfFieldIcon\"\n                                item-right\n                              ></i>\n                              <p>\n                                {{\n                                ((fieldInstance|ajfAsFieldInstance).node.description\n                                || '') | transloco }}\n                              </p>\n                              <label\n                                [attr.id]=\"fieldInstance.node.name\"\n                                [innerHTML]=\"fieldInstance.node.label | transloco\"\n                              ></label>\n                              <mat-icon\n                                class=\"ajf-tooltip-icon\"\n                                *ngIf=\"(fieldInstance|ajfAsFieldInstance).node?.hint as hint\"\n                                [matTooltip]=\"hint\"\n                                matTooltipPosition=\"right\"\n                              >\n                                {{(fieldInstance|ajfAsFieldInstance).node?.hintIcon\n                                || 'help'}}</mat-icon\n                              >\n                              <ajf-field\n                                [instance]=\"fieldInstance|ajfAsFieldInstance\"\n                                [readonly]=\"readonly || (!lastSlide && (slideInstance|ajfAsRepeatingSlideInstance).node?.disableRemoval)\"\n                              >\n                              </ajf-field>\n                            </div>\n                          </ng-template>\n                        </mat-card-content>\n                      </mat-card>\n                    </div>\n                  </ajf-page-slider-item>\n                </ng-container>\n              </ng-container>\n            </ng-container>\n            <ng-container\n              *ngIf=\"curSlides && curSlides!.length > 0 && hasEndMessage\"\n            >\n              <ajf-page-slider-item>\n                <div class=\"ajf-form-page\">\n                  <mat-card>\n                    <mat-card-header>\n                      <div class=\"ajf-page-slider-item-header\">\n                        <h2>\n                          <span\n                            *ngIf=\"(slidesNum|async) as snum\"\n                            class=\"ajf-form-header-number\"\n                          >\n                            {{ snum! + (hasStartMessage | ajfBoolToInt ) + 1 }}\n                            &rarr;\n                          </span>\n                          <span class=\"ajf-title\">\n                            <ng-content\n                              select=\"[ajfFormEndMessageTitle]\"\n                            ></ng-content>\n                          </span>\n                        </h2>\n                      </div>\n                    </mat-card-header>\n                    <mat-card-content>\n                      <ng-content select=\"[ajfFormEndMessage]\"></ng-content>\n                    </mat-card-content>\n                  </mat-card>\n                </div>\n              </ajf-page-slider-item>\n            </ng-container>\n          </ng-container>\n          <div ajfPageSliderBar *ngIf=\"!hideBottomToolbar\">\n            <div class=\"ajf-left-bar\">\n              <div class=\"ajf-errors\" *ngIf=\"((errors | async) || 0) > 0\">\n                <button mat-button (click)=\"goToPrevError()\" danger>\n                  <mat-icon>arrow_upward</mat-icon>\n                </button>\n                <button mat-button (click)=\"goToNextError()\" danger>\n                  <mat-icon>arrow_downward</mat-icon>\n                </button>\n              </div>\n              <div class=\"ajf-info-box ajf-error\">\n                <div class=\"ajf-title\">{{'Errors'|transloco}}</div>\n                <div class=\"ajf-content\">\n                  {{ errors | async }} / {{ slidesNum|async }}\n                </div>\n              </div>\n            </div>\n          </div>\n        </ajf-page-slider>\n      </div>\n    </div>\n  </form>\n</ng-container>\n", styles: ["ajf-form{display:block}ajf-form .ajf-form-readonly .ajf-field-entry>label{font-weight:700}ajf-form .ajf-form-container{display:flex;flex-direction:column;position:absolute;top:0;right:0;bottom:0;left:0}ajf-form .ajf-form-container mat-toolbar.ajf-hidden{opacity:0}ajf-form .ajf-form-container .ajf-btn-strip .mat-button-toggle-group{overflow-x:auto}ajf-form .ajf-form-container .ajf-topbar-button{font-size:.8em}ajf-form .ajf-form-container mat-icon.ajf-warning{color:#f53d3d}ajf-form .ajf-form-container mat-icon.ajf-success{color:#32db64}ajf-form .ajf-form-container>.ajf-slider-container{flex:1;position:relative}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider{height:100%}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content{padding:16px}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page{flex:1;max-height:100%}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card{margin:1em 0 3em}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card>mat-card-content{display:flex;flex-wrap:wrap;flex-direction:row;align-content:flex-start;position:relative}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card>mat-card-content .ajf-group-actions{position:absolute;right:0;top:-30px;padding:15px;z-index:10}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card>mat-card-content>.ajf-field-entry{flex:1 0 auto;padding-left:10px;padding-right:10px;width:100%}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card>mat-card-content>.ajf-field-entry .mat-icon{vertical-align:bottom;margin-left:5px}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card>mat-card-content>.ajf-field-entry.ajf-normal{width:100%}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card>mat-card-content>.ajf-field-entry.ajf-small{width:50%}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card>mat-card-content>.ajf-field-entry.ajf-smaller{width:33%}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card>mat-card-content>.ajf-field-entry.ajf-tiny{width:25%}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card>mat-card-content>.ajf-field-entry.ajf-mini{width:20%}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider .ajf-page-slider-item-header{display:flex;align-items:center;width:100%}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider .ajf-page-slider-item-header>h2{flex:1}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider .ajf-page-slider-item-header>h2>.ajf-form-header-number{margin-right:.5em}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider .ajf-page-slider-item-header h2>.ajf-title{display:inline-block;margin-right:40px;white-space:normal;vertical-align:top}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider [ajfPageSliderBar] .ajf-left-bar{display:flex;align-items:flex-start;flex-direction:row;position:absolute;bottom:0}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider [ajfPageSliderBar] .ajf-left-bar .ajf-right-button{float:right}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider [ajfPageSliderBar] .ajf-left-bar .ajf-button-icon-only ion-icon{padding:0 .1em}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider [ajfPageSliderBar] .ajf-left-bar .ajf-info-box{height:40px;padding:4px}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider [ajfPageSliderBar] .ajf-left-bar .ajf-info-box>div{height:16px;line-height:16px}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider [ajfPageSliderBar] .ajf-left-bar .ajf-info-box>div.ajf-content{font-weight:700}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider [ajfPageSliderBar] .ajf-left-bar .ajf-info-box.ajf-error{order:2;color:red}ajf-form .ajf-form-container .ajf-spacer{flex:1 0 auto}\n"] }]
-        }], ctorParameters: function () { return [{ type: i1$1.AjfFormRendererService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { topBar: [{
+            args: [{ selector: 'ajf-form', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"formGroup|async as fg\">\n  <form [class.ajf-form-readonly]=\"readonly\" novalidate [formGroup]=\"fg!\">\n    <div class=\"ajf-form-container\">\n      <mat-toolbar *ngIf=\"!hideTopToolbar && topBar\" class=\"ajf-btn-strip\">\n        <mat-button-toggle-group>\n          <ng-container\n            *ngFor=\"let slideInstance of (slides|async); let idx = index; trackBy: trackNodeById\"\n          >\n            <mat-button-toggle\n              *ngIf=\"slideInstance.node.label && slideInstance.node.label.length > 0\"\n              class=\"ajf-topbar-button\"\n              (click)=\"scrollToSlide(slideInstance)\"\n              [checked]=\"isSlideToggleChecked(slideInstance, formSlider.currentPage)\"\n              [disabled]=\"slideInstance.visible === false\"\n            >\n              {{slideInstance.node.label | transloco}} {{ getRepeatingSlideRepIndex(slideInstance,\n              formSlider.currentPage)|async}}\n              <mat-icon *ngIf=\"!slideInstance.valid\" class=\"ajf-warning\">warning</mat-icon>\n              <mat-icon *ngIf=\"slideInstance.valid\" class=\"ajf-success\">check</mat-icon>\n            </mat-button-toggle>\n          </ng-container>\n        </mat-button-toggle-group>\n      </mat-toolbar>\n      <mat-toolbar *ngIf=\"!hideTopToolbar\">\n        {{ title }}\n        <span class=\"ajf-spacer\"></span>\n        <!-- this content projection allow to add buttons on toolbar -->\n        <ng-content select=\"[ajfFormTopToolbarButtons]\"></ng-content>\n        <!-- apply a default save button only when ajfFormSaveButton is empty -->\n        <span *ngIf=\"!saveDisabled\" (click)=\"onSave($event)\">\n          <span #saveButton><ng-content select=\"[ajfFormSaveButton]\"></ng-content></span>\n          <button\n            *ngIf=\"saveButton && saveButton.childNodes && saveButton.childNodes.length === 0\"\n            mat-button\n            default\n          >\n            {{'Save'|transloco}}\n          </button>\n        </span>\n      </mat-toolbar>\n      <div class=\"ajf-slider-container\">\n        <ajf-page-slider\n          (orientationChange)=\"orientationChangeHandler($event)\"\n          [fixedOrientation]=\"fixedOrientation\"\n          [hideNavigationButtons]=\"hideNavigationButtons\"\n          [orientation]=\"orientation\"\n          #formSlider\n        >\n          <ng-container *ngIf=\"(slides|async) as curSlides\">\n            <ng-container *ngIf=\"curSlides!.length > 0 && hasStartMessage\">\n              <ajf-page-slider-item>\n                <div class=\"ajf-form-page\">\n                  <mat-card appearance=\"outlined\">\n                    <mat-card-header>\n                      <div class=\"ajf-page-slider-item-header\">\n                        <h2>\n                          <span class=\"ajf-form-header-number\"> 1 &rarr; </span>\n                          <span class=\"ajf-title\">\n                            <ng-content select=\"[ajfFormStartMessageTitle]\"></ng-content>\n                          </span>\n                        </h2>\n                      </div>\n                    </mat-card-header>\n                    <mat-card-content>\n                      <ng-content select=\"[ajfFormStartMessage]\"></ng-content>\n                    </mat-card-content>\n                  </mat-card>\n                </div>\n              </ajf-page-slider-item>\n            </ng-container>\n            <ng-container *ngFor=\"let slideInstance of curSlides; trackBy:trackNodeById\">\n              <!-- non repeating slides -->\n              <ng-container *ngIf=\"slideInstance.visible\">\n                <ng-container *ngIf=\"!(slideInstance|ajfIsRepeatingSlideInstance)\">\n                  <ajf-page-slider-item>\n                    <div class=\"ajf-form-page\">\n                      <mat-card appearance=\"outlined\">\n                        <mat-card-header>\n                          <div class=\"ajf-page-slider-item-header\">\n                            <h2>\n                              <span class=\"ajf-form-header-number\"\n                                >{{ slideInstance.position + (hasStartMessage | ajfBoolToInt) }}\n                                &rarr;</span\n                              >\n                              <span [innerHTML]=\"slideInstance.node.label | transloco\"></span>\n                            </h2>\n                            <mat-icon class=\"ajf-warning\" *ngIf=\"!slideInstance.valid\"\n                              >warning</mat-icon\n                            >\n                            <mat-icon class=\"ajf-success\" *ngIf=\"slideInstance.valid\"\n                              >check</mat-icon\n                            >\n                          </div>\n                        </mat-card-header>\n                        <mat-card-content>\n                          <ng-template\n                            ngFor\n                            let-fieldInstance\n                            [ngForOf]=\"slideInstance.flatNodes\"\n                            [ngForTrackBy]=\"trackNodeById\"\n                          >\n                            <div\n                              [ngClass]=\"'ajf-' + (fieldInstance|ajfAsFieldInstance).node.size\"\n                              class=\"ajf-field-entry\"\n                              *ngIf=\"fieldInstance.visible\"\n                            >\n                              <i\n                                [class]=\"(fieldInstance|ajfAsFieldInstance).node.fieldType | ajfFieldIcon\"\n                                item-right\n                              ></i>\n                              <p>\n                                {{ ((fieldInstance|ajfAsFieldInstance).node.description || '') |\n                                transloco }}\n                              </p>\n                              <label\n                                [attr.id]=\"fieldInstance.node.name\"\n                                *ngIf=\"(fieldInstance|ajfAsFieldInstance).node.fieldType !== 7\"\n                                [innerHTML]=\"fieldInstance.node.label | transloco\"\n                              ></label>\n                              <mat-icon\n                                class=\"ajf-tooltip-icon\"\n                                *ngIf=\"(fieldInstance|ajfAsFieldInstance).node?.hint as hint\"\n                                [matTooltip]=\"hint\"\n                                matTooltipPosition=\"right\"\n                              >\n                                {{(fieldInstance|ajfAsFieldInstance).node.hintIcon ||\n                                'help'}}</mat-icon\n                              >\n                              <ajf-field\n                                [instance]=\"fieldInstance|ajfAsFieldInstance\"\n                                [readonly]=\"readonly || !slideInstance.editable\"\n                              >\n                              </ajf-field>\n                            </div>\n                          </ng-template>\n                        </mat-card-content>\n                      </mat-card>\n                    </div>\n                  </ajf-page-slider-item>\n                </ng-container>\n                <!-- repeating slides -->\n                <ng-container *ngIf=\"(slideInstance|ajfIsRepeatingSlideInstance)\">\n                  <ajf-page-slider-item\n                    *ngFor=\"let curRep of ((slideInstance|ajfAsRepeatingSlideInstance).reps|ajfRange); let idx = index; let lastSlide = last\"\n                  >\n                    <div class=\"ajf-form-page\">\n                      <mat-card appearance=\"outlined\">\n                        <mat-card-header>\n                          <div class=\"ajf-page-slider-item-header\">\n                            <h2>\n                              <span class=\"ajf-form-header-number\"\n                                >{{ slideInstance.position|ajfIncrement:idx + (hasStartMessage |\n                                ajfBoolToInt) }} &rarr;</span\n                              >\n                              <span [innerHTML]=\"slideInstance.node.label | transloco\"></span>\n                            </h2>\n                            <mat-icon class=\"ajf-warning\" *ngIf=\"!(slideInstance|ajfValidSlide:idx)\"\n                              >warning</mat-icon\n                            >\n                            <mat-icon class=\"ajf-success\" *ngIf=\"(slideInstance|ajfValidSlide:idx)\"\n                              >check</mat-icon\n                            >\n                          </div>\n                        </mat-card-header>\n                        <mat-card-content>\n                          <div *ngIf=\"lastSlide && !readonly\" class=\"ajf-group-actions\">\n                            <button\n                              (click)=\"addGroup(slideInstance)\"\n                              [disabled]=\"!(slideInstance|ajfAsRepeatingSlideInstance).canAdd || ((slideInstance|ajfAsRepeatingSlideInstance).node.disableRemoval && !slideInstance.valid)\"\n                              mat-mini-fab\n                            >\n                              <mat-icon>add</mat-icon>\n                            </button>\n                            <button\n                              (click)=\"removeGroup(slideInstance)\"\n                              [disabled]=\"!(slideInstance|ajfAsRepeatingSlideInstance).canRemove || (slideInstance|ajfAsRepeatingSlideInstance).node.disableRemoval\"\n                              mat-mini-fab\n                            >\n                              <mat-icon>remove</mat-icon>\n                            </button>\n                          </div>\n                          <ng-template\n                            ngFor\n                            let-fieldInstance\n                            [ngForOf]=\"slideInstance.slideNodes[idx]\"\n                            [ngForTrackBy]=\"trackNodeById\"\n                          >\n                            <div\n                              [ngClass]=\"'ajf-' + (fieldInstance|ajfAsFieldInstance).node.size\"\n                              class=\"ajf-field-entry\"\n                              *ngIf=\"fieldInstance.visible\"\n                            >\n                              <i\n                                [class]=\"(fieldInstance|ajfAsFieldInstance).node.fieldType | ajfFieldIcon\"\n                                item-right\n                              ></i>\n                              <p>\n                                {{ ((fieldInstance|ajfAsFieldInstance).node.description || '') |\n                                transloco }}\n                              </p>\n                              <label\n                                [attr.id]=\"fieldInstance.node.name\"\n                                [innerHTML]=\"fieldInstance.node.label | transloco\"\n                              ></label>\n                              <mat-icon\n                                class=\"ajf-tooltip-icon\"\n                                *ngIf=\"(fieldInstance|ajfAsFieldInstance).node?.hint as hint\"\n                                [matTooltip]=\"hint\"\n                                matTooltipPosition=\"right\"\n                              >\n                                {{(fieldInstance|ajfAsFieldInstance).node.hintIcon ||\n                                'help'}}</mat-icon\n                              >\n                              <ajf-field\n                                [instance]=\"fieldInstance|ajfAsFieldInstance\"\n                                [readonly]=\"readonly || (!lastSlide && (slideInstance|ajfAsRepeatingSlideInstance).node.disableRemoval)\"\n                              >\n                              </ajf-field>\n                            </div>\n                          </ng-template>\n                        </mat-card-content>\n                      </mat-card>\n                    </div>\n                  </ajf-page-slider-item>\n                </ng-container>\n              </ng-container>\n            </ng-container>\n            <ng-container *ngIf=\"curSlides && curSlides!.length > 0 && hasEndMessage\">\n              <ajf-page-slider-item>\n                <div class=\"ajf-form-page\">\n                  <mat-card appearance=\"outlined\">\n                    <mat-card-header>\n                      <div class=\"ajf-page-slider-item-header\">\n                        <h2>\n                          <span *ngIf=\"(slidesNum|async) as snum\" class=\"ajf-form-header-number\">\n                            {{ snum! + (hasStartMessage | ajfBoolToInt ) + 1 }} &rarr;\n                          </span>\n                          <span class=\"ajf-title\">\n                            <ng-content select=\"[ajfFormEndMessageTitle]\"></ng-content>\n                          </span>\n                        </h2>\n                      </div>\n                    </mat-card-header>\n                    <mat-card-content>\n                      <ng-content select=\"[ajfFormEndMessage]\"></ng-content>\n                    </mat-card-content>\n                  </mat-card>\n                </div>\n              </ajf-page-slider-item>\n            </ng-container>\n          </ng-container>\n          <div ajfPageSliderBar *ngIf=\"!hideBottomToolbar\">\n            <div class=\"ajf-left-bar\">\n              <div class=\"ajf-errors\" *ngIf=\"((errors | async) || 0) > 0\">\n                <button mat-button (click)=\"goToPrevError()\" danger>\n                  <mat-icon>arrow_upward</mat-icon>\n                </button>\n                <button mat-button (click)=\"goToNextError()\" danger>\n                  <mat-icon>arrow_downward</mat-icon>\n                </button>\n              </div>\n              <div class=\"ajf-info-box ajf-error\">\n                <div class=\"ajf-title\">{{'Errors'|transloco}}</div>\n                <div class=\"ajf-content\">{{ errors | async }} / {{ slidesNum|async }}</div>\n              </div>\n            </div>\n          </div>\n        </ajf-page-slider>\n      </div>\n    </div>\n  </form>\n</ng-container>\n", styles: ["ajf-form{display:block}ajf-form .ajf-form-readonly .ajf-field-entry>label{font-weight:700}ajf-form .ajf-form-container{display:flex;flex-direction:column;position:absolute;inset:0}ajf-form .ajf-form-container mat-toolbar.ajf-hidden{opacity:0}ajf-form .ajf-form-container .ajf-btn-strip .mat-button-toggle-group{overflow-x:auto}ajf-form .ajf-form-container .ajf-topbar-button{font-size:.8em}ajf-form .ajf-form-container mat-icon.ajf-warning{color:#f53d3d}ajf-form .ajf-form-container mat-icon.ajf-success{color:#32db64}ajf-form .ajf-form-container>.ajf-slider-container{flex:1;position:relative}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider{height:100%}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content{padding:16px}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page{flex:1;max-height:100%}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card{margin:1em 0 3em}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card>mat-card-content{display:flex;flex-wrap:wrap;flex-direction:row;align-content:flex-start;position:relative}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card>mat-card-content .ajf-group-actions{position:absolute;right:0;top:-30px;padding:15px;z-index:10}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card>mat-card-content>.ajf-field-entry{flex:1 0 auto;padding-left:10px;padding-right:10px;width:100%}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card>mat-card-content>.ajf-field-entry .mat-icon{vertical-align:bottom;margin-left:5px}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card>mat-card-content>.ajf-field-entry.ajf-normal{width:100%}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card>mat-card-content>.ajf-field-entry.ajf-small{width:50%}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card>mat-card-content>.ajf-field-entry.ajf-smaller{width:33%}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card>mat-card-content>.ajf-field-entry.ajf-tiny{width:25%}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider ajf-page-slider-item .ajf-page-slider-item-content .ajf-form-page>mat-card>mat-card-content>.ajf-field-entry.ajf-mini{width:20%}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider .ajf-page-slider-item-header{display:flex;align-items:center;width:100%}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider .ajf-page-slider-item-header>h2{flex:1}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider .ajf-page-slider-item-header>h2>.ajf-form-header-number{margin-right:.5em}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider .ajf-page-slider-item-header h2>.ajf-title{display:inline-block;margin-right:40px;white-space:normal;vertical-align:top}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider [ajfPageSliderBar] .ajf-left-bar{display:flex;align-items:flex-start;flex-direction:row;position:absolute;bottom:0}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider [ajfPageSliderBar] .ajf-left-bar .ajf-right-button{float:right}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider [ajfPageSliderBar] .ajf-left-bar .ajf-button-icon-only ion-icon{padding:0 .1em}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider [ajfPageSliderBar] .ajf-left-bar .ajf-info-box{height:40px;padding:4px}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider [ajfPageSliderBar] .ajf-left-bar .ajf-info-box>div{height:16px;line-height:16px}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider [ajfPageSliderBar] .ajf-left-bar .ajf-info-box>div.ajf-content{font-weight:700}ajf-form .ajf-form-container>.ajf-slider-container>ajf-page-slider [ajfPageSliderBar] .ajf-left-bar .ajf-info-box.ajf-error{order:2;color:red}ajf-form .ajf-form-container .ajf-spacer{flex:1 0 auto}\n"] }]
+        }], ctorParameters: function () { return [{ type: i1.AjfFormRendererService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { topBar: [{
                 type: Input
             }] } });
 
@@ -831,8 +834,8 @@ class AjfFormsModule {
         };
     }
 }
-AjfFormsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfFormsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-AjfFormsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfFormsModule, declarations: [AjfBarcodeFieldComponent,
+AjfFormsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfFormsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+AjfFormsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.0.4", ngImport: i0, type: AjfFormsModule, declarations: [AjfBarcodeFieldComponent,
         AjfBooleanFieldComponent,
         AjfDateFieldComponent,
         AjfDateInputFieldComponent,
@@ -859,10 +862,12 @@ AjfFormsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version:
         MatButtonModule,
         MatButtonToggleModule,
         MatCardModule,
+        MatDatepickerModule,
         MatDialogModule,
         MatFormFieldModule,
         MatIconModule,
         MatInputModule,
+        MatNativeDateModule,
         MatRadioModule,
         MatSelectModule,
         MatSlideToggleModule,
@@ -871,36 +876,36 @@ AjfFormsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version:
         ReactiveFormsModule,
         TextFieldModule,
         MatSliderModule], exports: [AjfFormField, AjfFormRenderer] });
-AjfFormsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfFormsModule, providers: [
+AjfFormsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfFormsModule, providers: [
         AjfFieldService,
         { provide: AJF_WARNING_ALERT_SERVICE, useClass: AjfWarningAlertService },
-    ], imports: [[
-            AjfBarcodeModule,
-            AjfCalendarModule,
-            AjfCommonModule,
-            AjfCheckboxGroupModule,
-            AjfPageSliderModule,
-            AjfTimeModule,
-            AjfTranslocoModule,
-            CommonModule,
-            AjfFormsModule$1,
-            MatButtonModule,
-            MatButtonToggleModule,
-            MatCardModule,
-            MatDialogModule,
-            MatFormFieldModule,
-            MatIconModule,
-            MatInputModule,
-            MatRadioModule,
-            MatSelectModule,
-            MatSlideToggleModule,
-            MatToolbarModule,
-            MatTooltipModule,
-            ReactiveFormsModule,
-            TextFieldModule,
-            MatSliderModule,
-        ]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.5", ngImport: i0, type: AjfFormsModule, decorators: [{
+    ], imports: [AjfBarcodeModule,
+        AjfCalendarModule,
+        AjfCommonModule,
+        AjfCheckboxGroupModule,
+        AjfPageSliderModule,
+        AjfTimeModule,
+        AjfTranslocoModule,
+        CommonModule,
+        AjfFormsModule$1,
+        MatButtonModule,
+        MatButtonToggleModule,
+        MatCardModule,
+        MatDatepickerModule,
+        MatDialogModule,
+        MatFormFieldModule,
+        MatIconModule,
+        MatInputModule,
+        MatNativeDateModule,
+        MatRadioModule,
+        MatSelectModule,
+        MatSlideToggleModule,
+        MatToolbarModule,
+        MatTooltipModule,
+        ReactiveFormsModule,
+        TextFieldModule,
+        MatSliderModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: AjfFormsModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [
@@ -916,10 +921,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.5", ngImpor
                         MatButtonModule,
                         MatButtonToggleModule,
                         MatCardModule,
+                        MatDatepickerModule,
                         MatDialogModule,
                         MatFormFieldModule,
                         MatIconModule,
                         MatInputModule,
+                        MatNativeDateModule,
                         MatRadioModule,
                         MatSelectModule,
                         MatSlideToggleModule,
@@ -947,21 +954,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.5", ngImpor
                         AjfTimeFieldComponent,
                         AjfVideoUrlFieldComponent,
                     ],
-                    entryComponents: [
-                        AjfBarcodeFieldComponent,
-                        AjfBooleanFieldComponent,
-                        AjfDateFieldComponent,
-                        AjfDateInputFieldComponent,
-                        AjfEmptyFieldComponent,
-                        AjfInputFieldComponent,
-                        AjfMultipleChoiceFieldComponent,
-                        AjfRangeFieldComponent,
-                        AjfSingleChoiceFieldComponent,
-                        AjfTableFieldComponent,
-                        AjfTextFieldComponent,
-                        AjfTimeFieldComponent,
-                        AjfVideoUrlFieldComponent,
-                    ],
                     exports: [AjfFormField, AjfFormRenderer],
                     providers: [
                         AjfFieldService,