refactor(addon-commerce): InputCard uses maskito pipe

taiga-family · May 5, 2023 · bcd235c · bcd235c
1 parent a880b35
commit bcd235c
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 12 deletions.
diff --git a/projects/addon-commerce/components/input-card/input-card.component.ts b/projects/addon-commerce/components/input-card/input-card.component.ts
@@ -8,9 +8,9 @@ import {
     ViewChild,
 } from '@angular/core';
 import {NgControl} from '@angular/forms';
-import {MaskitoOptions, maskitoTransform} from '@maskito/core';
+import {MaskitoOptions} from '@maskito/core';
 import {TUI_CARD_MASK} from '@taiga-ui/addon-commerce/constants';
-import {tuiAsControl, tuiAsFocusableItemAccessor, tuiPure} from '@taiga-ui/cdk';
+import {tuiAsControl, tuiAsFocusableItemAccessor} from '@taiga-ui/cdk';
 import {TuiPrimitiveTextfieldComponent} from '@taiga-ui/core';
 
 import {AbstractTuiInputCard} from './abstract-input-card';
@@ -57,10 +57,6 @@ export class TuiInputCardComponent extends AbstractTuiInputCard<string> {
         return !!this.input && this.input.focused;
     }
 
-    get formattedCard(): string {
-        return this.getFormattedCard(this.card, this.maskOptions);
-    }
-
     onValueChange(value: string): void {
         const parsed = value.split(' ').join('');
         const currentBin = this.bin;
@@ -93,9 +89,4 @@ export class TuiInputCardComponent extends AbstractTuiInputCard<string> {
     protected override getFallbackValue(): string {
         return '';
     }
-
-    @tuiPure
-    private getFormattedCard(cardNumber: string, maskOptions: MaskitoOptions): string {
-        return maskitoTransform(cardNumber, maskOptions);
-    }
 }
diff --git a/projects/addon-commerce/components/input-card/input-card.template.html b/projects/addon-commerce/components/input-card/input-card.template.html
@@ -11,7 +11,7 @@
     [pseudoActive]="pseudoActive"
     [pseudoFocus]="pseudoFocus"
     [maskito]="maskOptions"
-    [value]="formattedCard"
+    [value]="card | maskito : maskOptions"
     (valueChange)="onValueChange($event)"
     (focusedChange)="onFocused($event)"
 >