Pull request #277: - Ersatt alla digi-ng-form-input med ui-input

Merge in TEA/mina-sidor-fa-web from feature/TV-846-digi-ng-form-input to develop

Squashed commit of the following:

commit 80b2e4c19eefa9088767200d191785ce4bd84612
Merge: 4a8dc925 d307bd13
Author: WP\holno <nikola.holst-nikolic@arbetsformedlingen.se>
Date:   Wed Nov 24 11:17:16 2021 +0100

    Merge branch 'develop' into feature/TV-846-digi-ng-form-input

commit 4a8dc9255789a3991b6eab2795c28f58a1276ed6
Merge: 5feff43a eeb02c0e
Author: WP\holno <nikola.holst-nikolic@arbetsformedlingen.se>
Date:   Tue Nov 23 14:56:07 2021 +0100

    Merge branch 'develop' into feature/TV-846-digi-ng-form-input

commit 5feff43a48eb6553ba7d963b530969ae584db938
Author: WP\holno <nikola.holst-nikolic@arbetsformedlingen.se>
Date:   Tue Nov 23 14:55:56 2021 +0100

    - Ersatt alla digi-ng-form-input med ui-input
    - Använt ui-inputs egna validation-message där validation-message används tillsammans
    - La till onBlur som emittar uiOnBlur för att trigga touched på ui-input som annars enbart blev touched på submit där markAllAsTouched körs.

libs/ui/src/input/input.component.html

@@ -14,6 +14,7 @@
     [afValue]="currentValue"
     [afValidation]="uiInvalid ? 'error' : 'neutral'"
     (afOnInput)="checkForChange($event.detail.target.value)"
+    (afOnBlur)="onBlur()"
   ></digi-form-input>
   <ui-validation-message
     [uiShowValidationMessage]="uiInvalid && uiValidationMessage"

libs/ui/src/input/input.component.ts

@@ -47,6 +47,7 @@ export class InputComponent implements AfterViewInit, ControlValueAccessor, OnCh
   @Input() uiInvalid: boolean;
   @Input() uiValidationMessage: string;
   @Output() uiOnChange: EventEmitter<any> = new EventEmitter();
+  @Output() uiOnBlur: EventEmitter<any> = new EventEmitter();
 
   name: string | number;
 
@@ -85,6 +86,10 @@ export class InputComponent implements AfterViewInit, ControlValueAccessor, OnCh
     }
   }
 
+  onBlur(): void {
+    this.uiOnBlur.emit(true);
+  }
+
   writeValue(value: any): void {
     this._value = value;
     this.changeDetectorRef.detectChanges();

libs/ui/src/validation-message/validation-message.component.html

@@ -1,4 +1,4 @@
-<div aria-atomic="true" role="alert">
+<div class="ui-validation-message" aria-atomic="true" role="alert">
   <digi-form-validation-message *ngIf="uiShowValidationMessage" [afVariation]="uiValidationMessageType">
     {{ uiValidationMessage }}
   </digi-form-validation-message>