X-Brain Masks
xbrain-react-masks
provide useful masks for your components.
Installation
Using yarn:
yarn add xbrain-react-masks
Using npm:
npm install --save xbrain-react-masks
Available Masks
Name | Pattern |
---|---|
CepMask | 00000-000 |
Cnpj8Mask | 00.000.000?/0000-00 |
CnpjMask | 00.000.000/0000-00 |
CpfMask | 000.000.000-00 |
DateHourMinuteMask | 00/00/0000 00:00 |
DateMask | 00/00/0000 |
DateMonthYearMask | 00/0000 |
DateMonthYearSmallMask | 00/00 |
HourMinuteMask | 00:00 |
HybridCnpj8Mask | 00.000.000/0000-00 |
HybridCpfCnpj | 000.000.000-00 or 00.000.000/0000-00 |
HybridPhoneMask | (00) 0000-0000? |
MobilePhoneMask | (00) 00000-0000 |
PhoneMask | (00) 0000-0000 |
PositiveNumbersMask | only positive numbers |
CurrencyMask | currency mask |
Each mask (except for HybridPhoneMask) has a static attribute called
pattern
that exposes the mask pattern, e.g.CpfMask.pattern
Example
// with redux-form and material-ui; ... <Field name="cpf" InputProps= inputComponent: CpfMask component=TextField label="CPF"/>