BaseInput

BaseInput é o componente base para todos os tipos de inputs, fornecendo a estrutura e funcionalidades comuns.

---

O BaseInput deve ser utilizado como base para a criação de novos componentes de input. Ele fornece a estrutura básica e funcionalidades comuns, como gerenciamento de estado, validação e estilização, etc.

Quando usar:

• Na implementação de componentes do tipo input, com exceção de checkboxes, radios, ranges e files.

Quando não usar:

• ⚠️ Atenção: Este componente não deve ser utilizado diretamente na aplicação, mas sim como base para a criação de novos componentes de input..

---

Uso

<CdsBaseInput
	v-model="inputValue"
/>

---

Preview

Label

• We’ll use this address if
• Ask for help

Mostrar log

⚡Nenhum evento foi disparado

---

Props

Nome	Tipo	Default	Opções	Descrição
id	string	''	--	ID do input.
label	string	'Label'	--	Especifica a label do input.
hideLabel	boolean	false	--	Quando ativado e o tipo selecionado for for search a label não será exibida.
disabled	boolean	false	--	Desabilita o input.
state	string	'default'	default valid loading invalid	Especifica o estado do TextInput. As opções são 'default', 'valid', 'loading' e 'invalid'.
type	string	'text'	text email	Especifica o tipo do TextInput. As opções são 'text' e 'email'.
required	boolean	false	--	Exibe asterisco de obrigatório (obs.: não faz a validação)
placeholder	string	'Digite aqui...'	--	Especifica o placeholder do input
errorMessage	string	'Valor inválido'	--	Especifica a mensagem de erro, que será exibida caso o estado seja inválido
supportingText	string|array	''	--	Especifica mensagem de auxílio.
fluid	boolean	false	--	Especifica se a largura do TextInput deve ser fluida.
tooltip	string	null	--	Define exibição e texto do tooltip do input
tooltipIcon	string	'info-outline'	--	Especifica ícone do tooltip do TextInput.
supportLink	string	null	--	Controla a exibição e o conteúdo do link de suporte exibido ao lado da label.
supportLinkUrl	string|null	null	--	Define a url a ser acessada no clique do link de suporte.
floatingLabel	boolean	false	--	Define o tipo do input, se `true` será um input adaptado para o mobile. Quando essa prop está ativa é renderizado o componente baseMobileInput.
leadingIcon	string|null	null	--	Define o ícone que será exibido à esquerda do input
trailingIcon	string|null	null	--	Define o ícone que será exibido à direita do input
lazy	boolean	false	--	Quando true, o v-model é atualizado com o evento `change` no lugar do `input`.
readonly	boolean	false	--	Quando true, o input é somente leitura.
maxlength	number	null	--	Define o número máximo de caracteres do input.
minlength	number	null	--	Define o número mínimo de caracteres do input.
name	string	''	--	Define o nome do input.
enableAutocomplete	boolean	false	--	Habilita autocomplete do browser.
enableTopContent	boolean	false	--	Habilita exibição de conteudo na parte superior do input

Eventos

Nome	Descrição
@supportLinkClick

Slots

Nome	Descrição
#trailing-icon
#leading-icon
#label
#top-content

---