fix(ref: no-ref): fix issues

.github/workflows/publish.yml

@@ -8,6 +8,8 @@ on:
 jobs:
     build:
         runs-on: ubuntu-latest
+        outputs:
+            version: ${{ steps.get_version.outputs.version }}
         steps:
             - uses: actions/checkout@v4
               with:
@@ -34,7 +36,7 @@ jobs:
               id: get_version
               run: |
                   VERSION=$(node -p "require('./dist/ngx-mask-lib/package.json').version")
-                  echo "version=$VERSION" >> $GITHUB_OUTPUT      
+                  echo "version=$VERSION" >> $GITHUB_OUTPUT
 
     slack_notification:
         needs:

.github/workflows/quality-check.yml

@@ -21,4 +21,4 @@ jobs:
             - name: Check quality
               run: |
                   bun i
-                  bash .github/workflows/scripts/quality.sh
+                  bash .github/workflows/scripts/quality.sh

CHANGELOG.md

@@ -1,3 +1,13 @@
+# 18.0.3(2024-11-05)
+
+### Fix
+
+-   Fix ([#1372](https://github.com/JsDaddy/ngx-mask/issues/1372))
+-   Fix ([#1441](https://github.com/JsDaddy/ngx-mask/issues/1441))
+-   Fix ([#1442](https://github.com/JsDaddy/ngx-mask/issues/1442))
+-   Fix ([#1440](https://github.com/JsDaddy/ngx-mask/issues/1440))
+-   Fix ([#1409](https://github.com/JsDaddy/ngx-mask/issues/1409))
+
 # 18.0.2(2024-11-01)
 
 ### Fix

package.json

@@ -1,6 +1,6 @@
 {
     "name": "ngx-mask",
-    "version": "18.0.2",
+    "version": "18.0.3",
     "description": "Awesome ngx mask",
     "license": "MIT",
     "engines": {

projects/ngx-mask-lib/package.json

@@ -1,6 +1,6 @@
 {
     "name": "ngx-mask",
-    "version": "18.0.2",
+    "version": "18.0.3",
     "description": "awesome ngx mask",
     "keywords": [
         "ng2-mask",

projects/ngx-mask-lib/src/lib/ngx-mask-expression.enum.ts

@@ -12,6 +12,7 @@ export const enum MaskExpression {
     HOURS_HOUR = 'Hh',
     SECONDS = 's0',
     HOURS_MINUTES_SECONDS = 'Hh:m0:s0',
+    EMAIL_MASK = 'A*@A*.A*',
     HOURS_MINUTES = 'Hh:m0',
     MINUTES_SECONDS = 'm0:s0',
     DAYS_MONTHS_YEARS = 'd0/M0/0000',

projects/ngx-mask-lib/src/lib/ngx-mask.directive.ts

@@ -280,7 +280,15 @@ export class NgxMaskDirective implements ControlValueAccessor, OnChanges, Valida
         if (timeMasks.includes(this._maskValue)) {
             return this._validateTime(processedValue);
         }
+        if (this._maskValue === MaskExpression.EMAIL_MASK) {
+            const emailPattern = /^[^@]+@[^@]+\.[^@]+$/;
 
+            if (!emailPattern.test(processedValue) && processedValue) {
+                return this._createValidationError(processedValue);
+            } else {
+                return null;
+            }
+        }
         if (processedValue && processedValue.length >= 1) {
             let counterOfOpt = 0;
 
@@ -461,7 +469,11 @@ export class NgxMaskDirective implements ControlValueAccessor, OnChanges, Valida
                     const selStart = Number(this._maskService.selStart) - prefixLength;
                     const selEnd = Number(this._maskService.selEnd) - prefixLength;
 
-                    if (this._code === MaskExpression.BACKSPACE) {
+                    const backspaceOrDelete =
+                        this._code === MaskExpression.BACKSPACE ||
+                        this._code === MaskExpression.DELETE;
+
+                    if (backspaceOrDelete) {
                         if (!selectRangeBackspace) {
                             if (this._maskService.selStart === prefixLength) {
                                 this._maskService.actualValue = `${this.prefix}${this._maskService.maskIsShown.slice(0, selEnd)}${this._inputValue.split(this.prefix).join('')}`;
@@ -505,8 +517,9 @@ export class NgxMaskDirective implements ControlValueAccessor, OnChanges, Valida
                                 this._maskService.actualValue = `${part1}${this._maskService.placeHolderCharacter}${part2}`;
                             }
                         }
+                        position = this._code === MaskExpression.DELETE ? position + 1 : position;
                     }
-                    if (this._code !== MaskExpression.BACKSPACE) {
+                    if (!backspaceOrDelete) {
                         if (!checkSymbols && !checkSpecialCharacter && selectRangeBackspace) {
                             position = Number(el.selectionStart) - 1;
                         } else if (
@@ -996,6 +1009,7 @@ export class NgxMaskDirective implements ControlValueAccessor, OnChanges, Valida
                 if (typeof this.inputTransformFn !== 'function') {
                     this._maskService.writingValue = true;
                 }
+
                 this._maskService.formElementProperty = [
                     'value',
                     this._maskService.applyMask(inputValue, this._maskService.maskExpression),

projects/ngx-mask-lib/src/lib/ngx-mask.service.ts

@@ -206,6 +206,7 @@ export class NgxMaskService extends NgxMaskApplierService {
             this._emitValue =
                 this._previousValue !== this._currentValue ||
                 this.maskChanged ||
+                this.writingValue ||
                 (this._previousValue === this._currentValue && justPasted);
         }
 
@@ -215,6 +216,7 @@ export class NgxMaskService extends NgxMaskApplierService {
                 ? requestAnimationFrame(() => this.formControlResult(result))
                 : this.formControlResult(result)
             : '';
+
         if (!this.showMaskTyped || (this.showMaskTyped && this.hiddenInput)) {
             if (this.hiddenInput) {
                 if (backspaced) {
@@ -530,6 +532,10 @@ export class NgxMaskService extends NgxMaskApplierService {
      * @param inputValue the current form input value
      */
     private formControlResult(inputValue: string): void {
+        if (this.writingValue && !inputValue) {
+            this.onChange('');
+            return;
+        }
         if (this.writingValue || (!this.triggerOnMaskChange && this.maskChanged)) {
             // eslint-disable-next-line no-unused-expressions,@typescript-eslint/no-unused-expressions
             this.triggerOnMaskChange && this.maskChanged
@@ -583,9 +589,11 @@ export class NgxMaskService extends NgxMaskApplierService {
         ) {
             return value;
         }
-        if (String(value).length > 16 && this.separatorLimit.length > 14) {
+
+        if (String(value).length > 14 && this.maskExpression.startsWith(MaskExpression.SEPARATOR)) {
             return String(value);
         }
+
         const num = Number(value);
         if (this.maskExpression.startsWith(MaskExpression.SEPARATOR) && Number.isNaN(num)) {
             const val = String(value).replace(',', '.');
@@ -686,7 +694,7 @@ export class NgxMaskService extends NgxMaskApplierService {
             if (processedResult === this.decimalMarker) {
                 return null;
             }
-            if (this.separatorLimit.length > 14) {
+            if (separatorValue.length > 14) {
                 return String(separatorValue);
             }
             return this._checkPrecision(this.maskExpression, separatorValue);

projects/ngx-mask-lib/src/test/basic-logic.spec.ts

@@ -969,4 +969,56 @@ describe('Directive: Mask', () => {
 
         expect(component.form.dirty).toBe(false);
     });
+
+    it('mask sepator.2 after setValue should be dont dirty', () => {
+        component.mask = 'separator.0';
+        component.form.setValue('2002');
+
+        expect(component.form.dirty).toBe(false);
+    });
+
+    it('should return empty string in formControl mask SSS-SSS-SSS', () => {
+        component.mask = 'SSS-SSS-SSS';
+        component.form.setValue('978-1-93624-386-0');
+        const debugElement: DebugElement = fixture.debugElement.query(By.css('input'));
+        const inputTarget: HTMLInputElement = debugElement.nativeElement as HTMLInputElement;
+        spyOnProperty(document, 'activeElement').and.returnValue(inputTarget);
+        fixture.detectChanges();
+
+        expect(inputTarget.value).toBe('');
+    });
+
+    it('should return empty string in formControl mask AAA-AAA-AAA', () => {
+        component.mask = 'AAA-AAA-AAA';
+        component.form.setValue('978-123-936');
+        const debugElement: DebugElement = fixture.debugElement.query(By.css('input'));
+        const inputTarget: HTMLInputElement = debugElement.nativeElement as HTMLInputElement;
+        spyOnProperty(document, 'activeElement').and.returnValue(inputTarget);
+        fixture.detectChanges();
+
+        expect(inputTarget.value).toBe('');
+    });
+
+    it('should return empty string in formControl mask (000) 000-000', () => {
+        component.mask = '(000) 000-000';
+        component.form.setValue('978-123-936');
+        const debugElement: DebugElement = fixture.debugElement.query(By.css('input'));
+        const inputTarget: HTMLInputElement = debugElement.nativeElement as HTMLInputElement;
+        spyOnProperty(document, 'activeElement').and.returnValue(inputTarget);
+        fixture.detectChanges();
+
+        expect(inputTarget.value).toBe('');
+    });
+
+    it('should return empty string in formControl mask (000) 000-000 with prefix +7', () => {
+        component.mask = '(000) 000-000';
+        component.prefix = '+7 ';
+        component.form.setValue('978-123-936');
+        const debugElement: DebugElement = fixture.debugElement.query(By.css('input'));
+        const inputTarget: HTMLInputElement = debugElement.nativeElement as HTMLInputElement;
+        spyOnProperty(document, 'activeElement').and.returnValue(inputTarget);
+        fixture.detectChanges();
+
+        expect(inputTarget.value).toBe('');
+    });
 });