Textarea
Visão Geral
Design System
Para a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o Design System do GovBR.
Exemplos
Densidade
Copiar código
Resetar exemplo
Abrir no StackBlitz
Alternar fundo do preview
Inline
Copiar código
Resetar exemplo
Abrir no StackBlitz
Alternar fundo do preview
Estado
Copiar código
Resetar exemplo
Abrir no StackBlitz
Alternar fundo do preview
Contador
Copiar código
Resetar exemplo
Abrir no StackBlitz
Alternar fundo do preview
Propriedades
ariaLabel
| Atributo | aria-label |
| Descrição | Texto alternativo para acessibilidade quando não há label visível. Fornece um rótulo para tecnologias assistivas sem exibir visualmente. |
| Tipo | string |
| Valor padrão | --- |
cols
| Atributo | cols |
| Descrição | Número de colunas (caracteres) visíveis no textarea. Define a largura do componente em relação ao número de caracteres por linha. |
| Tipo | number |
| Valor padrão | --- |
customId
| Atributo | custom-id |
| Descrição | Identificador único. Caso não seja fornecido, um ID gerado automaticamente será usado. |
| Tipo | string |
| Valor padrão | Helpers.generateUniqueId('br-textarea') |
density
| Atributo | density |
| Descrição | Ajusta a densidade do componente, podendo ser 'small', 'medium' ou 'large'. |
| Tipo | "large" | "medium" | "small" |
| Valor padrão | 'medium' |
disabled
| Atributo | disabled |
| Descrição | Indica se o textarea está desabilitado. Quando verdadeiro, o usuário não pode interagir com o campo. |
| Tipo | boolean |
| Valor padrão | false |
isInline
| Atributo | is-inline |
| Descrição | Se verdadeiro, o rótulo e o input estarão na mesma linha (layout inline). |
| Tipo | boolean |
| Valor padrão | false |
label
| Atributo | label |
| Descrição | Texto exibido como rótulo do input. |
| Tipo | string |
| Valor padrão | --- |
maxlength
| Atributo | maxlength |
| Descrição | Número máximo de caracteres permitidos no textarea. Se definido como 0, não há limite. |
| Tipo | number |
| Valor padrão | 0 |
placeholder
| Atributo | placeholder |
| Descrição | Texto exibido dentro do input quando está vazio, fornecendo uma dica ou sugestão ao usuário. |
| Tipo | string |
| Valor padrão | --- |
rows
| Atributo | rows |
| Descrição | Número de linhas visíveis no textarea. Define a altura do componente em relação ao número de linhas de texto exibidas. |
| Tipo | number |
| Valor padrão | --- |
showCounter
| Atributo | show-counter |
| Descrição | Mostra o contador com a quantidade máxima de caracteres. |
| Tipo | boolean |
| Valor padrão | false |
state
| Atributo | state |
| Descrição | Define o estado visual do componente, podendo ser 'danger', 'success' ou 'warning'. |
| Tipo | "danger" | "success" | "warning" |
| Valor padrão | --- |
value
| Atributo | value |
| Descrição | Valor exibido no textarea. Pode ser alterado pelo usuário se a propriedade readonly não estiver ativa. |
| Tipo | string |
| Valor padrão | --- |
Slots
| Nome | Descrição |
|---|---|
"default" | Slot para texto adicional ou instruções a serem exibidos junto ao textarea. |
Eventos
| Evento | Descrição | Propagação |
|---|---|---|
valueChange | Valor atualizado do textarea | true |
Métodos
setValue
| Assinatura | setValue(newValue: string) => Promise<void> |
| Descrição | Define um novo valor para o textarea. |
| Parâmetros | newValue: - O novo valor a ser definido. |