diff --git a/docs/vanilla.md b/docs/vanilla.md index 4de9b32..f77eb2f 100644 --- a/docs/vanilla.md +++ b/docs/vanilla.md @@ -289,3 +289,43 @@ import { getNavigatorCurrentLocation } from "utils-react"; getNavigatorCurrentLocation().then((location) => console.log(location)); ``` + +## phoneMask + +Mask a phone number. + +```js +import { phoneMask } from "utils-react"; + +phoneMask("1234567890"); // (12) 3456-7890 +``` + +## cpfMask + +Mask a CPF number. + +```js +import { cpfMask } from "utils-react"; + +cpfMask("12345678900"); // 123.456.789-00 +``` + +## cnpjMask + +Mask a CNPJ number. + +```js +import { cnpjMask } from "utils-react"; + +cnpjMask("12345678900000"); // 12.345.678/9000-00 +``` + +## cepMask + +Mask a CEP number. + +```js +import { cepMask } from "utils-react"; + +cepMask("12345678"); // 12345-678 +``` diff --git a/src/__test__/index.test.ts b/src/__test__/index.test.ts index fa4e215..807fe4c 100644 --- a/src/__test__/index.test.ts +++ b/src/__test__/index.test.ts @@ -24,6 +24,10 @@ import { generateRandomString, generateRandomColor, getNavigatorCurrentLocation, + phoneMask, + cpfMask, + cnpjMask, + cepMask, } from "../index"; describe("all methods in the package", () => { @@ -169,4 +173,20 @@ describe("all methods in the package", () => { timestamp: 123, }); }); + + it("phone mask", () => { + expect(phoneMask("11999999999")).toBe("(11) 99999-9999"); + }); + + it("cpf mask", () => { + expect(cpfMask("99999999999")).toBe("999.999.999-99"); + }); + + it("cnpj mask", () => { + expect(cnpjMask("99999999999999")).toBe("99.999.999/9999-99"); + }); + + it("cep mask", () => { + expect(cepMask("99999999")).toBe("99999-999"); + }); }); diff --git a/src/modules/index.ts b/src/modules/index.ts index e23d14f..82463cc 100644 --- a/src/modules/index.ts +++ b/src/modules/index.ts @@ -195,3 +195,38 @@ export const getNavigatorCurrentLocation = async ({ return { coords, timestamp }; }; + +export const phoneMask = (value: string) => { + return value + .replace(/\D/g, "") + .replace(/(\d{2})(\d)/, "($1) $2") + .replace(/(\d{5})(\d)/, "$1-$2") + .replace(/(-\d{4})\d+?$/, "$1"); +}; + +export const cpfMask = (value: string) => { + return value + .replace(/\D/g, "") + .replace(/(\d{3})(\d)/, "$1.$2") + .replace(/(\d{3})(\d)/, "$1.$2") + .replace(/(\d{3})(\d)/, "$1-$2") + .replace(/(-\d{2})\d+?$/, "$1"); +}; + +export const cnpjMask = (value: string) => { + return value + .replace(/\D/g, "") + .replace(/(\d{2})(\d)/, "$1.$2") + .replace(/(\d{3})(\d)/, "$1.$2") + .replace(/(\d{3})(\d)/, "$1/$2") + .replace(/(\d{4})(\d)/, "$1-$2") + .replace(/(-\d{2})\d+?$/, "$1"); +}; + +export const cepMask = (value: string) => { + if (value.length > 9) { + return value.slice(0, 9); + } + + return value.replace(/\D/g, "").replace(/(\d{5})(\d)/, "$1-$2"); +};