@kms-ngx-ui/presentational 20.1.3 → 20.1.5

package/fesm2022/kms-ngx-ui-presentational.mjs

@@ -14,7 +14,7 @@ import * as i1$1 from '@angular/platform-browser';
 import * as i1$6 from '@angular-slider/ngx-slider';
 import { NgxSliderModule } from '@angular-slider/ngx-slider';
 export { ChangeContext as KmsSliderChange, Options as KmsSliderOptions } from '@angular-slider/ngx-slider';
-import * as i1$8 from '@angular/cdk/drag-drop';
+import * as i1$9 from '@angular/cdk/drag-drop';
 import { moveItemInArray, DragDropModule } from '@angular/cdk/drag-drop';
 import * as i1$4 from '@angular/google-maps';
 import { GoogleMapsModule } from '@angular/google-maps';
@@ -22,7 +22,7 @@ import * as i5$1 from '@angular/material/autocomplete';
 import { MatAutocompleteModule } from '@angular/material/autocomplete';
 import * as i2$2 from '@angular/material/button';
 import { MatButtonModule } from '@angular/material/button';
-import * as i4$2 from '@angular/material/card';
+import * as i4$1 from '@angular/material/card';
 import { MatCardModule } from '@angular/material/card';
 import { MatNativeDateModule } from '@angular/material/core';
 import * as i4 from '@angular/material/datepicker';
@@ -46,7 +46,7 @@ import { MatSelectModule } from '@angular/material/select';
 import * as i5 from 'ngx-mat-select-search';
 import { NgxMatSelectSearchModule } from 'ngx-mat-select-search';
 import { MatTooltipModule } from '@angular/material/tooltip';
-import * as i4$1 from '@ngx-translate/core';
+import * as i1$8 from '@ngx-translate/core';
 import { TranslateModule } from '@ngx-translate/core';
 import { autoUpdate, computePosition, shift, offset, arrow, flip } from '@floating-ui/dom';
 import { Subject, takeUntil as takeUntil$1, isObservable, merge } from 'rxjs';
@@ -2250,7 +2250,7 @@ class EnumRadiogroupComponent extends FormControlParentComponent {
                 useExisting: forwardRef(() => EnumRadiogroupComponent),
                 multi: true,
             },
