ATLTextInput

Esta molécula é utilizada para inserção de texto pelo usuário.

Para visitar a documentação de design desta molécula, clique aqui.

Exemplo de Uso:

import { ATLTextInput } from '@appsimples/atlantica-react-native'
...
<ATLTextInput
    value={textValue}
    onChange={setTextValue}
    title={'Nome'}
    leftIcon={iconLeft}
/>

Props

• value
• onChange
• errorText
• helpText
• leftAdornment
• leftIcon
• rightAdornment
• rightButtonIcon
• title
• onPressRightIcon
• complementary
• disabled
• hideClearButton
• isInputFocused
• required
• showCounter
• showVisibilityToggle
• autoCapitalize
• keyboardType
• maxLength
• multiline
• returnKeyType
• horizontalMargin
• verticalMargin
• textInputBaseProps

---

value

Valor de texto que será exibido no input.

Tipo	Obrigatório
string	Não

---

onChange

Handler que será chamado quando o usuário mudar o texto.

Tipo	Obrigatório
function	Não

---

errorText

Texto de erro que, caso fornecido, aparece no lugar do helpText em vermelho. Também faz com que a linha divisora em baixo do input fique vermelha.

Tipo	Obrigatório
string	Não

---

helpText

Texto de ajuda para auxiliar o usuário no fornecimento de informações, aparece à esquerda abaixo da linha.

Tipo	Obrigatório
string	Não

---

leftAdornment

Texto fixo que aparece à esquerda do campo.

Tipo	Obrigatório
string	Não

---

leftIcon

Ícone decorativo que aparece à esquerda do campo e pode ajudar a indicar seu tipo ou função.

Tipo	Obrigatório
ImageSourcePropType	Não

---

rightAdornment

Texto fixo que aparece à direita do campo.

Tipo	Obrigatório
string	Não

---

rightButtonIcon

Imagem do botão opcional que aparece à direita do campo, em cima da linha divisora.

Tipo	Obrigatório
ImageSourcePropType	Não

---

title

Título do campo que também serve como placeholder, caso fornecido.

Tipo	Obrigatório
string	Não

---

onPressRightIcon

Handler que será chamado quando o usuário apertar o botão com ícone à direita do campo.

Tipo	Obrigatório
function	Não

---

complementary

Variação complementar da molécula a ser usada quando o fundo da tela é da cor ColorPrimary.

Tipo	Obrigatório
boolean	Não

---

disabled

Se for true, desabilita todas as interações com o componente.

Tipo	Obrigatório
boolean	Não

---

hideClearButton

Se for true, deixa de exibir o botão de limpar quando a digitação é iniciada.

Tipo	Obrigatório
boolean	Não

---

isInputFocused

Se for true, inicia a tela com o campo focado.

Tipo	Obrigatório
boolean	Não

---

required

Se for true, adiciona um asterisco ao lado do título do campo.

Tipo	Obrigatório
boolean	Não

---

showCounter

Se for true, mostra um contador de caracteres digitados. Caso haja um número máximo de caracteres, mostra esse valor também.

Tipo	Obrigatório
boolean	Não

---

showVisibilityToggle

Se for true, mostra um botão de alterar visibilidade do campo.

Tipo	Obrigatório
boolean	Não

---

autoCapitalize

Tipo de capitalização de caracteres para o campo.

Tipo	Obrigatório
AutoCapitalizeEnum	Não

Os possíveis tipos são:

• characters
• words
• sentences
• none

---

keyboardType

Tipo de teclado que aparece para cada campo.

Tipo	Obrigatório
KeyboardTypeEnum	Não

Os possíveis tipos são:

• default
• numberPad
• decimalPad
• numeric
• emailAddress
• phonePad

Para uma referência visual dos tipos, clique aqui

---

maxLength

Número máximo de caracteres do campo. Quando o usuário atingir esse número, os próximos caracteres digitados são ignorados.

Tipo	Obrigatório
number	Não

---

multiline

Se for true, permite múltiplas linhas no campo. Caso contrário, a digitação rola para a direita.

Tipo	Obrigatório
boolean	Não

---

returnKeyType

Tipo de tecla de retorno que aparece para cada campo.

Tipo	Obrigatório
ReturnKeyTypeEnum	Não

Os possíveis tipos são:

• done
• go
• next
• search
• send

---

horizontalMargin

Essa propriedade deve ser modificada caso seja necessário alterar a margem horizontal externa aos elementos da molécula.

Abaixo temos uma tabela indicando o token ao qual a prop está relacionada e o seu valor padrão.

Prop	Token	Default Value
horizontalMargin	SpacingInputMarginHorizontal	24

---

verticalMargin

Essa propriedade deve ser modificada caso seja necessário alterar a margem vertical externa aos elementos da molécula.

Abaixo temos uma tabela indicando o token ao qual a prop está relacionada e o seu valor padrão.

Prop	Token	Default Value
verticalMargin	SpacingBase	8

---

textInputBaseProps

Caso seja necessário mudar alguma propriedade base do átomo de textInput, é possível através da modificação das textInputBaseProps.

Abaixo temos uma tabela com todas as props da label, os tokens aos quais estão relacionadas e o seu valor padrão.

Props	Token	Default Value
boxColor	ColorDarkNeutral	#212121
disabledOpacity	OpacityDisabled	0.3
errorColor	ColorError	#D0021B
focusColor	ColorFocus	#1E90FF
labelColor	ColorLightNeutral	#9E9E9E
leftIconColor	ColorPrimary	#A94CC9

Para mais informações, acesse ATLTextInputBase.