use-mask-input 3.2.0 → 3.3.1

package/src/utils/getMaskOptions.spec.ts

@@ -0,0 +1,127 @@
+import { describe, it, expect } from 'vitest';
+import { getMaskOptions } from './getMaskOptions';
+
+describe('getMaskOptions', () => {
+  it('returns default options when no mask is provided', () => {
+    const options = getMaskOptions();
+    expect(options).toEqual({
+      jitMasking: false,
+    });
+  });
+
+  it('returns options for datetime mask', () => {
+    const options = getMaskOptions('datetime');
+    expect(options).toEqual({
+      alias: 'datetime',
+      inputFormat: 'dd/mm/yyyy',
+      placeholder: 'dd/mm/yyyy',
+      jitMasking: false,
+    });
+  });
+
+  it('returns options for cpf mask', () => {
+    const options = getMaskOptions('cpf');
+    expect(options).toEqual({
+      mask: '999.999.999-99',
+      placeholder: '___.___.___-__',
+      jitMasking: false,
+    });
+  });
+
+  it('returns options for email mask', () => {
+    const options = getMaskOptions('email');
+    expect(options).toEqual({
+      alias: 'email',
+      placeholder: '',
+      jitMasking: false,
+    });
+  });
+
+  it('returns options for numeric mask', () => {
+    const options = getMaskOptions('numeric');
+    expect(options).toEqual({
+      alias: 'numeric',
+      placeholder: '',
+      jitMasking: false,
+    });
+  });
+
+  it('returns options for currency mask', () => {
+    const options = getMaskOptions('currency');
+    expect(options).toEqual({
+      alias: 'currency',
+      prefix: '$ ',
+      placeholder: '',
+      jitMasking: false,
+    });
+  });
+
+  it('returns options for decimal mask', () => {
+    const options = getMaskOptions('decimal');
+    expect(options).toEqual({
+      alias: 'decimal',
+      placeholder: '',
+      jitMasking: false,
+    });
+  });
+
+  it('returns options for integer mask', () => {
+    const options = getMaskOptions('integer');
+    expect(options).toEqual({
+      alias: 'integer',
+      placeholder: '',
+      jitMasking: false,
+    });
+  });
+
+  it('returns options for percentage mask', () => {
+    const options = getMaskOptions('percentage');
+    expect(options).toEqual({
+      alias: 'percentage',
+      placeholder: ' %',
+      suffix: ' %',
+      jitMasking: false,
+    });
+  });
+
+  it('returns options for url mask', () => {
+    const options = getMaskOptions('url');
+    expect(options).toEqual({
+      alias: 'url',
+      placeholder: 'https://',
+      jitMasking: false,
+    });
+  });
+
+  it('returns options for ip mask', () => {
+    const options = getMaskOptions('ip');
+    expect(options).toEqual({
+      alias: 'ip',
+      jitMasking: false,
+    });
+  });
+
+  it('returns options for mac mask', () => {
+    const options = getMaskOptions('mac');
+    expect(options).toEqual({
+      alias: 'mac',
+      jitMasking: false,
+    });
+  });
+
+  it('returns options for ssn mask', () => {
+    const options = getMaskOptions('ssn');
+    expect(options).toEqual({
+      alias: 'ssn',
+      jitMasking: false,
+    });
+  });
+
+  it('returns options for custom mask', () => {
+    const options = getMaskOptions('999-999');
+    expect(options).toEqual({
+      mask: '999-999',
+      jitMasking: false,
+    });
+  });
+});

package/src/utils/getMaskOptions.ts