-        ], usesInheritance: true, ngImport: i0, template: "<form [formGroup]=\"form\">\n  <div>{{ header }}</div>\n  <mat-radio-group formControlName=\"enumData\" [disabled]=\"disabled\" #child>\n    @for (choice of optionValues; track choice) {\n      <mat-radio-button\n        [value]=\"choice\"\n        [checked]=\"value === choice\"\n        >{{ translationPrefix + '.' + choice | translate }}</mat-radio-button\n        >\n      }\n    </mat-radio-group>\n  </form>\n", dependencies: [{ kind: "directive", type: i1$5.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i1$5.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i4$1.TranslatePipe, name: "translate" }] }); }
+        ], usesInheritance: true, ngImport: i0, template: "<form [formGroup]=\"form\">\n  <div>{{ header }}</div>\n  <mat-radio-group formControlName=\"enumData\" [disabled]=\"disabled\" #child>\n    @for (choice of optionValues; track choice) {\n      <mat-radio-button\n        [value]=\"choice\"\n        [checked]=\"value === choice\"\n        >{{ translationPrefix + '.' + choice | translate }}</mat-radio-button\n        >\n      }\n    </mat-radio-group>\n  </form>\n", dependencies: [{ kind: "directive", type: i1$5.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i1$5.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i1$8.TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: EnumRadiogroupComponent, decorators: [{
             type: Component,
@@ -2465,7 +2465,7 @@ class FileInputComponent {
                 useExisting: forwardRef(() => FileInputComponent),
                 multi: true,
             },
-        ], viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }], ngImport: i0, template: "<form [formGroup]=\"form\" (change)=\"newImageLoading = true\" class=\"fileInput\">\n  @if (form.value.Filename && previewImage) {\n    <div>\n      @if (newImageLoading) {\n        <div>\n          {{ 'file-input.loading' | translate }}\n        </div>\n      }\n      @if (!newImageLoading) {\n        <div>\n          <div class=\"\">\n            <div class=\"\">\n              @if (\n                form.value.ImageLink &&\n                form.value.ImageLink !== '' &&\n                !(form.value.ImageAsDataURL && form.value.ImageAsDataURL !== '')\n                ) {\n                <img\n                  [src]=\"form.value.ImageAsDataURL\"\n                  [src]=\"form.value.ImageLink\"\n                  style=\"height: 40px; width: fit-content\"\n                  />\n              }\n              @if (\n                form.value.ImageAsDataURL && form.value.ImageAsDataURL !== ''\n                ) {\n                <img\n                  [src]=\"form.value.ImageAsDataURL\"\n                  style=\"height: 40px; width: fit-content\"\n                  />\n              }\n            </div>\n            <div class=\"\">{{ form.value.Filename }}</div>\n            <div class=\"\">\n              @if (allowRemove) {\n                <div (click)=\"removeFromList()\">\n                  <kms-icon\n                    icon=\"trash\"\n                    [size]=\"IconSizePx.XS\"\n                    iconClass=\"color-black\"\n                  ></kms-icon>\n                  {{ 'file-input.remove' }}\n                </div>\n              }\n            </div>\n          </div>\n        </div>\n      }\n    </div>\n  }\n  @if (!previewImage) {\n    <div>\n      <div class=\"\">{{ form.value.Filename }}</div>\n    </div>\n  }\n\n  <button\n    (click)=\"selectImageOverlay()\"\n    class=\"button-primary-font-color\"\n    mat-stroked-button\n    >\n    <span>{{ label }}</span>\n  </button>\n  <input\n    type=\"file\"\n    [accept]=\"acceptedFileMimetypes\"\n    style=\"display: none\"\n    #fileInput\n    (click)=\"clearInputValue($event)\"\n    (change)=\"selectImage($event)\"\n    />\n\n  <input type=\"hidden\" formControlName=\"ImageIdent\" />\n  <input type=\"hidden\" formControlName=\"ImageLink\" />\n  <input type=\"hidden\" formControlName=\"Filename\" />\n  <input type=\"hidden\" formControlName=\"ImageAsDataURL\" />\n  <input type=\"hidden\" formControlName=\"Text\" />\n</form>\n", styles: [""], dependencies: [{ kind: "component", type: i2$2.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: IconComponent, selector: "kms-icon", inputs: ["icon", "iconClass", "size", "dontUseSprite", "color"] }, { kind: "pipe", type: i4$1.TranslatePipe, name: "translate" }] }); }
+        ], viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }], ngImport: i0, template: "<form [formGroup]=\"form\" (change)=\"newImageLoading = true\" class=\"fileInput\">\n  @if (form.value.Filename && previewImage) {\n    <div>\n      @if (newImageLoading) {\n        <div>\n          {{ 'file-input.loading' | translate }}\n        </div>\n      }\n      @if (!newImageLoading) {\n        <div>\n          <div class=\"\">\n            <div class=\"\">\n              @if (\n                form.value.ImageLink &&\n                form.value.ImageLink !== '' &&\n                !(form.value.ImageAsDataURL && form.value.ImageAsDataURL !== '')\n                ) {\n                <img\n                  [src]=\"form.value.ImageAsDataURL\"\n                  [src]=\"form.value.ImageLink\"\n                  style=\"height: 40px; width: fit-content\"\n                  />\n              }\n              @if (\n                form.value.ImageAsDataURL && form.value.ImageAsDataURL !== ''\n                ) {\n                <img\n                  [src]=\"form.value.ImageAsDataURL\"\n                  style=\"height: 40px; width: fit-content\"\n                  />\n              }\n            </div>\n            <div class=\"\">{{ form.value.Filename }}</div>\n            <div class=\"\">\n              @if (allowRemove) {\n                <div (click)=\"removeFromList()\">\n                  <kms-icon\n                    icon=\"trash\"\n                    [size]=\"IconSizePx.XS\"\n                    iconClass=\"color-black\"\n                  ></kms-icon>\n                  {{ 'file-input.remove' }}\n                </div>\n              }\n            </div>\n          </div>\n        </div>\n      }\n    </div>\n  }\n  @if (!previewImage) {\n    <div>\n      <div class=\"\">{{ form.value.Filename }}</div>\n    </div>\n  }\n\n  <button\n    (click)=\"selectImageOverlay()\"\n    class=\"button-primary-font-color\"\n    mat-stroked-button\n    >\n    <span>{{ label }}</span>\n  </button>\n  <input\n    type=\"file\"\n    [accept]=\"acceptedFileMimetypes\"\n    style=\"display: none\"\n    #fileInput\n    (click)=\"clearInputValue($event)\"\n    (change)=\"selectImage($event)\"\n    />\n\n  <input type=\"hidden\" formControlName=\"ImageIdent\" />\n  <input type=\"hidden\" formControlName=\"ImageLink\" />\n  <input type=\"hidden\" formControlName=\"Filename\" />\n  <input type=\"hidden\" formControlName=\"ImageAsDataURL\" />\n  <input type=\"hidden\" formControlName=\"Text\" />\n</form>\n", styles: [""], dependencies: [{ kind: "component", type: i2$2.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: IconComponent, selector: "kms-icon", inputs: ["icon", "iconClass", "size", "dontUseSprite", "color"] }, { kind: "pipe", type: i1$8.TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FileInputComponent, decorators: [{
             type: Component,
@@ -2679,7 +2679,7 @@ class ImageSliderComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ImageSliderComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: ImageSliderComponent, isStandalone: false, selector: "kms-image-slider", inputs: { slides: "slides", editMode: "editMode", imagesToSave: "imagesToSave" }, outputs: { deleteImageEvent: "deleteImageEvent", orderChanged: "orderChanged" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"image-slider-container\">\n  <swiper-container\n    class=\"swiper-main-view-container\"\n    thumbs-swiper=\".swiper-carousel-container\"\n    >\n    @for (slide of slides; track slide) {\n      <swiper-slide>\n        <img [src]=\"slide\" loading=\"lazy\" />\n      </swiper-slide>\n    }\n  </swiper-container>\n\n  <swiper-container\n    class=\"swiper-carousel-container\"\n    thumbsSlider=\"\"\n    cdkDropList\n    cdkDropListOrientation=\"horizontal\"\n    (cdkDropListDropped)=\"onOrderChanged($event)\"\n    >\n    @for (slide of slides; track slide; let index = $index) {\n      <swiper-slide\n        [class.swiper-slide-default]=\"index === 0 && editMode\"\n        >\n        @if (editMode) {\n          <div>\n            <button cdkDrag class=\"drag-button\" mat-menu-item></button>\n            <button\n              class=\"delete-button\"\n              mat-menu-item\n              (click)=\"deleteImage(index)\"\n              >\n              <kms-icon icon=\"trash\" [size]=\"15\"></kms-icon>\n            </button>\n          </div>\n        }\n        <img [src]=\"slide\" loading=\"lazy\" />\n        @if (index === 0 && editMode) {\n          <div class=\"swiper-slide-default-text\">\n            {{ 'common.defaultImage' | translate }}\n          </div>\n        }\n      </swiper-slide>\n    }\n  </swiper-container>\n</div>\n", dependencies: [{ kind: "directive", type: i1$8.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i1$8.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "component", type: i2$3.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "component", type: IconComponent, selector: "kms-icon", inputs: ["icon", "iconClass", "size", "dontUseSprite", "color"] }, { kind: "pipe", type: i4$1.TranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: ImageSliderComponent, isStandalone: false, selector: "kms-image-slider", inputs: { slides: "slides", editMode: "editMode", imagesToSave: "imagesToSave" }, outputs: { deleteImageEvent: "deleteImageEvent", orderChanged: "orderChanged" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"image-slider-container\">\n  <swiper-container\n    class=\"swiper-main-view-container\"\n    thumbs-swiper=\".swiper-carousel-container\"\n    >\n    @for (slide of slides; track slide) {\n      <swiper-slide>\n        <img [src]=\"slide\" loading=\"lazy\" />\n      </swiper-slide>\n    }\n  </swiper-container>\n\n  <swiper-container\n    class=\"swiper-carousel-container\"\n    thumbsSlider=\"\"\n    cdkDropList\n    cdkDropListOrientation=\"horizontal\"\n    (cdkDropListDropped)=\"onOrderChanged($event)\"\n    >\n    @for (slide of slides; track slide; let index = $index) {\n      <swiper-slide\n        [class.swiper-slide-default]=\"index === 0 && editMode\"\n        >\n        @if (editMode) {\n          <div>\n            <button cdkDrag class=\"drag-button\" mat-menu-item></button>\n            <button\n              class=\"delete-button\"\n              mat-menu-item\n              (click)=\"deleteImage(index)\"\n              >\n              <kms-icon icon=\"trash\" [size]=\"15\"></kms-icon>\n            </button>\n          </div>\n        }\n        <img [src]=\"slide\" loading=\"lazy\" />\n        @if (index === 0 && editMode) {\n          <div class=\"swiper-slide-default-text\">\n            {{ 'common.defaultImage' | translate }}\n          </div>\n        }\n      </swiper-slide>\n    }\n  </swiper-container>\n</div>\n", dependencies: [{ kind: "directive", type: i1$9.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i1$9.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "component", type: i2$3.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "component", type: IconComponent, selector: "kms-icon", inputs: ["icon", "iconClass", "size", "dontUseSprite", "color"] }, { kind: "pipe", type: i1$8.TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ImageSliderComponent, decorators: [{
             type: Component,
@@ -2922,7 +2922,7 @@ class PasswordComponent {
                 useExisting: forwardRef(() => PasswordComponent),
                 multi: true,
             },
-        ], ngImport: i0, template: "<mat-form-field class=\"kms-password__form-field\">\n  <mat-label>{{ label() }}</mat-label>\n  <input\n    [type]=\"showPassword() ? 'text' : 'password'\"\n    matInput\n    (input)=\"valueChanged($event)\"\n    [disabled]=\"disabled()\"\n    (keypress)=\"keypress($event)\"\n    #password=\"matInput\"\n  />\n  @if (showPassword()) {\n  <kms-icon\n    class=\"kms-time-input__suffix\"\n    matSuffix\n    icon=\"ic_eye\"\n    [size]=\"IconSizePx.XS\"\n    (click)=\"showPassword.set(false)\"\n    (mousedown)=\"eyeIconIsBeingPressed.set(true)\"\n    (mouseup)=\"eyeIconIsBeingPressed.set(false)\"\n  ></kms-icon>\n  } @else {\n  <kms-icon\n    class=\"kms-time-input__suffix\"\n    matSuffix\n    icon=\"ic_eye_active\"\n    [size]=\"IconSizePx.XS\"\n    (click)=\"showPassword.set(true)\"\n    (mousedown)=\"eyeIconIsBeingPressed.set(true)\"\n    (mouseup)=\"eyeIconIsBeingPressed.set(false)\"\n  ></kms-icon>\n  }\n</mat-form-field>\n\n@if ((eyeIconIsBeingPressed() || password.focused) && withStrength()) {\n<mat-card appearance=\"outlined\">\n  <mat-card-content class=\"kms-password__card\">\n    <mat-list role=\"list\">\n      @for (validation of validations(); track validation) {\n      <mat-list-item role=\"listitem\">\n        <div class=\"kms-password__strength-item\">\n          @if(validation.isValid()) {\n          <kms-icon\n            [size]=\"IconSizePx.XS\"\n            icon=\"ic_check\"\n            iconClass=\"color-success\"\n          ></kms-icon>\n          }@else {\n          <kms-icon\n            [size]=\"IconSizePx.XS\"\n            icon=\"ic_abbrechen\"\n            iconClass=\"color-warn\"\n          ></kms-icon>\n          } {{ validation.text() }}\n        </div></mat-list-item\n      >\n      }\n    </mat-list>\n  </mat-card-content>\n</mat-card>\n}\n", dependencies: [{ kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i3$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i3$4.MatList, selector: "mat-list", exportAs: ["matList"] }, { kind: "component", type: i3$4.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }, { kind: "component", type: i4$2.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i4$2.MatCardContent, selector: "mat-card-content" }, { kind: "component", type: IconComponent, selector: "kms-icon", inputs: ["icon", "iconClass", "size", "dontUseSprite", "color"] }] }); }
+        ], ngImport: i0, template: "<mat-form-field class=\"kms-password__form-field\">\n  <mat-label>{{ label() }}</mat-label>\n  <input\n    [type]=\"showPassword() ? 'text' : 'password'\"\n    matInput\n    (input)=\"valueChanged($event)\"\n    [disabled]=\"disabled()\"\n    (keypress)=\"keypress($event)\"\n    #password=\"matInput\"\n  />\n  @if (showPassword()) {\n  <kms-icon\n    class=\"kms-time-input__suffix\"\n    matSuffix\n    icon=\"ic_eye\"\n    [size]=\"IconSizePx.XS\"\n    (click)=\"showPassword.set(false)\"\n    (mousedown)=\"eyeIconIsBeingPressed.set(true)\"\n    (mouseup)=\"eyeIconIsBeingPressed.set(false)\"\n  ></kms-icon>\n  } @else {\n  <kms-icon\n    class=\"kms-time-input__suffix\"\n    matSuffix\n    icon=\"ic_eye_active\"\n    [size]=\"IconSizePx.XS\"\n    (click)=\"showPassword.set(true)\"\n    (mousedown)=\"eyeIconIsBeingPressed.set(true)\"\n    (mouseup)=\"eyeIconIsBeingPressed.set(false)\"\n  ></kms-icon>\n  }\n</mat-form-field>\n\n@if ((eyeIconIsBeingPressed() || password.focused) && withStrength()) {\n<mat-card appearance=\"outlined\">\n  <mat-card-content class=\"kms-password__card\">\n    <mat-list role=\"list\">\n      @for (validation of validations(); track validation) {\n      <mat-list-item role=\"listitem\">\n        <div class=\"kms-password__strength-item\">\n          @if(validation.isValid()) {\n          <kms-icon\n            [size]=\"IconSizePx.XS\"\n            icon=\"ic_check\"\n            iconClass=\"color-success\"\n          ></kms-icon>\n          }@else {\n          <kms-icon\n            [size]=\"IconSizePx.XS\"\n            icon=\"ic_abbrechen\"\n            iconClass=\"color-warn\"\n          ></kms-icon>\n          } {{ validation.text() }}\n        </div></mat-list-item\n      >\n      }\n    </mat-list>\n  </mat-card-content>\n</mat-card>\n}\n", dependencies: [{ kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i3$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i3$4.MatList, selector: "mat-list", exportAs: ["matList"] }, { kind: "component", type: i3$4.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }, { kind: "component", type: i4$1.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i4$1.MatCardContent, selector: "mat-card-content" }, { kind: "component", type: IconComponent, selector: "kms-icon", inputs: ["icon", "iconClass", "size", "dontUseSprite", "color"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: PasswordComponent, decorators: [{
             type: Component,
@@ -3041,7 +3041,7 @@ class SalutationDropdownComponent extends FormControlParentComponent {
                 useExisting: forwardRef(() => SalutationDropdownComponent),
                 multi: true,
             },
-        ], usesInheritance: true, ngImport: i0, template: "<form [formGroup]=\"form\" class=\"row\">\n  <mat-form-field class=\"col\">\n    <mat-select\n      disableOptionCentering\n      formControlName=\"salut\"\n      [placeholder]=\"placeholder\"\n      [value]=\"value\"\n      #child\n    >\n      <mat-option [value]=\"SalutationEnum.NOT_SPECIFIED\">{{\n        'general.salutation.' + Object.keys(SalutationEnum)[0]?.toLowerCase()\n          | translate\n      }}</mat-option>\n      <mat-option [value]=\"SalutationEnum.MALE\">{{\n        'general.salutation.' + Object.keys(SalutationEnum)[1]?.toLowerCase()\n          | translate\n      }}</mat-option>\n      <mat-option [value]=\"SalutationEnum.FEMALE\">{{\n        'general.salutation.' + Object.keys(SalutationEnum)[2]?.toLowerCase()\n          | translate\n      }}</mat-option>\n    </mat-select>\n  </mat-form-field>\n</form>\n", dependencies: [{ kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "component", type: i3.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "pipe", type: i4$1.TranslatePipe, name: "translate" }] }); }
+        ], usesInheritance: true, ngImport: i0, template: "<form [formGroup]=\"form\" class=\"row\">\n  <mat-form-field class=\"col\">\n    <mat-select\n      disableOptionCentering\n      formControlName=\"salut\"\n      [placeholder]=\"placeholder\"\n      [value]=\"value\"\n      #child\n    >\n      <mat-option [value]=\"SalutationEnum.NOT_SPECIFIED\">{{\n        'general.salutation.' + Object.keys(SalutationEnum)[0]?.toLowerCase()\n          | translate\n      }}</mat-option>\n      <mat-option [value]=\"SalutationEnum.MALE\">{{\n        'general.salutation.' + Object.keys(SalutationEnum)[1]?.toLowerCase()\n          | translate\n      }}</mat-option>\n      <mat-option [value]=\"SalutationEnum.FEMALE\">{{\n        'general.salutation.' + Object.keys(SalutationEnum)[2]?.toLowerCase()\n          | translate\n      }}</mat-option>\n    </mat-select>\n  </mat-form-field>\n</form>\n", dependencies: [{ kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "component", type: i3.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "pipe", type: i1$8.TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: SalutationDropdownComponent, decorators: [{
             type: Component,
@@ -3131,7 +3131,7 @@ class SalutationRadiogroupComponent extends FormControlParentComponent {
                 useExisting: forwardRef(() => SalutationRadiogroupComponent),
                 multi: true,
             },
-        ], usesInheritance: true, ngImport: i0, template: "<form [formGroup]=\"form\">\n  <mat-radio-group formControlName=\"salut\" [disabled]=\"disabled\" #radioGroup>\n    <mat-radio-button\n      color=\"primary\"\n      [value]=\"SalutationEnum.NOT_SPECIFIED\"\n      [checked]=\"value === SalutationEnum.NOT_SPECIFIED\"\n    >\n      {{\n        'general.salutation.' + Object.keys(SalutationEnum)[0]?.toLowerCase()\n          | translate\n      }}\n    </mat-radio-button>\n    <mat-radio-button\n      color=\"primary\"\n      [value]=\"SalutationEnum.MALE\"\n      [checked]=\"value === SalutationEnum.MALE\"\n    >\n      {{\n        'general.salutation.' + Object.keys(SalutationEnum)[1]?.toLowerCase()\n          | translate\n      }}\n    </mat-radio-button>\n    <mat-radio-button\n      color=\"primary\"\n      [value]=\"SalutationEnum.FEMALE\"\n      [checked]=\"value === SalutationEnum.FEMALE\"\n    >\n      {{\n        'general.salutation.' + Object.keys(SalutationEnum)[2]?.toLowerCase()\n          | translate\n      }}\n    </mat-radio-button>\n  </mat-radio-group>\n</form>\n", dependencies: [{ kind: "directive", type: i1$5.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i1$5.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i4$1.TranslatePipe, name: "translate" }] }); }
+        ], usesInheritance: true, ngImport: i0, template: "<form [formGroup]=\"form\">\n  <mat-radio-group formControlName=\"salut\" [disabled]=\"disabled\" #radioGroup>\n    <mat-radio-button\n      color=\"primary\"\n      [value]=\"SalutationEnum.NOT_SPECIFIED\"\n      [checked]=\"value === SalutationEnum.NOT_SPECIFIED\"\n    >\n      {{\n        'general.salutation.' + Object.keys(SalutationEnum)[0]?.toLowerCase()\n          | translate\n      }}\n    </mat-radio-button>\n    <mat-radio-button\n      color=\"primary\"\n      [value]=\"SalutationEnum.MALE\"\n      [checked]=\"value === SalutationEnum.MALE\"\n    >\n      {{\n        'general.salutation.' + Object.keys(SalutationEnum)[1]?.toLowerCase()\n          | translate\n      }}\n    </mat-radio-button>\n    <mat-radio-button\n      color=\"primary\"\n      [value]=\"SalutationEnum.FEMALE\"\n      [checked]=\"value === SalutationEnum.FEMALE\"\n    >\n      {{\n        'general.salutation.' + Object.keys(SalutationEnum)[2]?.toLowerCase()\n          | translate\n      }}\n    </mat-radio-button>\n  </mat-radio-group>\n</form>\n", dependencies: [{ kind: "directive", type: i1$5.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i1$5.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i1$8.TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: SalutationRadiogroupComponent, decorators: [{
             type: Component,
@@ -3449,6 +3449,7 @@ class GenericFormService {
         this.translate = translate;
         this.fieldConfigs = new Map(); // key → FieldConfig
         this.asyncValidatorMap = new Map(); // key → async validators
+        this.validatorMap = new Map(); // key → sync validators with error messages
         this.destroy$ = new Subject();
         this._submitted = false;
     }
@@ -3458,6 +3459,7 @@ class GenericFormService {
         this.config = config;
         this.fieldConfigs.clear();
         this.asyncValidatorMap.clear();
+        this.validatorMap.clear();
         this._submitted = false;
         const controls = {};
         for (const section of config.sections) {
@@ -3468,32 +3470,60 @@ class GenericFormService {
         this.form = new FormGroup(controls);
         return this.form;
     }
+    isValidatorConfig(v) {
+        return typeof v === 'object' && 'validator' in v;
+    }
     buildFieldControl(field, controls) {
         if (field.type === FieldType.OFFSET || !field.key)
             return;
         this.fieldConfigs.set(field.key, field);
-        const asyncFns = (field.asyncValidators ?? []).map((a) => a.validator);
-        if (field.asyncValidators?.length) {
-            this.asyncValidatorMap.set(field.key, field.asyncValidators);
-        }
+        const syncFns = this.registerSyncValidators(field);
+        const asyncFns = this.registerAsyncValidators(field);
         const initial = this.resolveInitialValue(field.type);
         const control = new FormControl(initial, {
-            validators: field.validators ?? [],
+            validators: syncFns.length ? syncFns : undefined,
             asyncValidators: asyncFns.length ? asyncFns : undefined,
         });
         if (field.hidden || field.disabled) {
             control.disable();
         }
         controls[field.key] = control;
-        if (field.type === FieldType.DATE_RANGE && field.options) {
-            const opts = field.options;
-            if (opts.startKey && !controls[opts.startKey]) {
-                controls[opts.startKey] = new FormControl(null);
+        this.buildDateRangeSubControls(field, controls);
+    }
+    registerSyncValidators(field) {
+        const syncFns = [];
+        const syncConfigs = [];
+        for (const v of field.validators ?? []) {
+            if (this.isValidatorConfig(v)) {
+                syncFns.push(v.validator);
+                syncConfigs.push(v);
             }
-            if (opts.endKey && !controls[opts.endKey]) {
-                controls[opts.endKey] = new FormControl(null);
+            else {
+                syncFns.push(v);
             }
         }
+        if (syncConfigs.length) {
+            this.validatorMap.set(field.key, syncConfigs);
+        }
+        return syncFns;
+    }
+    registerAsyncValidators(field) {
+        const asyncFns = (field.asyncValidators ?? []).map((a) => a.validator);
+        if (field.asyncValidators?.length) {
+            this.asyncValidatorMap.set(field.key, field.asyncValidators);
+        }
+        return asyncFns;
+    }
+    buildDateRangeSubControls(field, controls) {
+        if (field.type !== FieldType.DATE_RANGE || !field.options)
+            return;
+        const opts = field.options;
+        if (opts.startKey && !controls[opts.startKey]) {
+            controls[opts.startKey] = new FormControl(null);
+        }
+        if (opts.endKey && !controls[opts.endKey]) {
+            controls[opts.endKey] = new FormControl(null);
+        }
     }
     resolveInitialValue(type) {
         switch (type) {
@@ -3509,7 +3539,7 @@ class GenericFormService {
     patchValue(value, options) {
         if (!this.form)
             return;
-        const emitEvent = !(options?.silent);
+        const emitEvent = !options?.silent;
         this.form.patchValue(value, { emitEvent });
     }
     // --- Validate ---
@@ -3582,7 +3612,10 @@ class GenericFormService {
         const fieldConfig = this.fieldConfigs.get(key);
         if (!fieldConfig)
             return;
-        fieldConfig.options = { ...fieldConfig.options, ...options };
+        fieldConfig.options = {
+            ...fieldConfig.options,
+            ...options,
+        };
     }
     getFieldConfig(key) {
         return this.fieldConfigs.get(key);
@@ -3614,26 +3647,32 @@ class GenericFormService {
         if (validatorMeta?.message) {
             return validatorMeta.message;
         }
-        // 2. Async validator with pre-translated errorMessage
+        // 2. Sync validator with pre-translated errorMessage (ValidatorConfig)
+        const syncConfigs = this.validatorMap.get(key);
+        if (syncConfigs) {
+            for (const sc of syncConfigs) {
+                const testResult = sc.validator({ value: null });
+                if (testResult && validatorName in testResult) {
+                    return sc.errorMessage;
+                }
+            }
+        }
+        // 3. Async validator with pre-translated errorMessage
         const asyncConfigs = this.asyncValidatorMap.get(key);
         if (asyncConfigs) {
             for (const ac of asyncConfigs) {
-                // Match async validator by checking if the validator name is in the error keys
-                // Async validators typically set the error key matching their name
                 if (ac.errorMessage) {
-                    // If there's only one async validator, use its message
-                    // Otherwise, we can't disambiguate — return the first
                     return ac.errorMessage;
                 }
             }
         }
-        // 3. Translate via @ngx-translate
+        // 4. Translate via @ngx-translate
         const translationKey = `uiPresentational.validatorMessages.${validatorName}`;
         const translated = this.translate.instant(translationKey, validatorMeta);
         if (translated !== translationKey) {
             return translated;
         }
-        // 4. Fallback — validator key
+        // 5. Fallback — validator key
         return validatorName;
     }
     // --- Cleanup ---
@@ -3646,12 +3685,12 @@ class GenericFormService {
         this.destroy$.next();
         this.destroy$.complete();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GenericFormService, deps: [{ token: i4$1.TranslateService }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GenericFormService, deps: [{ token: i1$8.TranslateService }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GenericFormService }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GenericFormService, decorators: [{
             type: Injectable
-        }], ctorParameters: () => [{ type: i4$1.TranslateService }] });
+        }], ctorParameters: () => [{ type: i1$8.TranslateService }] });
 
 const DEFAULT_REGISTRY = new Map([
     [FieldType.PASSWORD, PasswordComponent],
@@ -4762,6 +4801,72 @@ function noSpecialCharsOnly() {
     };
 }
 
+/**
+ * Pre-translated validation error messages for all supported locales.
+ * Merged into @ngx-translate via `GenericFormModule` constructor under
+ * the key path `uiPresentational.validatorMessages.<validatorName>`.
+ *
+ * Interpolation placeholders (e.g. `{{requiredLength}}`) match the metadata
+ * objects Angular validators attach to `ValidationErrors`.
+ */
+const KMS_ERROR_MESSAGES = {
+    en: {
+        required: 'This field is required.',
+        minlength: 'Minimum {{requiredLength}} characters required.',
+        maxlength: 'Maximum {{requiredLength}} characters allowed.',
+        min: 'Value must be at least {{min}}.',
+        max: 'Value must be at most {{max}}.',
+        email: 'Please enter a valid email address.',
+        pattern: 'The value does not match the required format.',
+        whitespaceOnly: 'Must not contain only whitespace.',
+        specialCharsOnly: 'Must contain at least one letter or number.',
+    },
+    'en-uk': {
+        required: 'This field is required.',
+        minlength: 'Minimum {{requiredLength}} characters required.',
+        maxlength: 'Maximum {{requiredLength}} characters allowed.',
+        min: 'Value must be at least {{min}}.',
+        max: 'Value must be at most {{max}}.',
+        email: 'Please enter a valid email address.',
+        pattern: 'The value does not match the required format.',
+        whitespaceOnly: 'Must not contain only whitespace.',
+        specialCharsOnly: 'Must contain at least one letter or number.',
+    },
+    de: {
+        required: 'Dieses Feld ist erforderlich.',
+        minlength: 'Mindestens {{requiredLength}} Zeichen erforderlich.',
+        maxlength: 'Maximal {{requiredLength}} Zeichen erlaubt.',
+        min: 'Der Wert muss mindestens {{min}} betragen.',
+        max: 'Der Wert darf h\u00f6chstens {{max}} betragen.',
+        email: 'Bitte geben Sie eine g\u00fcltige E-Mail-Adresse ein.',
+        pattern: 'Der Wert entspricht nicht dem erforderlichen Format.',
+        whitespaceOnly: 'Darf nicht nur aus Leerzeichen bestehen.',
+        specialCharsOnly: 'Muss mindestens einen Buchstaben oder eine Zahl enthalten.',
+    },
+    'de-de': {
+        required: 'Dieses Feld ist erforderlich.',
+        minlength: 'Mindestens {{requiredLength}} Zeichen erforderlich.',
+        maxlength: 'Maximal {{requiredLength}} Zeichen erlaubt.',
+        min: 'Der Wert muss mindestens {{min}} betragen.',
+        max: 'Der Wert darf h\u00f6chstens {{max}} betragen.',
+        email: 'Bitte geben Sie eine g\u00fcltige E-Mail-Adresse ein.',
+        pattern: 'Der Wert entspricht nicht dem erforderlichen Format.',
+        whitespaceOnly: 'Darf nicht nur aus Leerzeichen bestehen.',
+        specialCharsOnly: 'Muss mindestens einen Buchstaben oder eine Zahl enthalten.',
+    },
+    'de-ch': {
+        required: 'Dieses Feld ist erforderlich.',
+        minlength: 'Mindestens {{requiredLength}} Zeichen erforderlich.',
+        maxlength: 'Maximal {{requiredLength}} Zeichen erlaubt.',
+        min: 'Der Wert muss mindestens {{min}} betragen.',
+        max: 'Der Wert darf h\u00f6chstens {{max}} betragen.',
+        email: 'Bitte geben Sie eine g\u00fcltige E-Mail-Adresse ein.',
+        pattern: 'Der Wert entspricht nicht dem erforderlichen Format.',
+        whitespaceOnly: 'Darf nicht nur aus Leerzeichen bestehen.',
+        specialCharsOnly: 'Muss mindestens einen Buchstaben oder eine Zahl enthalten.',
+    },
+};
+
 /**
  * Lightweight facade module for the generic-form feature.
  *
@@ -4778,7 +4883,34 @@ function noSpecialCharsOnly() {
  * ```
  */
 class GenericFormModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GenericFormModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    constructor(translate) {
+        // Re-merge library error messages whenever the app loads/changes language.
+        // The app's HTTP loader calls setTranslation() without merge, which
+        // overwrites the store — this subscriber re-merges library messages on top.
+        //
+        // NOTE: We intentionally do NOT merge upfront for all languages, because
+        // that would make ngx-translate skip the HTTP loader (it thinks translations
+        // are already cached), breaking the app's own translations.
+        // Merge immediately if a language is already active (e.g. APP_INITIALIZER
+        // called translate.use() before this module was instantiated).
+        const currentLang = translate.currentLang || translate.defaultLang;
+        if (currentLang) {
+            this.mergeMessages(translate, currentLang);
+        }
+        translate.onLangChange.subscribe((event) => {
+            this.mergeMessages(translate, event.lang);
+        });
+    }
+    mergeMessages(translate, lang) {
+        const key = lang.toLowerCase();
+        const messages = KMS_ERROR_MESSAGES[key] ??
+            KMS_ERROR_MESSAGES[key.split('-')[0]] ??
+            KMS_ERROR_MESSAGES['en'];
+        if (messages) {
+            translate.setTranslation(lang, { uiPresentational: { validatorMessages: messages } }, true);
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GenericFormModule, deps: [{ token: i1$8.TranslateService }], target: i0.ɵɵFactoryTarget.NgModule }); }
     static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.16", ngImport: i0, type: GenericFormModule, imports: [TranslateModule] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: GenericFormModule, providers: [FieldRegistryService], imports: [TranslateModule] }); }
 }
@@ -4788,7 +4920,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                     imports: [TranslateModule],
                     providers: [FieldRegistryService],
                 }]
-        }] });
+        }], ctorParameters: () => [{ type: i1$8.TranslateService }] });
 
 /** Form layout mode. Currently only GRID is implemented. */
 var FormLayout;