@jooler/inputs 0.0.24 → 0.0.26

package/fesm2020/inputs.mjs

@@ -1,7 +1,7 @@
 import * as i0 from '@angular/core';
-import { EventEmitter, forwardRef, Component, Output, Input, Injectable, Pipe, NgModule } from '@angular/core';
+import { EventEmitter, forwardRef, Component, Output, Input, Injectable, Pipe, Directive, HostListener, NgModule } from '@angular/core';
 import * as i2$1 from '@angular/forms';
-import { NG_VALUE_ACCESSOR, FormsModule } from '@angular/forms';
+import { NG_VALUE_ACCESSOR, NgModel, FormsModule, ReactiveFormsModule } from '@angular/forms';
 import * as i1 from '@angular/common';
 import { CurrencyPipe, DecimalPipe, CommonModule } from '@angular/common';
 import * as i2 from '@ng-select/ng-select';
@@ -11,7 +11,6 @@ import { SharedGeneralComponentsModule } from '@jooler/shared-general-components
 import * as i1$1 from '@angular/common/http';
 import { HttpHeaders } from '@angular/common/http';
 import * as i3 from '@angular/material/button';
-import * as i3$1 from '@angular/material/input';
 import { AppMaterialModule } from '@jooler/app-material';
 
 class ChooseEnumComponent {
@@ -106,13 +105,13 @@ class ChooseEnumComponent {
     }
 }
 ChooseEnumComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: ChooseEnumComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ChooseEnumComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: ChooseEnumComponent, selector: "choose-enum", inputs: { label: "label", isItemHidden: "isItemHidden", isItemDisabled: "isItemDisabled", enumChoices: "enumChoices", getValuesArrayFromEnum: "getValuesArrayFromEnum", isChip: "isChip", placeholder: "placeholder", width: "width", paddingTop: "paddingTop", labelTextAlign: "labelTextAlign", labelTextFontWeight: "labelTextFontWeight", labelTextFontSize: "labelTextFontSize", selectedItem: "selectedItem", indexesToDisable: "indexesToDisable", isDropdownDisabled: "isDropdownDisabled" }, outputs: { change: "change" }, providers: [
+ChooseEnumComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: ChooseEnumComponent, selector: "choose-enum", inputs: { label: "label", isItemHidden: "isItemHidden", isItemDisabled: "isItemDisabled", enumChoices: "enumChoices", getValuesArrayFromEnum: "getValuesArrayFromEnum", isChip: "isChip", isMultiple: "isMultiple", placeholder: "placeholder", width: "width", paddingTop: "paddingTop", labelTextAlign: "labelTextAlign", labelTextFontWeight: "labelTextFontWeight", labelTextFontSize: "labelTextFontSize", selectedItem: "selectedItem", indexesToDisable: "indexesToDisable", isDropdownDisabled: "isDropdownDisabled" }, outputs: { change: "change" }, providers: [
         {
             provide: NG_VALUE_ACCESSOR,
             useExisting: forwardRef(() => ChooseEnumComponent),
             multi: true,
         },
-    ], usesOnChanges: true, ngImport: i0, template: "<div class=\"select\">\r\n    <ng-select [ngStyle]=\"setStyles()\" appendTo=\"body\" (blur)=\"updateBlur()\" bindLabel=\"label\" bindValue=\"value\"\r\n        [items]=\"items\" [placeholder]=\"placeholder\" (change)=\"onSelectedItemChanged()\" [(ngModel)]=\"selectedItem\"\r\n        [disabled]=\"isDropdownDisabled\">\r\n        <ng-template class=\"template\" ng-option-tmp ng-label-tmp let-item=\"item\" let-index=\"index\"\r\n            let-search=\"searchTerm\">\r\n            <div *ngIf=\"isChip\">\r\n                <ng-chip class=\"chip\" [backgroundColor]=\"item.color\" [label]=\"item.label\" [width]=\"110\">\r\n                </ng-chip>\r\n            </div>\r\n            <div [ngStyle]=\"setLabelStyle()\" *ngIf=\"!isChip\">{{item.label}}</div>\r\n        </ng-template>\r\n    </ng-select>\r\n</div>", styles: [""], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "directive", type: i2.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { kind: "directive", type: i2.NgLabelTemplateDirective, selector: "[ng-label-tmp]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.NgChipComponent, selector: "ng-chip", inputs: ["value", "label", "backgroundColor", "textColor", "width", "item", "clear", "withCross"] }] });
+    ], usesOnChanges: true, ngImport: i0, template: "<div class=\"select\">\r\n    <ng-select [ngStyle]=\"setStyles()\" appendTo=\"body\" (blur)=\"updateBlur()\" bindLabel=\"label\" bindValue=\"value\"\r\n        [items]=\"items\" [placeholder]=\"placeholder\" (change)=\"onSelectedItemChanged()\" [(ngModel)]=\"selectedItem\" [multiple]=\"isMultiple\"\r\n        [disabled]=\"isDropdownDisabled\">\r\n        <ng-template class=\"template\" ng-option-tmp ng-label-tmp let-item=\"item\" let-index=\"index\"\r\n            let-search=\"searchTerm\">\r\n            <div *ngIf=\"isChip\">\r\n                <ng-chip class=\"chip\" [backgroundColor]=\"item.color\" [label]=\"item.label\" [width]=\"110\">\r\n                </ng-chip>\r\n            </div>\r\n            <div [ngStyle]=\"setLabelStyle()\" *ngIf=\"!isChip\">{{item.label}}</div>\r\n        </ng-template>\r\n    </ng-select>\r\n</div>", styles: [""], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "directive", type: i2.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { kind: "directive", type: i2.NgLabelTemplateDirective, selector: "[ng-label-tmp]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.NgChipComponent, selector: "ng-chip", inputs: ["value", "label", "backgroundColor", "textColor", "width", "item", "clear", "withCross"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: ChooseEnumComponent, decorators: [{
             type: Component,
             args: [{ selector: 'choose-enum', providers: [
@@ -121,7 +120,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImpor
                             useExisting: forwardRef(() => ChooseEnumComponent),
                             multi: true,
                         },
-                    ], template: "<div class=\"select\">\r\n    <ng-select [ngStyle]=\"setStyles()\" appendTo=\"body\" (blur)=\"updateBlur()\" bindLabel=\"label\" bindValue=\"value\"\r\n        [items]=\"items\" [placeholder]=\"placeholder\" (change)=\"onSelectedItemChanged()\" [(ngModel)]=\"selectedItem\"\r\n        [disabled]=\"isDropdownDisabled\">\r\n        <ng-template class=\"template\" ng-option-tmp ng-label-tmp let-item=\"item\" let-index=\"index\"\r\n            let-search=\"searchTerm\">\r\n            <div *ngIf=\"isChip\">\r\n                <ng-chip class=\"chip\" [backgroundColor]=\"item.color\" [label]=\"item.label\" [width]=\"110\">\r\n                </ng-chip>\r\n            </div>\r\n            <div [ngStyle]=\"setLabelStyle()\" *ngIf=\"!isChip\">{{item.label}}</div>\r\n        </ng-template>\r\n    </ng-select>\r\n</div>" }]
+                    ], template: "<div class=\"select\">\r\n    <ng-select [ngStyle]=\"setStyles()\" appendTo=\"body\" (blur)=\"updateBlur()\" bindLabel=\"label\" bindValue=\"value\"\r\n        [items]=\"items\" [placeholder]=\"placeholder\" (change)=\"onSelectedItemChanged()\" [(ngModel)]=\"selectedItem\" [multiple]=\"isMultiple\"\r\n        [disabled]=\"isDropdownDisabled\">\r\n        <ng-template class=\"template\" ng-option-tmp ng-label-tmp let-item=\"item\" let-index=\"index\"\r\n            let-search=\"searchTerm\">\r\n            <div *ngIf=\"isChip\">\r\n                <ng-chip class=\"chip\" [backgroundColor]=\"item.color\" [label]=\"item.label\" [width]=\"110\">\r\n                </ng-chip>\r\n            </div>\r\n            <div [ngStyle]=\"setLabelStyle()\" *ngIf=\"!isChip\">{{item.label}}</div>\r\n        </ng-template>\r\n    </ng-select>\r\n</div>" }]
         }], ctorParameters: function () { return []; }, propDecorators: { change: [{
                 type: Output
             }], label: [{
@@ -136,6 +135,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImpor
                 type: Input
             }], isChip: [{
                 type: Input
+            }], isMultiple: [{
+                type: Input
             }], placeholder: [{
                 type: Input
             }], width: [{
@@ -173,7 +174,7 @@ class ChooseEnumRendererComponent {
     }
 }
 ChooseEnumRendererComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: ChooseEnumRendererComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ChooseEnumRendererComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: ChooseEnumRendererComponent, selector: "choose-enum-renderer", ngImport: i0, template: "<choose-enum \r\n[label]=\"params.label\"\r\n[isItemHidden]=\"params.isItemHidden\"\r\n[isItemDisabled]=\"params.isItemDisabled\"\r\n[labelTextAlign]=\"params.labelTextAlign\"\r\n[labelTextFontWeight]=\"params.labelTextFontWeight\"\r\n[labelTextFontSize]=\"params.labelTextFontSize\"\r\n[selectedItem]=\"params.value\"\r\n[indexesToDisable]=\"params.indexesToDisable\"\r\n[isDropdownDisabled]=\"params.isDropdownDisabled\"\r\n[getValuesArrayFromEnum]=\"params.getLabelAndColorFromEnumValue\"\r\n[enumChoices]=\"params.enumChoices\"\r\n[placeholder]=\"params.placeholder\" \r\n[width]=\"params.width\" \r\n[isChip]=\"params.isChip\" \r\n[paddingTop]=\"params.paddingTop\" \r\n(change)=\"onCellDataChanged($event)\">\r\n</choose-enum>\r\n", styles: [""], dependencies: [{ kind: "component", type: ChooseEnumComponent, selector: "choose-enum", inputs: ["label", "isItemHidden", "isItemDisabled", "enumChoices", "getValuesArrayFromEnum", "isChip", "placeholder", "width", "paddingTop", "labelTextAlign", "labelTextFontWeight", "labelTextFontSize", "selectedItem", "indexesToDisable", "isDropdownDisabled"], outputs: ["change"] }] });
+ChooseEnumRendererComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: ChooseEnumRendererComponent, selector: "choose-enum-renderer", ngImport: i0, template: "<choose-enum \r\n[label]=\"params.label\"\r\n[isItemHidden]=\"params.isItemHidden\"\r\n[isItemDisabled]=\"params.isItemDisabled\"\r\n[labelTextAlign]=\"params.labelTextAlign\"\r\n[labelTextFontWeight]=\"params.labelTextFontWeight\"\r\n[labelTextFontSize]=\"params.labelTextFontSize\"\r\n[selectedItem]=\"params.value\"\r\n[indexesToDisable]=\"params.indexesToDisable\"\r\n[isDropdownDisabled]=\"params.isDropdownDisabled\"\r\n[getValuesArrayFromEnum]=\"params.getLabelAndColorFromEnumValue\"\r\n[enumChoices]=\"params.enumChoices\"\r\n[placeholder]=\"params.placeholder\" \r\n[width]=\"params.width\" \r\n[isChip]=\"params.isChip\" \r\n[paddingTop]=\"params.paddingTop\" \r\n(change)=\"onCellDataChanged($event)\">\r\n</choose-enum>\r\n", styles: [""], dependencies: [{ kind: "component", type: ChooseEnumComponent, selector: "choose-enum", inputs: ["label", "isItemHidden", "isItemDisabled", "enumChoices", "getValuesArrayFromEnum", "isChip", "isMultiple", "placeholder", "width", "paddingTop", "labelTextAlign", "labelTextFontWeight", "labelTextFontSize", "selectedItem", "indexesToDisable", "isDropdownDisabled"], outputs: ["change"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: ChooseEnumRendererComponent, decorators: [{
             type: Component,
             args: [{ selector: 'choose-enum-renderer', template: "<choose-enum \r\n[label]=\"params.label\"\r\n[isItemHidden]=\"params.isItemHidden\"\r\n[isItemDisabled]=\"params.isItemDisabled\"\r\n[labelTextAlign]=\"params.labelTextAlign\"\r\n[labelTextFontWeight]=\"params.labelTextFontWeight\"\r\n[labelTextFontSize]=\"params.labelTextFontSize\"\r\n[selectedItem]=\"params.value\"\r\n[indexesToDisable]=\"params.indexesToDisable\"\r\n[isDropdownDisabled]=\"params.isDropdownDisabled\"\r\n[getValuesArrayFromEnum]=\"params.getLabelAndColorFromEnumValue\"\r\n[enumChoices]=\"params.enumChoices\"\r\n[placeholder]=\"params.placeholder\" \r\n[width]=\"params.width\" \r\n[isChip]=\"params.isChip\" \r\n[paddingTop]=\"params.paddingTop\" \r\n(change)=\"onCellDataChanged($event)\">\r\n</choose-enum>\r\n" }]
@@ -359,10 +360,10 @@ class ChooseGeneralItemRendererComponent {
     }
 }
 ChooseGeneralItemRendererComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: ChooseGeneralItemRendererComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ChooseGeneralItemRendererComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: ChooseGeneralItemRendererComponent, selector: "choose-general-item-renderer", ngImport: i0, template: "<choose-general-item [label]=\"params.label\" \r\n[placeholder]=\"params.placeholder\" \r\n[apiPath]=\"params.apiPath\" \r\n[isMultiple]=\"params.isMultiple\" \r\n[objects]=\"params.objects\" \r\n[showLabel]=\"params.showLabel\" \r\n[separator]=\"params.separator\" \r\n[width]=\"params.width\" \r\n[fontWeight]=\"params.fontWeight\" \r\n[fontSize]=\"params.fontSize\" \r\n[isChip]=\"params.isChip\" \r\n[isTypeDate]=\"params.isTypeDate\" \r\n[chipColor]=\"params.chipColor\" \r\n[chipTextColor]=\"params.chipTextColor\" \r\n[chipWidth]=\"params.chipWidth\" \r\n[selectedItemId]=\"itemId\" \r\n[disabled]=\"params.disabled\" \r\n(change)=\"onCellDataChanged($event)\"></choose-general-item>", styles: [""], dependencies: [{ kind: "component", type: ChooseGeneralItemComponent, selector: "choose-general-item", inputs: ["items", "label", "placeholder", "apiPath", "isMultiple", "hideSelectedItem", "objects", "showLabel", "separator", "width", "fontWeight", "fontSize", "isChip", "isTypeDate", "chipColor", "chipTextColor", "chipWidth", "selectedItemId", "disabled", "dropdownPosition", "useFullObject"], outputs: ["change"] }] });
+ChooseGeneralItemRendererComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: ChooseGeneralItemRendererComponent, selector: "choose-general-item-renderer", ngImport: i0, template: "<choose-general-item [label]=\"params.label\" \n[placeholder]=\"params.placeholder\" \n[apiPath]=\"params.apiPath\" \n[isMultiple]=\"params.isMultiple\" \n[objects]=\"params.objects\" \n[showLabel]=\"params.showLabel\" \n[separator]=\"params.separator\" \n[width]=\"params.width\" \n[fontWeight]=\"params.fontWeight\" \n[fontSize]=\"params.fontSize\" \n[isChip]=\"params.isChip\" \n[isTypeDate]=\"params.isTypeDate\" \n[chipColor]=\"params.chipColor\" \n[chipTextColor]=\"params.chipTextColor\" \n[chipWidth]=\"params.chipWidth\" \n[selectedItemId]=\"itemId\" \n[disabled]=\"params.disabled\" \n(change)=\"onCellDataChanged($event)\"></choose-general-item>", styles: [""], dependencies: [{ kind: "component", type: ChooseGeneralItemComponent, selector: "choose-general-item", inputs: ["items", "label", "placeholder", "apiPath", "isMultiple", "hideSelectedItem", "objects", "showLabel", "separator", "width", "fontWeight", "fontSize", "isChip", "isTypeDate", "chipColor", "chipTextColor", "chipWidth", "selectedItemId", "disabled", "dropdownPosition", "useFullObject"], outputs: ["change"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: ChooseGeneralItemRendererComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'choose-general-item-renderer', template: "<choose-general-item [label]=\"params.label\" \r\n[placeholder]=\"params.placeholder\" \r\n[apiPath]=\"params.apiPath\" \r\n[isMultiple]=\"params.isMultiple\" \r\n[objects]=\"params.objects\" \r\n[showLabel]=\"params.showLabel\" \r\n[separator]=\"params.separator\" \r\n[width]=\"params.width\" \r\n[fontWeight]=\"params.fontWeight\" \r\n[fontSize]=\"params.fontSize\" \r\n[isChip]=\"params.isChip\" \r\n[isTypeDate]=\"params.isTypeDate\" \r\n[chipColor]=\"params.chipColor\" \r\n[chipTextColor]=\"params.chipTextColor\" \r\n[chipWidth]=\"params.chipWidth\" \r\n[selectedItemId]=\"itemId\" \r\n[disabled]=\"params.disabled\" \r\n(change)=\"onCellDataChanged($event)\"></choose-general-item>" }]
+            args: [{ selector: 'choose-general-item-renderer', template: "<choose-general-item [label]=\"params.label\" \n[placeholder]=\"params.placeholder\" \n[apiPath]=\"params.apiPath\" \n[isMultiple]=\"params.isMultiple\" \n[objects]=\"params.objects\" \n[showLabel]=\"params.showLabel\" \n[separator]=\"params.separator\" \n[width]=\"params.width\" \n[fontWeight]=\"params.fontWeight\" \n[fontSize]=\"params.fontSize\" \n[isChip]=\"params.isChip\" \n[isTypeDate]=\"params.isTypeDate\" \n[chipColor]=\"params.chipColor\" \n[chipTextColor]=\"params.chipTextColor\" \n[chipWidth]=\"params.chipWidth\" \n[selectedItemId]=\"itemId\" \n[disabled]=\"params.disabled\" \n(change)=\"onCellDataChanged($event)\"></choose-general-item>" }]
         }], ctorParameters: function () { return []; } });
 
 var LineType;
