Quero criar componentes com o TextInput, sendo que o padrão é o meu componente de Input sem máscara, e os filhos terão máscara ou alguma outra tratativa.
Tenho atualmente o Input padrão que contém apenas os estilos e retornam o texto cru ao digitar. Também tenho um Input com máscara de CPF / CNPJ, e na hora de exportar estou usando um arquivo index.js que apenas contém esses dois componentes e os exporta.
index.js
import Input from './Input'
import CpfCnpj from './input-masks/InputCpfCnpj'
export { CpfCnpj }
export default Input
Porém gostaria de utilizar dessa forma quando quiser usar sem máscaras:
<Input {...this.props} />
E assim quando precisar de alguma máscara:
<Input.CpfCnpj {...this.props} />
Uma maneira que encontrei foi fazer isso no arquivo index.js
import Input from './Input'
import CpfCnpj from './input-masks/InputCpfCnpj'
Input.CpfCnpj = CpfCnpj
export default Input
Gostaria de saber se existe outra forma, e se essa é uma boa prática?