@ngrdt/forms 0.0.61 → 0.0.63

package/fesm2022/ngrdt-forms.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { inject, Injector, signal, input, model, linkedSignal, booleanAttribute, computed, effect, untracked, Directive, InjectionToken, forwardRef, output, numberAttribute, ElementRef, Pipe } from '@angular/core';
+import { inject, Injector, signal, model, linkedSignal, input, booleanAttribute, computed, effect, untracked, Directive, InjectionToken, forwardRef, output, numberAttribute, ElementRef, Pipe } from '@angular/core';
 import { takeUntilDestroyed, toSignal, toObservable } from '@angular/core/rxjs-interop';
 import { FormControlName, FormControlDirective, NgModel, NgControl, Validators, NG_VALUE_ACCESSOR, FormControl, FormGroup } from '@angular/forms';
 import { RdtInteractiveElementComponent, RdtComponentOutletDirective } from '@ngrdt/core';
@@ -32,13 +32,16 @@ class RdtBaseFormInputComponent extends RdtInteractiveElementComponent {
     injector = inject(Injector);
     _control = signal(null);
     control = this._control.asReadonly();
-    label = input('');
-    placeholder = input('');
-    name = input('');
     externalValue = model(null, { alias: 'value' });
     internalValue = linkedSignal(() => this.toInternalValue(this.externalValue()));
     dataTestIdInput = input(undefined, { alias: 'dataTestId' });
     dataTestId = linkedSignal(() => this.dataTestIdInput() ?? this.label() ?? '');
+    labelInput = input('', { alias: 'label' });
+    label = linkedSignal(() => this.labelInput() ?? '');
+    placeholderInput = input('', { alias: 'placeholder' });
+    placeholder = linkedSignal(() => this.placeholderInput() ?? '');
+    nameInput = input('', { alias: 'name' });
+    name = linkedSignal(() => this.nameInput() ?? '');
     readonlyInput = input(null, {
         alias: 'readonly',
         transform: booleanAttribute,
@@ -70,7 +73,7 @@ class RdtBaseFormInputComponent extends RdtInteractiveElementComponent {
             return control.statusReactive() === 'INVALID';
         }
         else {
-            return false;
+            return !!this.additionalErrors();
         }
     });
     requiredEffect = effect(() => {
@@ -88,7 +91,8 @@ class RdtBaseFormInputComponent extends RdtInteractiveElementComponent {
             return null;
         }
     });
-    errors = computed(() => this.controlErrors() ?? this.requiredError());
+    additionalErrors = signal(null);
+    errors = computed(() => this.controlErrors() ?? this.requiredError() ?? this.additionalErrors());
     visibleErrors = computed(() => this.invalid() && this.touched() ? this.errors() : null);
     get ngControl() {
         return this._ngControl;
@@ -156,6 +160,14 @@ class RdtBaseFormInputComponent extends RdtInteractiveElementComponent {
             this.onChange(externalValue);
         }
     }
+    setAdditionalErrors(errors) {
+        if (errors === null || Object.keys(errors).length === 0) {
+            this.additionalErrors.set(null);
+        }
+        else {
+            this.additionalErrors.set(errors);
+        }
+    }
     listenControlEvents(control) {
         control.events
             .pipe(startWith(null), takeUntilDestroyed(this.destroyRef))
@@ -182,7 +194,7 @@ class RdtBaseFormInputComponent extends RdtInteractiveElementComponent {
     }
     static REQUIRED_ERROR = { required: true };
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: RdtBaseFormInputComponent, deps: null, target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.0.0", type: RdtBaseFormInputComponent, isStandalone: true, inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, externalValue: { classPropertyName: "externalValue", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, dataTestIdInput: { classPropertyName: "dataTestIdInput", publicName: "dataTestId", isSignal: true, isRequired: false, transformFunction: null }, readonlyInput: { classPropertyName: "readonlyInput", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, requiredInput: { classPropertyName: "requiredInput", publicName: "required", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { externalValue: "valueChange" }, usesInheritance: true, ngImport: i0 });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.0.0", type: RdtBaseFormInputComponent, isStandalone: true, inputs: { externalValue: { classPropertyName: "externalValue", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, dataTestIdInput: { classPropertyName: "dataTestIdInput", publicName: "dataTestId", isSignal: true, isRequired: false, transformFunction: null }, labelInput: { classPropertyName: "labelInput", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholderInput: { classPropertyName: "placeholderInput", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, nameInput: { classPropertyName: "nameInput", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, readonlyInput: { classPropertyName: "readonlyInput", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, requiredInput: { classPropertyName: "requiredInput", publicName: "required", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { externalValue: "valueChange" }, usesInheritance: true, ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: RdtBaseFormInputComponent, decorators: [{
             type: Directive,