GoncharukOrg / react-input

111 stars 9 forks source link

Suggestion for Issue Implementation: #40

Open douglaszaltron opened 3 weeks ago

douglaszaltron commented 3 weeks ago

Problem: We need to support multiple formats for phone numbers and documents (like CPF and CNPJ) in Brazil. To make the mask handling more flexible, we can pass an array of possible mask formats to the component. This allows the component to automatically adjust and support various formats for different types of data (e.g., phone numbers with 8 or 9 digits, CPF, CNPJ).

Solution: The mask prop in the component will accept an array of mask formats. For example, phone numbers could have two different formats, and the same could apply to CPF and CNPJ.

// Example for Brazilian phone numbers (8 or 9 digits)
const phoneMasks = ['(__)____-____', '(__)_____-____'];

// Example for documents (CPF and CNPJ)
const documentMasks = ['___.___.___-__', '__.___.___/____-__'];

// Example for address ip
const ipMasks = ['_._._._', '__.__.__.__', '___.___.___.___'];

This approach allows the component to easily support multiple mask formats, which is useful when different data types require different formats. The component would automatically adapt based on the format array provided.