@@ -0,0 +1,92 @@
+import { Mask, Options } from '../types';
+
+export const getMaskOptions = (mask?: Mask, _options?: Options): Options => {
+  const options: Options = {
+    ..._options,
+    jitMasking: false,
+  };
+  if (!mask) return options;
+
+  const masks: Record<string, Inputmask.Options> = {
+    datetime: {
+      alias: 'datetime',
+      inputFormat: 'dd/mm/yyyy',
+      placeholder: 'dd/mm/yyyy',
+      ...options,
+    },
+    cpf: {
+      mask: '999.999.999-99',
+      placeholder: '___.___.___-__',
+      ...options,
+    },
+    cnpj: {
+      mask: '99.999.999/9999-99',
+      placeholder: '__.___.___/____-__',
+      ...options,
+    },
+    email: {
+      alias: 'email',
+      placeholder: '',
+      ...options,
+    },
+    numeric: {
+      alias: 'numeric',
+      placeholder: '',
+      ...options,
+    },
+    currency: {
+      alias: 'currency',
+      prefix: '$ ',
+      placeholder: '',
+      ...options,
+    },
+    decimal: {
+      alias: 'decimal',
+      placeholder: '',
+      ...options,
+    },
+    integer: {
+      alias: 'integer',
+      placeholder: '',
+      ...options,
+    },
+    percentage: {
+      alias: 'percentage',
+      placeholder: ' %',
+      suffix: ' %',
+      ...options,
+    },
+    url: {
+      alias: 'url',
+      placeholder: 'https://',
+      ...options,
+    },
+    ip: {
+      alias: 'ip',
+      ...options,
+    },
+    mac: {
+      alias: 'mac',
+      ...options,
+    },
+    ssn: {
+      alias: 'ssn',
+      ...options,
+    },
+
+  };
+
+  if (typeof mask === 'string') {
+    if (masks[mask]) return masks[mask];
+  } else if (typeof mask === 'object') {
+    return {
+      ...mask,
+      ...options,
+    };
+  }
+
+  return {
+    mask,
+    ...options,
+  };
+};

package/src/utils/index.ts

@@ -0,0 +1,3 @@
+export * from './flow';
+export * from './isServer';
+export * from './getMaskOptions';

package/src/utils/isServer.ts

@@ -0,0 +1,5 @@
+export const isServer = !(
+  typeof window !== 'undefined'
+  && window.document
+  && window.document.createElement
+);

package/src/withHookFormMask.ts

@@ -1,19 +1,20 @@
 import Inputmask from 'inputmask';
 import { RefCallback } from 'react';
-import { flow } from './utils';
-import { Mask, Options, Register } from './types';
+import { flow, getMaskOptions } from './utils';
+import { Mask, Options, UseFormRegisterReturn } from './types';
 
-export const withHookFormMask = (register: Register, mask: Mask, options?: Options): Register => {
+export const withHookFormMask = (
+  register: UseFormRegisterReturn,
+  mask: Mask,
+  options?: Options,
+): UseFormRegisterReturn => {
   //
   let newRef;
 
   if (register) {
     const { ref } = register;
 
-    const maskInput = Inputmask({
-      mask: mask || undefined,
-      ...options,
-    });
+    const maskInput = Inputmask(getMaskOptions(mask, options));
 
     newRef = flow((_ref: HTMLElement) => {
       if (_ref) maskInput.mask(_ref);

package/src/withMask.ts

@@ -1,15 +1,13 @@
 import Inputmask from 'inputmask';
-import { isServer } from './utils';
+import { getMaskOptions, isServer } from './utils';
 import { Input, Mask, Options } from './types';
 
-export const withMask = (mask?: Mask, options?: Options) => (input: Input) => {
+export const withMask = (mask: Mask, options?: Options) => (input: Input) => {
   //
   if (isServer) return input;
+  if (mask === null) return input;
 
-  const maskInput = Inputmask({
-    mask: mask || undefined,
-    ...options,
-  });
+  const maskInput = Inputmask(getMaskOptions(mask, options));
 
   if (input) {
     maskInput.mask(input);

package/src/utils.spec.ts

@@ -1,14 +0,0 @@
-import { describe } from 'vitest';
-
-import { flow } from './utils';
-
-describe('utils', (it) => {
-  it('flow', ({ expect }) => {
-    const res = flow(
-      (a: number) => a + 1,
-      (a:number) => a + 2,
-    )(1);
-
-    expect(res).toBe(4);
-  });
-});