feat(ref: no-ref): chane @input, @Ouput to signal

JsDaddy · Nov 28, 2024 · 3bd6957 · 3bd6957
1 parent 566b948
commit 3bd6957
Show file tree

Hide file tree

Showing 8 changed files with 1,017 additions and 830 deletions.
diff --git a/bun.lockb b/bun.lockb
diff --git a/package.json b/package.json
@@ -74,6 +74,7 @@
         "cypress": "^13.16.0",
         "highlight.js": "11.10.0",
         "ngx-highlightjs": "12.0.0",
+        "ngxtension": "^4.1.0",
         "rxjs": "7.8.1",
         "semantic-release": "24.2.0",
         "semantic-release-export-data": "^1.1.0",

diff --git a/projects/ngx-mask-lib/src/lib/ngx-mask-applier.service.ts b/projects/ngx-mask-lib/src/lib/ngx-mask-applier.service.ts
diff --git a/projects/ngx-mask-lib/src/lib/ngx-mask.directive.ts b/projects/ngx-mask-lib/src/lib/ngx-mask.directive.ts
diff --git a/projects/ngx-mask-lib/src/lib/ngx-mask.pipe.ts b/projects/ngx-mask-lib/src/lib/ngx-mask.pipe.ts
@@ -1,4 +1,5 @@
 import type { PipeTransform } from '@angular/core';
+import { signal } from '@angular/core';
 import { inject, Pipe } from '@angular/core';
 
 import type { NgxMaskConfig } from './ngx-mask.config';
@@ -12,14 +13,12 @@ import { MaskExpression } from './ngx-mask-expression.enum';
     standalone: true,
 })
 export class NgxMaskPipe implements PipeTransform {
-    private readonly defaultOptions = inject<NgxMaskConfig>(NGX_MASK_CONFIG);
+    private _maskExpressionArray = signal<string[]>([]);
+    private mask = signal<string>('');
 
+    private readonly defaultOptions = inject<NgxMaskConfig>(NGX_MASK_CONFIG);
     private readonly _maskService = inject(NgxMaskService);
 
-    private _maskExpressionArray: string[] = [];
-
-    private mask = '';
-
     public transform(
         value: string | number,
         mask: string,
@@ -32,7 +31,7 @@ export class NgxMaskPipe implements PipeTransform {
             ...this.defaultOptions,
             ...config,
             patterns: {
-                ...this._maskService.patterns,
+                ...this._maskService.patterns(),
                 ...patterns,
             },
         };
@@ -44,14 +43,14 @@ export class NgxMaskPipe implements PipeTransform {
         if (mask.includes('||')) {
             const maskParts = mask.split('||');
             if (maskParts.length > 1) {
-                this._maskExpressionArray = maskParts.sort(
-                    (a: string, b: string) => a.length - b.length
+                this._maskExpressionArray.set(
+                    maskParts.sort((a: string, b: string) => a.length - b.length)
                 );
                 this._setMask(processedValue as string);
-                return this._maskService.applyMask(`${processedValue}`, this.mask);
+                return this._maskService.applyMask(`${processedValue}`, this.mask());
             } else {
-                this._maskExpressionArray = [];
-                return this._maskService.applyMask(`${processedValue}`, this.mask);
+                this._maskExpressionArray.set([]);
+                return this._maskService.applyMask(`${processedValue}`, this.mask());
             }
         }
 
@@ -64,44 +63,44 @@ export class NgxMaskPipe implements PipeTransform {
 
         if (mask.startsWith(MaskExpression.SEPARATOR)) {
             if (config.decimalMarker) {
-                this._maskService.decimalMarker = config.decimalMarker;
+                this._maskService.decimalMarker.set(config.decimalMarker);
             }
             if (config.thousandSeparator) {
-                this._maskService.thousandSeparator = config.thousandSeparator;
+                this._maskService.thousandSeparator.set(config.thousandSeparator);
             }
             if (config.leadZero) {
-                this._maskService.leadZero = config.leadZero;
+                this._maskService.leadZero.set(config.leadZero);
             }
 
             processedValue = String(processedValue);
             const localeDecimalMarker = this._maskService.currentLocaleDecimalMarker();
 
-            if (!Array.isArray(this._maskService.decimalMarker)) {
+            if (!Array.isArray(this._maskService.decimalMarker())) {
                 processedValue =
-                    this._maskService.decimalMarker !== localeDecimalMarker
+                    this._maskService.decimalMarker() !== localeDecimalMarker
                         ? (processedValue as string).replace(
                               localeDecimalMarker,
-                              this._maskService.decimalMarker
+                              this._maskService.decimalMarker() as string
                           )
                         : processedValue;
             }
 
             if (
-                this._maskService.leadZero &&
+                this._maskService.leadZero() &&
                 processedValue &&
-                this._maskService.dropSpecialCharacters !== false
+                this._maskService.dropSpecialCharacters() !== false
             ) {
                 processedValue = this._maskService._checkPrecision(mask, processedValue as string);
             }
 
-            if (this._maskService.decimalMarker === MaskExpression.COMMA) {
+            if (this._maskService.decimalMarker() === MaskExpression.COMMA) {
                 processedValue = (processedValue as string).replace(
                     MaskExpression.DOT,
                     MaskExpression.COMMA
                 );
             }
 
-            this._maskService.isNumberValue = true;
+            this._maskService.isNumberValue.set(true);
         }
 
         if (processedValue === null || typeof processedValue === 'undefined') {
@@ -113,18 +112,18 @@ export class NgxMaskPipe implements PipeTransform {
 
     private _setMask(value: string) {
         if (this._maskExpressionArray.length > 0) {
-            this._maskExpressionArray.some((mask): boolean | void => {
+            this._maskExpressionArray().some((mask): boolean | void => {
                 const test =
                     this._maskService.removeMask(value)?.length <=
                     this._maskService.removeMask(mask)?.length;
                 if (value && test) {
-                    this.mask = mask;
+                    this.mask.set(mask);
                     return test;
                 } else {
                     const expression =
-                        this._maskExpressionArray[this._maskExpressionArray.length - 1] ??
+                        this._maskExpressionArray()[this._maskExpressionArray().length - 1] ??
                         MaskExpression.EMPTY_STRING;
-                    this.mask = expression;
+                    this.mask.set(expression);
                 }
             });
         }