@@ -686,46 +687,97 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImpor
                 type: Input
             }] } });
 
+class CustomDecimalPointTwoDigitsDirective {
+    constructor(control) {
+        this.control = control;
+    }
+    ngOnInit() {
+        if (this.control.value) {
+            this.control.valueAccessor.writeValue(this.transformToCommasAndPoint(this.control.value));
+        }
+        this.valueSubscription = this.control.control.valueChanges.subscribe(value => {
+            if (value.length > 0) {
+                let removeCommas = this.control.value.replace(/,/g, '');
+                this.control.control.setValue(removeCommas, { emitEvent: false, emitModelToViewChange: false });
+            }
+            else {
+                this.control.control.setValue(null, { emitEvent: false, emitModelToViewChange: false });
+            }
+        });
+    }
+    onEvent($event) {
+        if (this.control.value) {
+            const item = $event.target;
+            item.value = this.transformToCommasAndPoint(this.control.value);
+            let removeCommas = this.control.value.replace(/,/g, '');
+            this.control.control.setValue(removeCommas, { emitEvent: false, emitModelToViewChange: false });
+        }
+    }
+    transformToCommasAndPoint(value) {
+        if (value.indexOf(".") == -1) {
+            value = value.toString().replace(/\D/g, "")
+                .replace(/\B(?=(\d{3})+(?!\d))/g, ",");
+            return value;
+        }
+        else {
+            let val = value.split(".");
+            let valueBeforeDecimal = val[0];
+            let valueAfterDecimal = val[1];
+            valueBeforeDecimal = valueBeforeDecimal.toString().replace(/\D/g, "")
+                .replace(/\B(?=(\d{3})+(?!\d))/g, ",");
+            let newValue = `${valueBeforeDecimal}.${valueAfterDecimal}`;
+            return newValue;
+        }
+    }
+}
+CustomDecimalPointTwoDigitsDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: CustomDecimalPointTwoDigitsDirective, deps: [{ token: i2$1.NgControl }], target: i0.ɵɵFactoryTarget.Directive });
+CustomDecimalPointTwoDigitsDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.1.0", type: CustomDecimalPointTwoDigitsDirective, selector: "[customDecimalPointTwoDigits]", host: { listeners: { "input": "onEvent($event)" } }, providers: [NgModel, DecimalPipe], ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: CustomDecimalPointTwoDigitsDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[customDecimalPointTwoDigits]',
+                    providers: [NgModel, DecimalPipe],
+                }]
+        }], ctorParameters: function () { return [{ type: i2$1.NgControl }]; }, propDecorators: { onEvent: [{
+                type: HostListener,
+                args: ["input", ["$event"]]
+            }] } });
+
 class GeneralInputRendererComponent {
     constructor() { }
     agInit(params) {
         this.params = params;
+        this.formGroup = this.params.context.formGroup.get('entries').at(params.node.rowIndex);
         this.key = params.context.createKey(params.columnApi, params.column);
-        this.rowId = params.node.rowIndex;
         if (params.isTypeNumber) {
             if (params.value) {
                 this.value = new DecimalPipe("en-US").transform(+params.value, "1.0-0");
             }
         }
-        else
+        else {
             this.value = params.value;
+        }
     }
     onCellDataChanged($event) {
         let value = $event.target.value;
-        this.formControlValue = this.params.context.formGroup.get("entries").at(this.params.node.rowIndex);
-        this.formControlValue?.get(this.key).setValue(value);
-    }
-    separateThousands($event) {
-        let value = $event.target.value;
-        value = value.toString().replace(/\D/g, "")
-            .replace(/\B(?=(\d{3})+(?!\d))/g, ",");
-        this.value = value;
-    }
-    setTextAreaWidth() {
-        let style = {
-            'width': this.params.textAreaWidth + 'rem',
+        let newAndOldValue = {
+            newValue: value,
+            oldValue: this.params?.value
         };
-        return style;
+        if (this.params.allowUpdateRowData) {
+            this.params.onChange(newAndOldValue);
+        }
     }
     refresh(params) {
-        return false;
+        this.formGroup = this.params.context.formGroup.get('entries').at(params.node.rowIndex);
+        return true;
     }
 }
 GeneralInputRendererComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: GeneralInputRendererComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-GeneralInputRendererComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: GeneralInputRendererComponent, selector: "general-input-renderer", ngImport: i0, template: "<div *ngIf=\"params.isTypeText\">\r\n    <input [(ngModel)]=\"value\" matInput [placeholder]=\"params.fieldLabel\"\r\n        (change)=\"onCellDataChanged($event)\" />\r\n    <span *ngIf=\"params.showSymbol\"\r\n        style=\"margin-left:-20px ;\">{{params.symbol}}</span>\r\n</div>\r\n<div *ngIf=\"params.isTypeNumber\">\r\n    <input [(ngModel)]=\"value\" (keyup)=\"separateThousands($event)\" matInput\r\n        [placeholder]=\"params.fieldLabel\"\r\n        (change)=\"onCellDataChanged($event)\" />\r\n    <span *ngIf=\"params.showSymbol\"\r\n        style=\"margin-left:-20px ;\">{{params.symbol}}</span>\r\n</div>\r\n<div *ngIf=\"params.isTypeTextArea\">\r\n        <textarea class=\"text-area\" [ngStyle]=\"setTextAreaWidth()\" [(ngModel)]=\"value\"\r\n            (change)=\"onCellDataChanged($event)\"\r\n            [placeholder]=\"params.fieldLabel\" class=\"main-height\"\r\n            matInput></textarea>\r\n</div>", styles: ["textarea{padding-left:.5rem;border-radius:.3rem;height:3.5rem;font-size:1.2rem;border:solid #BEBEBE .1rem}textarea:focus{outline:none}textarea::placeholder{color:#676767}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2$1.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$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3$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"] }] });
+GeneralInputRendererComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.0", type: GeneralInputRendererComponent, selector: "general-input-renderer", ngImport: i0, template: "<div *ngIf=\"formGroup\" [formGroup]=\"formGroup\">\r\n    <div *ngIf=\"params.isTypeText\">\r\n        <input [placeholder]=\"params.fieldLabel\" (change)=\"onCellDataChanged($event)\" [formControlName]=\"key\" />\r\n        <span *ngIf=\"params.showSymbol\" style=\"margin-left:-20px ;\">{{params.symbol}}</span>\r\n    </div>\r\n    <div *ngIf=\"params.isTypeNumber\">\r\n        <input customDecimalPointTwoDigits [placeholder]=\"params.fieldLabel\" (change)=\"onCellDataChanged($event)\"\r\n            [formControlName]=\"key\" />\r\n        <span *ngIf=\"params.showSymbol\" style=\"margin-left:-20px ;\">{{params.symbol}}</span>\r\n    </div>\r\n    <div *ngIf=\"params.isTypeTextArea\">\r\n        <textarea class=\"text-area\" (change)=\"onCellDataChanged($event)\" [placeholder]=\"params.fieldLabel\"\r\n            class=\"main-height\" [formControlName]=\"key\"></textarea>\r\n    </div>\r\n</div>", styles: ["textarea{padding-left:.5rem;border-radius:.3rem;height:3.5rem;font-size:1.2rem;border:solid #BEBEBE .1rem}textarea:focus{outline:none}textarea::placeholder{color:#676767}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.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$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: CustomDecimalPointTwoDigitsDirective, selector: "[customDecimalPointTwoDigits]" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: GeneralInputRendererComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'general-input-renderer', template: "<div *ngIf=\"params.isTypeText\">\r\n    <input [(ngModel)]=\"value\" matInput [placeholder]=\"params.fieldLabel\"\r\n        (change)=\"onCellDataChanged($event)\" />\r\n    <span *ngIf=\"params.showSymbol\"\r\n        style=\"margin-left:-20px ;\">{{params.symbol}}</span>\r\n</div>\r\n<div *ngIf=\"params.isTypeNumber\">\r\n    <input [(ngModel)]=\"value\" (keyup)=\"separateThousands($event)\" matInput\r\n        [placeholder]=\"params.fieldLabel\"\r\n        (change)=\"onCellDataChanged($event)\" />\r\n    <span *ngIf=\"params.showSymbol\"\r\n        style=\"margin-left:-20px ;\">{{params.symbol}}</span>\r\n</div>\r\n<div *ngIf=\"params.isTypeTextArea\">\r\n        <textarea class=\"text-area\" [ngStyle]=\"setTextAreaWidth()\" [(ngModel)]=\"value\"\r\n            (change)=\"onCellDataChanged($event)\"\r\n            [placeholder]=\"params.fieldLabel\" class=\"main-height\"\r\n            matInput></textarea>\r\n</div>", styles: ["textarea{padding-left:.5rem;border-radius:.3rem;height:3.5rem;font-size:1.2rem;border:solid #BEBEBE .1rem}textarea:focus{outline:none}textarea::placeholder{color:#676767}\n"] }]
+            args: [{ selector: 'general-input-renderer', template: "<div *ngIf=\"formGroup\" [formGroup]=\"formGroup\">\r\n    <div *ngIf=\"params.isTypeText\">\r\n        <input [placeholder]=\"params.fieldLabel\" (change)=\"onCellDataChanged($event)\" [formControlName]=\"key\" />\r\n        <span *ngIf=\"params.showSymbol\" style=\"margin-left:-20px ;\">{{params.symbol}}</span>\r\n    </div>\r\n    <div *ngIf=\"params.isTypeNumber\">\r\n        <input customDecimalPointTwoDigits [placeholder]=\"params.fieldLabel\" (change)=\"onCellDataChanged($event)\"\r\n            [formControlName]=\"key\" />\r\n        <span *ngIf=\"params.showSymbol\" style=\"margin-left:-20px ;\">{{params.symbol}}</span>\r\n    </div>\r\n    <div *ngIf=\"params.isTypeTextArea\">\r\n        <textarea class=\"text-area\" (change)=\"onCellDataChanged($event)\" [placeholder]=\"params.fieldLabel\"\r\n            class=\"main-height\" [formControlName]=\"key\"></textarea>\r\n    </div>\r\n</div>", styles: ["textarea{padding-left:.5rem;border-radius:.3rem;height:3.5rem;font-size:1.2rem;border:solid #BEBEBE .1rem}textarea:focus{outline:none}textarea::placeholder{color:#676767}\n"] }]
         }], ctorParameters: function () { return []; } });
 
 class LabelAndField {
@@ -743,9 +795,11 @@ InputsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
         ChooseYesOrNoRendererComponent,
         EditableSavableInputComponent,
         DynamicPipe,
-        ChooseGeneralItemRendererComponent], imports: [CommonModule,
+        ChooseGeneralItemRendererComponent,
+        CustomDecimalPointTwoDigitsDirective], imports: [CommonModule,
         NgSelectModule,
         FormsModule,
+        ReactiveFormsModule,
         AppMaterialModule,
         SharedGeneralComponentsModule], exports: [ChooseEnumComponent,
         ChooseEnumRendererComponent,
@@ -759,6 +813,7 @@ InputsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
 InputsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: InputsModule, imports: [CommonModule,
         NgSelectModule,
         FormsModule,
+        ReactiveFormsModule,
         AppMaterialModule,
         SharedGeneralComponentsModule] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImport: i0, type: InputsModule, decorators: [{
@@ -774,12 +829,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.0", ngImpor
                         ChooseYesOrNoRendererComponent,
                         EditableSavableInputComponent,
                         DynamicPipe,
-                        ChooseGeneralItemRendererComponent
+                        ChooseGeneralItemRendererComponent,
+                        CustomDecimalPointTwoDigitsDirective
                     ],
                     imports: [
                         CommonModule,
                         NgSelectModule,
                         FormsModule,
+                        ReactiveFormsModule,
                         AppMaterialModule,
                         SharedGeneralComponentsModule,
                     ],