A simple JavaScript utility to format CPF and CNPJ numbers automatically based on the input length.
npm install cpf-cnpj-formatterconst formatCPFCNPJ = require('cpf-cnpj-formatter');
// Format as CPF (11 digits or less)
console.log(formatCPFCNPJ('12345678901')); // Output: 123.456.789-01
console.log(formatCPFCNPJ('123456789')); // Output: 123.456.789
// Format as CNPJ (more than 11 digits)
console.log(formatCPFCNPJ('12345678901234')); // Output: 12.345.678/9012-34
console.log(formatCPFCNPJ('123456789012')); // Output: 12.345.678/9012- Automatically detects if the input should be formatted as CPF or CNPJ based on length
- Removes all non-numeric characters from input
- Limits CPF to 11 digits
- Limits CNPJ to 14 digits
- Formats CPF as XXX.XXX.XXX-XX
- Formats CNPJ as XX.XXX.XXX/XXXX-XX
import React, { useState } from 'react';
import { useForm } from 'react-hook-form';
import formatCPFCNPJ from 'cpf-cnpj-formatter';
const Example = () => {
const { register, handleSubmit, setValue } = useForm();
const [maskedValue, setMaskedValue] = useState('');
const handleInputChange = (e) => {
const value = e.target.value;
const numbers = value.replace(/\D/g, '');
const limitedNumbers = numbers.length <= 11
? numbers.slice(0, 11)
: numbers.slice(0, 14);
const masked = formatCPFCNPJ(limitedNumbers);
setMaskedValue(masked);
setValue('document', limitedNumbers);
};
return (
<input
type="text"
value={maskedValue}
onChange={handleInputChange}
placeholder="Enter CPF or CNPJ"
/>
);
};Uma utilidade JavaScript simples para formatar números de CPF e CNPJ automaticamente com base no tamanho da entrada.
npm install cpf-cnpj-formatterconst formatCPFCNPJ = require('cpf-cnpj-formatter');
// Formatar como CPF (11 dígitos ou menos)
console.log(formatCPFCNPJ('12345678901')); // Saída: 123.456.789-01
console.log(formatCPFCNPJ('123456789')); // Saída: 123.456.789
// Formatar como CNPJ (mais de 11 dígitos)
console.log(formatCPFCNPJ('12345678901234')); // Saída: 12.345.678/9012-34
console.log(formatCPFCNPJ('123456789012')); // Saída: 12.345.678/9012- Detecta automaticamente se a entrada deve ser formatada como CPF ou CNPJ com base no tamanho
- Remove todos os caracteres não numéricos da entrada
- Limita CPF a 11 dígitos
- Limita CNPJ a 14 dígitos
- Formata CPF como XXX.XXX.XXX-XX
- Formata CNPJ como XX.XXX.XXX/XXXX-XX
import React, { useState } from 'react';
import { useForm } from 'react-hook-form';
import formatCPFCNPJ from 'cpf-cnpj-formatter';
const Example = () => {
const { register, handleSubmit, setValue } = useForm();
const [maskedValue, setMaskedValue] = useState('');
const handleInputChange = (e) => {
const value = e.target.value;
const numbers = value.replace(/\D/g, '');
const limitedNumbers = numbers.length <= 11
? numbers.slice(0, 11)
: numbers.slice(0, 14);
const masked = formatCPFCNPJ(limitedNumbers);
setMaskedValue(masked);
setValue('document', limitedNumbers);
};
return (
<input
type="text"
value={maskedValue}
onChange={handleInputChange}
placeholder="Digite CPF ou CNPJ"
/>
);
};MIT