@klippa/ngx-enhancy-forms 18.25.7 → 18.26.0

package/fesm2022/klippa-ngx-enhancy-forms.mjs

@@ -165,6 +165,7 @@ class FormComponent {
         this.showErrorMessages = true;
         this.errorMessageLocation = 'belowCaption';
         this.warnings = new Map();
+        this.immutableValues = new Map();
         this.errors = new Map();
         this.allowSubmitOn = 'buttonAndEnter';
         this.onInjected = new EventEmitter();
@@ -213,6 +214,15 @@ class FormComponent {
         if (simpleChanges.readOnly?.currentValue === true) {
             this.activeControls.forEach(e => e.formControl.disable());
         }
+        if (isValueSet(simpleChanges.immutableValues?.currentValue)) {
+            simpleChanges.immutableValues?.previousValue?.forEach((value, key) => {
+                this.getFormElementByFormControl(key)?.getAttachedInput().setImmutableValue(undefined);
+            });
+            simpleChanges.immutableValues?.currentValue.forEach((value, key) => {
+                this.getFormElementByFormControl(key)?.getAttachedInput().setImmutableValue(value);
+            });
+            this.patchImmutableValuesMap();
+        }
         if (isValueSet(simpleChanges.warnings?.currentValue)) {
             this.patchFormWarningsMap();
         }
@@ -236,6 +246,25 @@ class FormComponent {
             }
         }
     }
