@wavemaker-ai/app-ng-runtime 12.0.0-rc.335 → 12.0.1-rc.338

package/components/input/text/fesm2022/index.mjs

@@ -84,10 +84,10 @@ class BaseInput extends BaseFormCustomComponent {
         updateOn = updateOn === 'default' ? 'change' : updateOn;
         this.ngModelOptions.updateOn = updateOn;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: BaseInput, deps: [{ token: i0.Injector }, { token: WidgetConfig }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: BaseInput }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: BaseInput, deps: [{ token: i0.Injector }, { token: WidgetConfig }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: BaseInput }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: BaseInput, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: BaseInput, decorators: [{
             type: Injectable
         }], ctorParameters: () => [{ type: i0.Injector }, { type: undefined, decorators: [{
                     type: Inject,
@@ -144,7 +144,7 @@ let NumberLocale = class NumberLocale extends BaseInput {
                     value = isLocalizedNumber ? parts[0] : this.transformNumber(parts[0]);
                 }
                 if (decimalplaces > 0) {
-                    this.decimalValue = parts[1] && parts[1].substring(0, decimalplaces) || '';
+                    this.decimalValue = parts[1]?.substring(0, decimalplaces) || '';
                     if (isLocalizedNumber) {
                         value = this.decimalValue.length ? `${parts[0]}${this.DECIMAL}${this.decimalValue}` : parts[0];
                     }
@@ -360,10 +360,8 @@ let NumberLocale = class NumberLocale extends BaseInput {
                         this.handleChange(value);
                     }
                 }
-                else {
-                    if (!(prevDataValue == undefined && this.datavalue == null)) {
-                        this.handleChange(value);
-                    }
+                else if (!(prevDataValue == undefined && this.datavalue == null)) {
+                    this.handleChange(value);
                 }
             }
             else { // currency widget
@@ -480,14 +478,12 @@ let NumberLocale = class NumberLocale extends BaseInput {
                 this.resetValidations();
             }
         }
+        else if (isUndefined(proxyModel) || isNull(proxyModel)) {
+            proxyModel = value = this.getValueInRange((this.minvalue || 0));
+            this.resetValidations();
+        }
         else {
-            if (isUndefined(proxyModel) || isNull(proxyModel)) {
-                proxyModel = value = this.getValueInRange((this.minvalue || 0));
-                this.resetValidations();
-            }
-            else {
-                value = this.getValueInRange(proxyModel + (key === 'UP' ? this.step : -this.step));
-            }
+            value = this.getValueInRange(proxyModel + (key === 'UP' ? this.step : -this.step));
         }
         if ((key === 'UP' && proxyModel <= value) || (key === 'DOWN' && proxyModel >= value)) {
             const decimalRoundValue = Math.max(this.countDecimals(proxyModel), this.countDecimals(this.step));
@@ -540,7 +536,7 @@ let NumberLocale = class NumberLocale extends BaseInput {
         const validity = new RegExp(`^[\\d\\s-,.e+${this.GROUP}${this.DECIMAL}]$`, 'i');
         const inputValue = $event.target?.value || "";
         // when input mode is financial, do not restrict user on entering the value when step value limit is reached.
-        const skipStepValidation = this.inputmode === INPUTMODE.FINANCIAL;
+        // const skipStepValidation = this.inputmode === INPUTMODE.FINANCIAL;
         // Validates if user eneters more than 16 digits
         if (inputValue) {
             const parsedVal = parseInt(inputValue.toString().replace(/\D/g, ''));
@@ -549,7 +545,7 @@ let NumberLocale = class NumberLocale extends BaseInput {
                 // user selects a range of digits and presses a key.
                 // Do not throw validation of exceeded number as selected range value will be deleted.
                 const selectedVal = window.getSelection();
-                if (selectedVal && selectedVal.toString() && selectedVal.focusNode === this.nativeElement) {
+                if (selectedVal?.toString() && selectedVal.focusNode === this.nativeElement) {
                     return true;
                 }
                 return false;
@@ -690,14 +686,14 @@ class InputCalendarComponent extends BaseInput {
         // Call parent ngOnDestroy
         super.ngOnDestroy();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: InputCalendarComponent, deps: [{ token: i0.Injector }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.20", type: InputCalendarComponent, isStandalone: true, selector: "wm-input[type=\"date\"], wm-input[type=\"datetime-local\"], wm-input[type=\"month\"], wm-input[type=\"time\"], wm-input[type=\"week\"]", providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: InputCalendarComponent, deps: [{ token: i0.Injector }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.21", type: InputCalendarComponent, isStandalone: true, selector: "wm-input[type=\"date\"], wm-input[type=\"datetime-local\"], wm-input[type=\"month\"], wm-input[type=\"time\"], wm-input[type=\"week\"]", providers: [
             provideAs(InputCalendarComponent, NG_VALUE_ACCESSOR, true),
             provideAs(InputCalendarComponent, NG_VALIDATORS, true),
             provideAsWidgetRef(InputCalendarComponent)
         ], viewQueries: [{ propertyName: "inputEl", first: true, predicate: ["input"], descendants: true, static: true }, { propertyName: "ngModel", first: true, predicate: NgModel, descendants: true }], usesInheritance: true, ngImport: i0, template: "<input class=\"form-control app-textbox\"\n       focus-target\n       [type]=\"type\"\n       [attr.name]=\"name\"\n       [(ngModel)]=\"datavalue\"\n       [ngModelOptions]=\"{standalone: true}\"\n       [readonly]=\"readonly\"\n       [required]=\"required\"\n       [disabled]=\"disabled\"\n       [min]=\"minvalue\"\n       [max]=\"maxvalue\"\n       [step]=\"step\"\n       [attr.tabindex]=\"tabindex\"\n       [attr.placeholder]=\"placeholder\"\n       [attr.accesskey]=\"shortcutkey\"\n       [attr.aria-label]=\"arialabel || type + ' field'\"\n       [autofocus]=\"autofocus\"\n       (blur)=\"handleBlur($event)\"\n       (ngModelChange)=\"handleChange($event)\"\n       [autocomplete]=\"autocomplete ? 'on' : 'off'\"\n       [ngClass]=\"conditionalclass\"\n       [ngStyle]=\"conditionalstyle\"\n       #input>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { 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.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { 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: "21.2.20", ngImport: i0, type: InputCalendarComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: InputCalendarComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, imports: [CommonModule, FormsModule], selector: 'wm-input[type="date"], wm-input[type="datetime-local"], wm-input[type="month"], wm-input[type="time"], wm-input[type="week"]', providers: [
                         provideAs(InputCalendarComponent, NG_VALUE_ACCESSOR, true),
@@ -759,14 +755,14 @@ class InputColorComponent extends BaseInput {
         // Call parent ngOnDestroy
         super.ngOnDestroy();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: InputColorComponent, deps: [{ token: i0.Injector }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.20", type: InputColorComponent, isStandalone: true, selector: "wm-input[type=\"color\"]", providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: InputColorComponent, deps: [{ token: i0.Injector }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.21", type: InputColorComponent, isStandalone: true, selector: "wm-input[type=\"color\"]", providers: [
             provideAs(InputColorComponent, NG_VALUE_ACCESSOR, true),
             provideAs(InputColorComponent, NG_VALIDATORS, true),
             provideAsWidgetRef(InputColorComponent)
         ], viewQueries: [{ propertyName: "inputEl", first: true, predicate: ["input"], descendants: true, static: true }, { propertyName: "ngModel", first: true, predicate: NgModel, descendants: true }], usesInheritance: true, ngImport: i0, template: "<input class=\"form-control app-textbox\"\n       focus-target\n       [type]=\"type\"\n       [attr.name]=\"name\"\n       [(ngModel)]=\"datavalue\"\n       [ngModelOptions]=\"{standalone: true}\"\n       [readonly]=\"readonly\"\n       [required]=\"required\"\n       [disabled]=\"disabled\"\n       [maxlength]=\"maxchars\"\n       [attr.tabindex]=\"tabindex\"\n       [attr.placeholder]=\"placeholder\"\n       [attr.accesskey]=\"shortcutkey\"\n       [attr.aria-label]=\"arialabel\"\n       [autofocus]=\"autofocus\"\n       [ngClass]=\"conditionalclass\"\n       [ngStyle]=\"conditionalstyle\"\n       (blur)=\"handleBlur($event)\"\n       (ngModelChange)=\"handleChange($event)\"\n       #input>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { 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.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { 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: "21.2.20", ngImport: i0, type: InputColorComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: InputColorComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, imports: [CommonModule, FormsModule], selector: 'wm-input[type="color"]', providers: [
                         provideAs(InputColorComponent, NG_VALUE_ACCESSOR, true),
@@ -830,14 +826,14 @@ class InputEmailComponent extends BaseInput {
         // Call parent ngOnDestroy
         super.ngOnDestroy();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: InputEmailComponent, deps: [{ token: i0.Injector }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.20", type: InputEmailComponent, isStandalone: true, selector: "wm-input[type=\"email\"]", providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: InputEmailComponent, deps: [{ token: i0.Injector }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.21", type: InputEmailComponent, isStandalone: true, selector: "wm-input[type=\"email\"]", providers: [
             provideAs(InputEmailComponent, NG_VALUE_ACCESSOR, true),
             provideAs(InputEmailComponent, NG_VALIDATORS, true),
             provideAsWidgetRef(InputEmailComponent)
         ], viewQueries: [{ propertyName: "inputEl", first: true, predicate: ["input"], descendants: true, static: true }, { propertyName: "ngModel", first: true, predicate: NgModel, descendants: true }], usesInheritance: true, ngImport: i0, template: "<input class=\"form-control app-textbox\"\n       focus-target\n       [type]=\"type\"\n       [attr.name]=\"name\"\n       [(ngModel)]=\"datavalue\"\n       [ngModelOptions]=\"ngModelOptions\"\n       [readonly]=\"readonly\"\n       [required]=\"required\"\n       [disabled]=\"disabled\"\n       [maxlength]=\"maxchars\"\n       [pattern]=\"regexp\"\n       [attr.tabindex]=\"tabindex\"\n       [attr.placeholder]=\"placeholder\"\n       [attr.accesskey]=\"shortcutkey\"\n       [attr.aria-label]=\"arialabel\"\n       [autofocus]=\"autofocus\"\n       [ngClass]=\"conditionalclass\"\n       [ngStyle]=\"conditionalstyle\"\n       (blur)=\"handleBlur($event)\"\n       (ngModelChange)=\"handleChange($event)\"\n       [autocomplete]=\"autocomplete ? 'on' : 'off'\"\n       (keyup.enter)=\"flushViewChanges(input.value)\"\n       email\n       #input>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { 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.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i2.EmailValidator, selector: "[email][formControlName],[email][formControl],[email][ngModel]", inputs: ["email"] }, { 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: "21.2.20", ngImport: i0, type: InputEmailComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: InputEmailComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, imports: [CommonModule, FormsModule], selector: 'wm-input[type="email"]', providers: [
                         provideAs(InputEmailComponent, NG_VALUE_ACCESSOR, true),
@@ -983,7 +979,7 @@ class InputTextComponent extends BaseInput {
         if (this.displayformat) {
             this.isFocused = (($event && $event.type === 'focus') || this.datavalue) ? true : false;
             // Do not show format placeholder when no value is present on blur
-            if (!this.isFocused && this.imask && this.imask.maskRef) {
+            if (!this.isFocused && this.imask?.maskRef) {
                 this.imask.maskRef.updateOptions({ lazy: true });
                 // on blur, when no value is present assign maskref to null, as in some cases (where format palceholder starts with pranthesis) the format placeholder is still shown. WMS-20124
                 if (!this.datavalue && this.imask.maskRef.value) {
@@ -994,7 +990,7 @@ class InputTextComponent extends BaseInput {
                 // when display format is dynamically populated, cursor position is at the end of the format, readjusting the cursor position based on masked input value
                 // Adding timeout, as the below code should be on hold until imask model is generated
                 setTimeout(() => {
-                    if (this.imask && this.imask.maskRef && this.imask.maskRef.value) {
+                    if (this.imask?.maskRef?.value) {
                         const maskValIndex = this.imask.maskRef.value.indexOf('_');
                         const enteredMaskVal = maskValIndex >= 0 ? this.imask.maskRef.value.slice(0, maskValIndex).length : this.imask.maskRef.value.length;
                         if (enteredMaskVal !== this.imask.maskRef.cursorPos) {
@@ -1004,7 +1000,7 @@ class InputTextComponent extends BaseInput {
                 }, 50);
             }
         }
-        else if (this.imask && this.imask.maskRef) { // When display format is bound via condition, remove the placeholder when the format is not applicable
+        else if (this.imask?.maskRef) { // When display format is bound via condition, remove the placeholder when the format is not applicable
             this.imask.maskRef.updateOptions({ lazy: true });
             // when display format is removed assign input value to the datavalue attr. WMS-20124
             this.inputEl.nativeElement.value = this.datavalue;
@@ -1025,14 +1021,14 @@ class InputTextComponent extends BaseInput {
         // Call parent ngOnDestroy (BaseInput → BaseFormCustomComponent → StylableComponent → BaseComponent)
         super.ngOnDestroy();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: InputTextComponent, deps: [{ token: i0.Injector }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.20", type: InputTextComponent, isStandalone: true, selector: "wm-input[type=\"text\"], wm-input:not([type]), wm-input[type=\"password\"], wm-input[type=\"search\"], wm-input[type=\"tel\"], wm-input[type=\"url\"]", providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: InputTextComponent, deps: [{ token: i0.Injector }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.21", type: InputTextComponent, isStandalone: true, selector: "wm-input[type=\"text\"], wm-input:not([type]), wm-input[type=\"password\"], wm-input[type=\"search\"], wm-input[type=\"tel\"], wm-input[type=\"url\"]", providers: [
             provideAs(InputTextComponent, NG_VALUE_ACCESSOR, true),
             provideAs(InputTextComponent, NG_VALIDATORS, true),
             provideAsWidgetRef(InputTextComponent)
         ], viewQueries: [{ propertyName: "inputEl", first: true, predicate: ["input"], descendants: true, static: true }, { propertyName: "ngModel", first: true, predicate: NgModel, descendants: true }, { propertyName: "imask", first: true, predicate: ["input"], descendants: true, read: IMaskDirective }], usesInheritance: true, ngImport: i0, template: "<button class=\"btn-leading-icon\" type=\"button\" name=\"leadingIcon\" *ngIf=\"leadingiconclass || leadingiconurl\" (click)=\"iconClickEvent($event, 'leadingiconclick')\">\n     <wm-app-icon [iconclass]=\"leadingiconclass\" [iconurl]=\"leadingiconurl\"></wm-app-icon>\n</button>\n<input class=\"form-control app-textbox\"\n       focus-target\n       [type]=\"type\"\n       [attr.name]=\"name\"\n       [attr.aria-label]=\"arialabel\"\n       [(ngModel)]=\"datavalue\"\n       [imask]=\"mask\"\n       [unmask]=\"true\"\n       [ngModelOptions]=\"ngModelOptions\"\n       [readonly]=\"readonly\"\n       [required]=\"required\"\n       [disabled]=\"disabled\"\n       [maxlength]=\"maxchars\"\n       [pattern]=\"regexp\"\n       [attr.tabindex]=\"tabindex\"\n       [attr.placeholder]=\"placeholder\"\n       [attr.accesskey]=\"shortcutkey\"\n       [autofocus]=\"autofocus\"\n       [ngClass]=\"computedClasses\"\n       [ngStyle]=\"conditionalstyle\"\n       (ngModelChange)=\"handleChange($event)\"\n       (blur)=\"handleBlur($event); checkForDisplayFormat($event)\"\n       (focus)=\"checkForDisplayFormat($event)\"\n       [autocomplete]=\"autocomplete ? 'on' : 'off'\"\n       (keyup.enter)=\"flushViewChanges(input.value)\"\n       #input>\n<button class=\"btn-trailing-icon\" type=\"button\" name=\"trailingIcon\" *ngIf=\"trailingiconclass || trailingiconurl\" (click)=\"iconClickEvent($event, 'trailingiconclick')\">\n       <wm-app-icon [iconclass]=\"trailingiconclass\" [iconurl]=\"trailingiconurl\"></wm-app-icon>\n</button>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { 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.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: IMaskModule }, { kind: "directive", type: i3.IMaskDirective, selector: "[imask]", inputs: ["imask", "unmask", "imaskElement"], outputs: ["accept", "complete"], exportAs: ["imask"] }, { kind: "component", type: WmAppIconComponent, selector: "wm-app-icon", inputs: ["icon", "iconclass", "iconurl", "defaultIconClass", "defaultClasses", "iconStyle", "alt"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: InputTextComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: InputTextComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, imports: [CommonModule, FormsModule, IMaskModule, WmAppIconComponent], selector: 'wm-input[type="text"], wm-input:not([type]), wm-input[type="password"], wm-input[type="search"], wm-input[type="tel"], wm-input[type="url"]', providers: [
                         provideAs(InputTextComponent, NG_VALUE_ACCESSOR, true),
@@ -1081,14 +1077,14 @@ class InputNumberComponent extends BaseInput {
         // Call parent ngOnDestroy
         super.ngOnDestroy();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: InputNumberComponent, deps: [{ token: i0.Injector }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.20", type: InputNumberComponent, isStandalone: true, selector: "wm-input[type=\"number\"]", providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: InputNumberComponent, deps: [{ token: i0.Injector }, { token: 'EXPLICIT_CONTEXT', optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.21", type: InputNumberComponent, isStandalone: true, selector: "wm-input[type=\"number\"]", providers: [
             provideAs(InputNumberComponent, NG_VALUE_ACCESSOR, true),
             provideAs(InputNumberComponent, NG_VALIDATORS, true),
             provideAsWidgetRef(InputNumberComponent)
         ], viewQueries: [{ propertyName: "inputEl", first: true, predicate: ["input"], descendants: true, static: true }, { propertyName: "ngModel", first: true, predicate: NgModel, descendants: true }], usesInheritance: true, ngImport: i0, template: "<input class=\"form-control app-textbox\"\n       [ngClass]=\"{'step-hidden': step === 0}\"\n       focus-target\n       [type]=\"type\"\n       [attr.name]=\"name\"\n       [(ngModel)]=\"datavalue\"\n       [ngModelOptions]=\"ngModelOptions\"\n       [readonly]=\"readonly\"\n       [required]=\"required\"\n       [disabled]=\"disabled\"\n       [maxlength]=\"maxchars\"\n       [min]=\"minvalue\"\n       [max]=\"maxvalue\"\n       [step]=\"step\"\n       [attr.tabindex]=\"tabindex\"\n       [attr.placeholder]=\"placeholder\"\n       [attr.accesskey]=\"shortcutkey\"\n       [attr.aria-label]=\"arialabel\"\n       [autofocus]=\"autofocus\"\n       [ngClass]=\"conditionalclass\"\n       [ngStyle]=\"conditionalstyle\"\n       (blur)=\"handleBlur($event)\"\n       (ngModelChange)=\"handleChange($event)\"\n       [autocomplete]=\"autocomplete ? 'on' : 'off'\"\n       (keyup.enter)=\"flushViewChanges(input.value)\"\n       (keydown.ArrowUp)=\"onArrowPress($event)\"\n       (keydown.ArrowDown)=\"onArrowPress($event)\"\n       (keypress)=\"validateInputEntry($event)\"\n       #input>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { 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.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { 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: "21.2.20", ngImport: i0, type: InputNumberComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.21", ngImport: i0, type: InputNumberComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, imports: [CommonModule, FormsModule], selector: 'wm-input[type="number"]', providers: [
                         provideAs(InputNumberComponent, NG_VALUE_ACCESSOR, true),