ngx-mask 19.0.2 → 19.0.3

package/README.md

@@ -189,6 +189,14 @@ const maskConfigFunction: () => Partial<NgxMaskConfig> = () => {
 
 Then, just define masks in inputs.
 
+## Actively supported versions
+
+ngx-mask follows the official Angular support policy, supporting the Active and LTS (Long-Term Support) versions of Angular. As of the latest release, Angular v17 and newer are supported.
+
+Projects using Angular versions outside the supported range (e.g., older than v17) should use the last compatible version of ngx-mask. However, these versions will no longer receive updates, bug fixes, or new features.
+
+For detailed information about Angular's versioning and support schedule, visit the official [Angular releases page](https://angular.dev/reference/releases#actively-supported-versions).
+
 ## Usage
 
 Text [documentation](https://github.com/JsDaddy/ngx-mask/blob/develop/USAGE.md)

package/fesm2022/ngx-mask.mjs

@@ -60,7 +60,7 @@ const initialConfig = {
     showMaskTyped: false,
     placeHolderCharacter: '_',
     dropSpecialCharacters: true,
-    hiddenInput: null,
+    hiddenInput: false,
     shownMaskExpression: '',
     separatorLimit: '',
     allowNegativeNumbers: false,
@@ -455,7 +455,7 @@ class NgxMaskApplierService {
                                 ? processedPosition + 1
                                 : processedPosition;
                             cursor += 1;
-                            this._shiftStep(maskExpression, cursor, inputArray.length);
+                            this._shiftStep(cursor);
                             i--;
                             if (this.leadZeroDateTime) {
                                 result += '0';
@@ -491,7 +491,7 @@ class NgxMaskApplierService {
                                 ? processedPosition + 1
                                 : processedPosition;
                             cursor += 1;
-                            this._shiftStep(maskExpression, cursor, inputArray.length);
+                            this._shiftStep(cursor);
                             i--;
                             if (this.leadZeroDateTime) {
                                 result += '0';
@@ -530,7 +530,7 @@ class NgxMaskApplierService {
                                 ? processedPosition + 1
                                 : processedPosition;
                             cursor += 1;
-                            this._shiftStep(maskExpression, cursor, inputArray.length);
+                            this._shiftStep(cursor);
                             i--;
                             if (this.leadZeroDateTime) {
                                 result += '0';
@@ -580,7 +580,7 @@ class NgxMaskApplierService {
                                 ? processedPosition + 1
                                 : processedPosition;
                             cursor += 1;
-                            this._shiftStep(maskExpression, cursor, inputArray.length);
+                            this._shiftStep(cursor);
                             i--;
                             if (this.leadZeroDateTime) {
                                 result += '0';
@@ -599,12 +599,12 @@ class NgxMaskApplierService {
                 else if (this.specialCharacters.indexOf(maskExpression[cursor] ?? MaskExpression.EMPTY_STRING) !== -1) {
                     result += maskExpression[cursor];
                     cursor++;
-                    this._shiftStep(maskExpression, cursor, inputArray.length);
+                    this._shiftStep(cursor);
                     i--;
                 }
                 else if (maskExpression[cursor] === MaskExpression.NUMBER_NINE &&
                     this.showMaskTyped) {
-                    this._shiftStep(maskExpression, cursor, inputArray.length);
+                    this._shiftStep(cursor);
                 }
                 else if (this.patterns[maskExpression[cursor] ?? MaskExpression.EMPTY_STRING] &&
                     this.patterns[maskExpression[cursor] ?? MaskExpression.EMPTY_STRING]?.optional) {
@@ -646,7 +646,8 @@ class NgxMaskApplierService {
                 }
             }
         }
-        if (result.length + 1 === maskExpression.length &&
+        if (result[processedPosition - 1] &&
+            result.length + 1 === maskExpression.length &&
             this.specialCharacters.indexOf(maskExpression[maskExpression.length - 1] ?? MaskExpression.EMPTY_STRING) !== -1) {
             result += maskExpression[maskExpression.length - 1];
         }
@@ -812,11 +813,8 @@ class NgxMaskApplierService {
         }
         return char;
     }
-    _shiftStep(maskExpression, cursor, inputLength) {
-        const shiftStep = /[*?]/g.test(maskExpression.slice(0, cursor))
-            ? inputLength
-            : cursor;
-        this._shift.add(shiftStep + this.prefix.length || 0);
+    _shiftStep(cursor) {
+        this._shift.add(cursor + this.prefix.length || 0);
     }
     _compareOrIncludes(value, comparedValue, excludedValue) {
         return Array.isArray(comparedValue)
@@ -913,36 +911,67 @@ class NgxMaskService extends NgxMaskApplierService {
             : MaskExpression.EMPTY_STRING;
         let newInputValue = '';
         let newPosition = position;
-        if (this.hiddenInput !== null && !this.writingValue) {
+        if ((this.hiddenInput ||
+            (inputValue && inputValue.indexOf(MaskExpression.SYMBOL_STAR) >= 0)) &&
+            !this.writingValue) {
             let actualResult = inputValue && inputValue.length === 1
                 ? inputValue.split(MaskExpression.EMPTY_STRING)
                 : this.actualValue.split(MaskExpression.EMPTY_STRING);
+            if (backspaced) {
+                actualResult = actualResult
+                    .slice(0, position)
+                    .concat(actualResult.slice(position + 1));
+            }
+            if (this.showMaskTyped) {
+                inputValue = this.removeMask(inputValue);
+                actualResult = this.removeMask(actualResult.join('')).split(MaskExpression.EMPTY_STRING);
+            }
             if (typeof this.selStart === 'object' && typeof this.selEnd === 'object') {
                 this.selStart = Number(this.selStart);
                 this.selEnd = Number(this.selEnd);
             }
             else {
-                inputValue !== MaskExpression.EMPTY_STRING && actualResult.length
-                    ? typeof this.selStart === 'number' && typeof this.selEnd === 'number'
-                        ? inputValue.length > actualResult.length
-                            ? actualResult.splice(this.selStart, 0, getSymbol)
-                            : inputValue.length < actualResult.length
-                                ? actualResult.length - inputValue.length === 1
-                                    ? backspaced
-                                        ? actualResult.splice(this.selStart - 1, 1)
-                                        : actualResult.splice(inputValue.length - 1, 1)
-                                    : actualResult.splice(this.selStart, this.selEnd - this.selStart)
-                                : null
-                        : null
-                    : (actualResult = []);
+                if (inputValue !== MaskExpression.EMPTY_STRING && actualResult.length) {
+                    if (typeof this.selStart === 'number' && typeof this.selEnd === 'number') {
+                        if (inputValue.length > actualResult.length) {
+                            actualResult.splice(this.selStart, 0, getSymbol);
+                        }
+                        else if (inputValue.length < actualResult.length) {
+                            if (actualResult.length - inputValue.length === 1) {
+                                if (backspaced) {
+                                    actualResult.splice(this.selStart - 1, 1);
+                                }
+                                else {
+                                    actualResult.splice(inputValue.length - 1, 1);
+                                }
+                            }
+                            else {
+                                actualResult.splice(this.selStart, this.selEnd - this.selStart);
+                            }
+                        }
+                    }
+                }
+                else {
+                    actualResult = [];
+                }
             }
             if (this.showMaskTyped && !this.hiddenInput) {
                 newInputValue = this.removeMask(inputValue);
             }
-            newInputValue =
-                this.actualValue.length && actualResult.length <= inputValue.length
-                    ? this.shiftTypedSymbols(actualResult.join(MaskExpression.EMPTY_STRING))
-                    : inputValue;
+            if (this.actualValue.length) {
+                if (actualResult.length < inputValue.length) {
+                    newInputValue = this.shiftTypedSymbols(actualResult.join(MaskExpression.EMPTY_STRING));
+                }
+                else if (actualResult.length === inputValue.length) {
+                    newInputValue = actualResult.join(MaskExpression.EMPTY_STRING);
+                }
+                else {
+                    newInputValue = inputValue;
+                }
+            }
+            else {
+                newInputValue = inputValue;
+            }
         }
         if (justPasted && (this.hiddenInput || !this.hiddenInput)) {
             newInputValue = inputValue;
@@ -965,7 +994,7 @@ class NgxMaskService extends NgxMaskApplierService {
         if (this.showMaskTyped &&
             this.placeHolderCharacter.length === 1 &&
             !this.leadZeroDateTime) {
-            newInputValue = this.removeMask(inputValue);
+            newInputValue = this.removeMask(newInputValue);
         }
         if (this.maskChanged) {
             newInputValue = inputValue;
@@ -1013,9 +1042,6 @@ class NgxMaskService extends NgxMaskApplierService {
             : '';
         if (!this.showMaskTyped || (this.showMaskTyped && this.hiddenInput)) {
             if (this.hiddenInput) {
-                if (backspaced) {
-                    return this.hideInput(result, this.maskExpression);
-                }
                 return `${this.hideInput(result, this.maskExpression)}${this.maskIsShown.slice(result.length)}`;
             }
             return result;
@@ -1258,7 +1284,7 @@ class NgxMaskService extends NgxMaskApplierService {
     }
     formControlResult(inputValue) {
         if (this.writingValue && !inputValue) {
-            this.onChange(this.outputTransformFn(''));
+            this.onChange(this.outputTransformFn(null));
             return;
         }
         if (this.writingValue || (!this.triggerOnMaskChange && this.maskChanged)) {
@@ -1558,6 +1584,9 @@ class NgxMaskDirective {
         }
         if (hiddenInput) {
             this._maskService.hiddenInput = hiddenInput.currentValue;
+            if (hiddenInput.previousValue === true && hiddenInput.currentValue === false) {
+                this._inputValue.set(this._maskService.actualValue);
+            }
         }
         if (showMaskTyped) {
             this._maskService.showMaskTyped = showMaskTyped.currentValue;
@@ -2258,11 +2287,12 @@ class NgxMaskDirective {
                 }
             }
             else {
+                const cleanMask = this._maskService.removeMask(mask);
                 const check = this._maskService
                     .removeMask(this._inputValue())
                     ?.split(MaskExpression.EMPTY_STRING)
                     .every((character, index) => {
-                    const indexMask = mask.charAt(index);
+                    const indexMask = cleanMask.charAt(index);
                     return this._maskService._checkSymbolMask(character, indexMask);
                 });
                 if (check || this._justPasted()) {