SecureInput

Exibe uma entrada de valor de forma segura.

Exemplo

Modifique esse componente em tempo real pelo Storybook clique aqui

Utilização

<SecureInput
  inputMode='text'
  length={4}
  onChange={e => console.log(e)}
/>

onChange

• Type: Function
• Opcional

Função a ser executada quando o valor é alterado. É necessário atribuir um parâmetro na função para obter o valor do input.

  <SecureInput onChange={value => console.log(value)} />

inputMode

• Type: String
• Opcional

Tipo de teclado a ser utilizado no input. Valores possíveis são 'text' e 'numeric'.

  <SecureInput inputMode={'numeric'} />

length

• Type: Number
• Opcional

Tamanho do input em quantidade de caracteres do input, podendo ser alternado entre os valores 4, 5 e 6. O padrão é 4.

  <SecureInput length={5} />

color

• Type: String
• Opcional

Valor da cor a ser atribuída ao input. O padrão é neutralcolor-lightest.

  <SecureInput color={'amecolor-primary-dark'} />

showCaracters

• Type: Boolean
• Opcional

Opção para mostrar caracteres digitados.

Valores aceitos: showCaracters, showCaracters={true}, showCaracters={false}

  <SecureInput showCaracters />