packages/pass/components/Form/Field/masks/credit-card.ts

   1 import type { FactoryOpts } from 'imask';
   2 import MaskedRange from 'imask/esm/masked/range';
   3
   4 export const cardNumberMask = (value: string): FactoryOpts => {
   5     switch (Number(value.slice(0, 2))) {
   6         /* AMEX */
   7         case 34:
   8         case 37:
   9             return { mask: '0000 000000 00000' };
  10         default:
  11             return { mask: '0000 0000 0000 0000 000' };
  12     }
  13 };
  14
  15 export const cardNumberHiddenValue = (value: string): string => {
  16     if (!value.length) {
  17         return '';
  18     }
  19     if (value.length < 12) {
  20         return '•••• •••• •••• ••••';
  21     }
  22
  23     const firstFour = value.slice(0, 4);
  24     const lastFour = value.slice(-4);
  25
  26     switch (Number(value.slice(0, 2))) {
  27         case 34:
  28         case 37:
  29             return `${firstFour} •••••• •${lastFour}`;
  30         default:
  31             return `${firstFour} •••• •••• ${lastFour}`;
  32     }
  33 };
  34
  35 export const expDateMask = {
  36     mask: 'MM/YY',
  37     blocks: {
  38         MM: {
  39             mask: MaskedRange,
  40             from: 1,
  41             to: 12,
  42         },
  43         YY: {
  44             mask: MaskedRange,
  45             from: 0,
  46             to: 99,
  47         },
  48     },
  49 } as FactoryOpts;