+    patchImmutableValuesMap() {
+        const setFn = this.immutableValues.set;
+        this.immutableValues.set = (key, value) => {
+            console.log('calling set', key, value);
+            const prevVal = this.immutableValues.get(key);
+            const result = setFn.call(this.immutableValues, key, value);
+            if (prevVal !== value) {
+                console.log('setting immutable value', key, value);
+                this.getFormElementByFormControl(key)?.getAttachedInput().setImmutableValue(value);
+            }
+            return result;
+        };
+        const deleteFn = this.immutableValues.delete;
+        this.immutableValues.delete = (key) => {
+            const result = deleteFn.call(this.immutableValues, key);
+            this.getFormElementByFormControl(key)?.getAttachedInput().setImmutableValue(undefined);
+            return result;
+        };
+    }
     patchFormWarningsMap() {
         const setFn = this.warnings.set;
         this.warnings.set = (key, value) => {
@@ -299,6 +328,10 @@ class FormComponent {
                 enableFn.call(formControl, opts);
             }
         };
+        const value = this.immutableValues?.get(formControl);
+        if (isValueSet(value)) {
+            formElement.getAttachedInput().setImmutableValue(value);
+        }
     }
     unregisterControl(formControl) {
         this.activeControls = this.activeControls.filter((e) => e.formControl !== formControl);
@@ -444,7 +477,7 @@ class FormComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: FormComponent, deps: [{ token: FormComponent, optional: true, skipSelf: true }, { token: SubFormDirective, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.0", type: FormComponent, selector: "klp-form", inputs: { readOnly: "readOnly", showErrorMessages: "showErrorMessages", errorMessageLocation: "errorMessageLocation", formGroup: "formGroup", formArray: "formArray", warnings: "warnings", errors: "errors", patchValueInterceptor: "patchValueInterceptor", allowSubmitOn: "allowSubmitOn" }, outputs: { onInjected: "onInjected" }, usesOnChanges: true, ngImport: i0, template: "<form>\n\t<ng-content></ng-content>\n</form>\n\n\n", styles: [":host{display:block}:host.row{display:flex}:host form{height:inherit}\n"], dependencies: [{ kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.0", type: FormComponent, selector: "klp-form", inputs: { readOnly: "readOnly", showErrorMessages: "showErrorMessages", errorMessageLocation: "errorMessageLocation", formGroup: "formGroup", formArray: "formArray", warnings: "warnings", immutableValues: "immutableValues", errors: "errors", patchValueInterceptor: "patchValueInterceptor", allowSubmitOn: "allowSubmitOn" }, outputs: { onInjected: "onInjected" }, usesOnChanges: true, ngImport: i0, template: "<form>\n\t<ng-content></ng-content>\n</form>\n\n\n", styles: [":host{display:block}:host.row{display:flex}:host form{height:inherit}\n"], dependencies: [{ kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: FormComponent, decorators: [{
             type: Component,
@@ -467,6 +500,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImpor
                 type: Input
             }], warnings: [{
                 type: Input
+            }], immutableValues: [{
+                type: Input
             }], errors: [{
                 type: Input
             }], patchValueInterceptor: [{
@@ -626,8 +661,8 @@ class FormElementComponent {
     }
     registerControl(formControl, input = null) {
         this.attachedControl = formControl;
-        this.parent.registerControl(formControl, this);
         this.input = input;
+        this.parent.registerControl(formControl, this);
         const subscription = this.attachedControl.statusChanges.subscribe(() => {
             this.determinePopupState();
         });
@@ -880,6 +915,7 @@ class ValueAccessorBase {
         this.changed = new Array();
         this.touched = new Array();
         this.prevValue = null;
+        this.immutableValue = undefined;
         this.disabled = false;
         // we support both providing just the formControlName and the full formControl
         this.formControlName = null;
@@ -922,6 +958,12 @@ class ValueAccessorBase {
             this.parent?.registerControl(this.attachedFormControl, this);
         }
     }
+    setImmutableValue(value) {
+        this.immutableValue = value;
+        if (value !== undefined) {
+            this.writeValue(value);
+        }
+    }
     isInErrorState() {
         if (this.inErrorState) {
             return true;
@@ -938,8 +980,13 @@ class ValueAccessorBase {
         this.onTouch.emit();
     }
     writeValue(value) {
-        this.innerValue = value;
         this.prevValue = value;
+        if (this.immutableValue !== undefined) {
+            this.innerValue = this.immutableValue;
+        }
+        else {
+            this.innerValue = value;
+        }
     }
     registerOnChange(fn) {
         this.changed.push(fn);
@@ -949,9 +996,15 @@ class ValueAccessorBase {
     }
     setInnerValueAndNotify(value) {
         const actuallySetValue = (valueToSet) => {
-            this.innerValue = valueToSet;
             this.prevValue = valueToSet;
-            this.changed.forEach((fn) => fn(valueToSet));
+            if (this.immutableValue !== undefined) {
+                this.innerValue = this.immutableValue;
+                this.changed.forEach((fn) => fn(this.immutableValue));
+            }
+            else {
+                this.innerValue = valueToSet;
+                this.changed.forEach((fn) => fn(valueToSet));
+            }
         };
         if (isValueSet(this.innerValueChangeInterceptor)) {
             this.latestInnerValueChangedInterceptorPromise = this.innerValueChangeInterceptor(this.prevValue, value);
@@ -1984,6 +2037,8 @@ class DateTimePickerComponent extends MultipleValueAccessorBase {
         this.format = 'dd-MM-yyyy';
         this.clearable = false;
         this.showTimeInput = true;
+        this.initHour = null;
+        this.initMinute = null;
         this.invalidTimeAsMidnight = false; // if the time is not valid, use 00:00 as the time
         this.openPickerOnDate = null;
         this.minDateStartOfDay = undefined;
@@ -2014,6 +2069,8 @@ class DateTimePickerComponent extends MultipleValueAccessorBase {
             this.placeholder = '';
             this.showTimeInput = false;
         }
+        this.hours = this.initHour;
+        this.minutes = this.initMinute;
     }
     ngAfterViewInit() {
         if (this.multiple) {
@@ -2172,8 +2229,8 @@ class DateTimePickerComponent extends MultipleValueAccessorBase {
                 this.openPickerOnDate = value;
             }
             else {
-                this.hours = '';
-                this.minutes = '';
+                this.hours = this.initHour ?? '';
+                this.minutes = this.initMinute ?? '';
                 this.openPickerOnDate = null;
                 this.selectedDates = [];
             }
@@ -2246,7 +2303,7 @@ class DateTimePickerComponent extends MultipleValueAccessorBase {
         return this.translations?.[key]?.(params) ?? this.getDefaultTranslation(key)(params);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: DateTimePickerComponent, deps: [{ token: FormElementComponent, host: true, optional: true }, { token: i2.ControlContainer, host: true, optional: true }, { token: DATE_TIME_PICKER_TRANSLATIONS, optional: true }, { token: DATE_PICKER_LOCALE, optional: true }, { token: i3.DateAdapter }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.0", type: DateTimePickerComponent, selector: "klp-form-date-time-picker", inputs: { minDate: "minDate", maxDate: "maxDate", sameMonthOnly: "sameMonthOnly", format: "format", placeholder: "placeholder", clearable: "clearable", showTimeInput: "showTimeInput", invalidTimeAsMidnight: "invalidTimeAsMidnight" }, providers: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.0", type: DateTimePickerComponent, selector: "klp-form-date-time-picker", inputs: { minDate: "minDate", maxDate: "maxDate", sameMonthOnly: "sameMonthOnly", format: "format", placeholder: "placeholder", clearable: "clearable", showTimeInput: "showTimeInput", initHour: "initHour", initMinute: "initMinute", invalidTimeAsMidnight: "invalidTimeAsMidnight" }, providers: [
             { provide: NG_VALUE_ACCESSOR, useExisting: DateTimePickerComponent, multi: true },
             {
                 provide: MAT_DATE_FORMATS,
@@ -2297,6 +2354,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImpor
                 type: Input
             }], showTimeInput: [{
                 type: Input
+            }], initHour: [{
+                type: Input
+            }], initMinute: [{
+                type: Input
             }], invalidTimeAsMidnight: [{
                 type: Input
             }], nativeInputRef: [{
@@ -2372,7 +2433,7 @@ class DatePickerComponent extends MultipleValueAccessorBase {
         return this.translations?.[key]?.(params) ?? this.getDefaultTranslation(key)(params);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: DatePickerComponent, deps: [{ token: FormElementComponent, host: true, optional: true }, { token: i2.ControlContainer, host: true, optional: true }, { token: DATE_PICKER_TRANSLATIONS, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.0", type: DatePickerComponent, selector: "klp-form-date-picker", inputs: { minDate: "minDate", maxDate: "maxDate", sameMonthOnly: "sameMonthOnly", format: "format", placeholder: "placeholder", clearable: "clearable" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: DatePickerComponent, multi: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"componentContainer\" [ngClass]=\"{showErrors: isInErrorState()}\">\n\t<klp-form-date-time-picker\n\t\t[multiple]=\"multiple\"\n\t\t[disabled]=\"disabled\"\n\t\t[(ngModel)]=\"dateValue\"\n\t\t(ngModelChange)=\"dateChanged($event)\"\n\t\t[minDate]=\"minDate\"\n\t\t[maxDate]=\"maxDate\"\n\t\t[sameMonthOnly]=\"sameMonthOnly\"\n\t\t[format]=\"format\"\n\t\t[placeholder]=\"getTranslation('placeholder')\"\n\t\t[clearable]=\"clearable\"\n\t\t[showTimeInput]=\"false\"\n\t\t(onTouch)=\"touch()\"\n\t></klp-form-date-time-picker>\n\t<div class=\"tail\">\n\t\t<ng-container [ngTemplateOutlet]=\"getTailTpl()\"></ng-container>\n\t</div>\n</div>\n", styles: [":host{display:block;--mdc-icon-button-icon-size: 18px}.componentContainer{position:relative}.componentContainer ::ng-deep .mdc-text-field__input::placeholder{color:#aaa!important}.componentContainer.showErrors ::ng-deep klp-form-date-time-picker .dateContainer,.componentContainer.showErrors ::ng-deep klp-form-date-time-picker .clearButton{border-color:#ff8000}.tail{position:absolute;right:.625rem;display:flex;align-items:center;top:0;bottom:0}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: DateTimePickerComponent, selector: "klp-form-date-time-picker", inputs: ["minDate", "maxDate", "sameMonthOnly", "format", "placeholder", "clearable", "showTimeInput", "invalidTimeAsMidnight"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.0", type: DatePickerComponent, selector: "klp-form-date-picker", inputs: { minDate: "minDate", maxDate: "maxDate", sameMonthOnly: "sameMonthOnly", format: "format", placeholder: "placeholder", clearable: "clearable" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: DatePickerComponent, multi: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"componentContainer\" [ngClass]=\"{showErrors: isInErrorState()}\">\n\t<klp-form-date-time-picker\n\t\t[multiple]=\"multiple\"\n\t\t[disabled]=\"disabled\"\n\t\t[(ngModel)]=\"dateValue\"\n\t\t(ngModelChange)=\"dateChanged($event)\"\n\t\t[minDate]=\"minDate\"\n\t\t[maxDate]=\"maxDate\"\n\t\t[sameMonthOnly]=\"sameMonthOnly\"\n\t\t[format]=\"format\"\n\t\t[placeholder]=\"getTranslation('placeholder')\"\n\t\t[clearable]=\"clearable\"\n\t\t[showTimeInput]=\"false\"\n\t\t(onTouch)=\"touch()\"\n\t></klp-form-date-time-picker>\n\t<div class=\"tail\">\n\t\t<ng-container [ngTemplateOutlet]=\"getTailTpl()\"></ng-container>\n\t</div>\n</div>\n", styles: [":host{display:block;--mdc-icon-button-icon-size: 18px}.componentContainer{position:relative}.componentContainer ::ng-deep .mdc-text-field__input::placeholder{color:#aaa!important}.componentContainer.showErrors ::ng-deep klp-form-date-time-picker .dateContainer,.componentContainer.showErrors ::ng-deep klp-form-date-time-picker .clearButton{border-color:#ff8000}.tail{position:absolute;right:.625rem;display:flex;align-items:center;top:0;bottom:0}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: DateTimePickerComponent, selector: "klp-form-date-time-picker", inputs: ["minDate", "maxDate", "sameMonthOnly", "format", "placeholder", "clearable", "showTimeInput", "initHour", "initMinute", "invalidTimeAsMidnight"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: DatePickerComponent, decorators: [{
             type: Component,
@@ -2826,6 +2887,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImpor
                 type: Input
             }] } });
 
+class TextAreaComponent extends ValueAccessorBase {
+    constructor() {
+        super(...arguments);
+        this.onBlur = new EventEmitter();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: TextAreaComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.0", type: TextAreaComponent, selector: "klp-form-text-area", inputs: { placeholder: "placeholder" }, outputs: { onBlur: "onBlur" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: TextAreaComponent, multi: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"componentContainer\">\n\t<textarea\n\t\t[(ngModel)]=\"innerValue\"\n\t\t[ngClass]=\"{showErrors: isInErrorState()}\"\n\t\t(input)=\"setInnerValueAndNotify($event.target.value)\"\n\t\t[placeholder]=\"placeholder ? placeholder : ''\"\n\t\t(blur)=\"touch(); onBlur.emit()\"\n\t\t[disabled]='disabled'\n\t\t#nativeInputRef\n\t></textarea>\n</div>\n", styles: [":host{display:block}:host input:disabled{cursor:not-allowed}.componentContainer{position:relative}textarea{outline:none;display:block;border:1px solid #e6ecf5;border-radius:2px;box-shadow:none;height:42px;width:100%;padding:.375rem .625rem;font-size:14px;color:#888da8;transition:all .2s ease-in;-webkit-transition:all .2s ease-in;-moz-transition:all .2s ease-in;-o-transition:all .2s ease-in;-ms-transition:all .2s ease-in}textarea::-webkit-input-placeholder{color:#adadad}textarea:-moz-placeholder{color:#adadad}textarea::-moz-placeholder{color:#adadad}textarea:-ms-input-placeholder{color:#adadad}textarea:focus{outline:0 none;box-shadow:none;border-color:#3ed778}textarea.input-sm{height:30px}textarea.input-lg{height:50px}textarea.error{border-color:#dc3545;background-color:#f6cdd1}textarea.valid{border-color:#37c936;background-color:#ebfaeb;color:#278d26}textarea:placeholder-shown{text-overflow:ellipsis}.showErrors{border-color:#ff8000}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: TextAreaComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'klp-form-text-area', providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: TextAreaComponent, multi: true }], template: "<div class=\"componentContainer\">\n\t<textarea\n\t\t[(ngModel)]=\"innerValue\"\n\t\t[ngClass]=\"{showErrors: isInErrorState()}\"\n\t\t(input)=\"setInnerValueAndNotify($event.target.value)\"\n\t\t[placeholder]=\"placeholder ? placeholder : ''\"\n\t\t(blur)=\"touch(); onBlur.emit()\"\n\t\t[disabled]='disabled'\n\t\t#nativeInputRef\n\t></textarea>\n</div>\n", styles: [":host{display:block}:host input:disabled{cursor:not-allowed}.componentContainer{position:relative}textarea{outline:none;display:block;border:1px solid #e6ecf5;border-radius:2px;box-shadow:none;height:42px;width:100%;padding:.375rem .625rem;font-size:14px;color:#888da8;transition:all .2s ease-in;-webkit-transition:all .2s ease-in;-moz-transition:all .2s ease-in;-o-transition:all .2s ease-in;-ms-transition:all .2s ease-in}textarea::-webkit-input-placeholder{color:#adadad}textarea:-moz-placeholder{color:#adadad}textarea::-moz-placeholder{color:#adadad}textarea:-ms-input-placeholder{color:#adadad}textarea:focus{outline:0 none;box-shadow:none;border-color:#3ed778}textarea.input-sm{height:30px}textarea.input-lg{height:50px}textarea.error{border-color:#dc3545;background-color:#f6cdd1}textarea.valid{border-color:#37c936;background-color:#ebfaeb;color:#278d26}textarea:placeholder-shown{text-overflow:ellipsis}.showErrors{border-color:#ff8000}\n"] }]
+        }], propDecorators: { placeholder: [{
+                type: Input
+            }], onBlur: [{
+                type: Output
+            }] } });
+
 class NgxEnhancyFormsModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: NgxEnhancyFormsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
     static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.0", ngImport: i0, type: NgxEnhancyFormsModule, declarations: [ValueAccessorBase,
@@ -2844,6 +2922,7 @@ class NgxEnhancyFormsModule {
             SortableItemsComponent,
             SortableGroupedItemsComponent,
             TextInputComponent,
+            TextAreaComponent,
             ToggleComponent,
             FileInputComponent,
             FormCaptionComponent,
@@ -2877,6 +2956,7 @@ class NgxEnhancyFormsModule {
             SortableItemsComponent,
             SortableGroupedItemsComponent,
             TextInputComponent,
+            TextAreaComponent,
             ToggleComponent,
             FileInputComponent,
             FormCaptionComponent,
@@ -2923,6 +3003,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImpor
                         SortableItemsComponent,
                         SortableGroupedItemsComponent,
                         TextInputComponent,
+                        TextAreaComponent,
                         ToggleComponent,
                         FileInputComponent,
                         FormCaptionComponent,
@@ -2955,6 +3036,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImpor
                         SortableItemsComponent,
                         SortableGroupedItemsComponent,
                         TextInputComponent,
+                        TextAreaComponent,
                         ToggleComponent,
                         FileInputComponent,
                         FormCaptionComponent,
@@ -2980,5 +3062,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { ButtonComponent, CheckboxComponent, DATE_PICKER_LOCALE, DATE_PICKER_TRANSLATIONS, DATE_TIME_PICKER_TRANSLATIONS, DEFAULT_ERROR_MESSAGES, DatePickerComponent, DateTimePickerComponent, DefaultErrorHandler, ElementIsTruncatedCbComponent, EmailInputComponent, FORM_ERROR_MESSAGES, FileInputComponent, FormCaptionComponent, FormComponent, FormElementComponent, FormErrorComponent, FormSubmitButtonComponent, FormValidationError, HourMinuteInputComponent, KLP_DATE_FORMATS, KLP_FORM_ERROR_HANDLER, KlpSelectOptionTemplateDirective, LoadingIndicatorComponent, MultipleValueAccessorBase, NgxEnhancyFormsModule, NumberInputComponent, OnRenderDirective, Orientation, PasswordFieldComponent, RadioComponent, SELECT_TRANSLATIONS, SelectComponent, SelectFooterComponent, SortableGroupedItemsComponent, SortableItemsComponent, SubFormDirective, TextInputComponent, ToggleComponent, ValueAccessorBase, WithTooltipDirective, dateValidator, invalidDateKey, invalidFieldsSymbol, matDateFormatsFactory };
+export { ButtonComponent, CheckboxComponent, DATE_PICKER_LOCALE, DATE_PICKER_TRANSLATIONS, DATE_TIME_PICKER_TRANSLATIONS, DEFAULT_ERROR_MESSAGES, DatePickerComponent, DateTimePickerComponent, DefaultErrorHandler, ElementIsTruncatedCbComponent, EmailInputComponent, FORM_ERROR_MESSAGES, FileInputComponent, FormCaptionComponent, FormComponent, FormElementComponent, FormErrorComponent, FormSubmitButtonComponent, FormValidationError, HourMinuteInputComponent, KLP_DATE_FORMATS, KLP_FORM_ERROR_HANDLER, KlpSelectOptionTemplateDirective, LoadingIndicatorComponent, MultipleValueAccessorBase, NgxEnhancyFormsModule, NumberInputComponent, OnRenderDirective, Orientation, PasswordFieldComponent, RadioComponent, SELECT_TRANSLATIONS, SelectComponent, SelectFooterComponent, SortableGroupedItemsComponent, SortableItemsComponent, SubFormDirective, TextAreaComponent, TextInputComponent, ToggleComponent, ValueAccessorBase, WithTooltipDirective, dateValidator, invalidDateKey, invalidFieldsSymbol, matDateFormatsFactory };
 //# sourceMappingURL=klippa-ngx-enhancy-forms.mjs.map