Textarea
Coleta texto livre que pode ocupar várias linhas.
- Status
- Beta
- Distribuição
- Source via shadcn
Design
Preview funcional
Carregando preview funcional…
Explorar anatomia e estados visuais
Anatomia
- Container
- Textarea nativa
Variantes e estados
disablederrorfilledlgmdno-helperno-labelreadonlysm
Uso
Quando usar
- a resposta pode ser longa, narrativa ou conter múltiplos parágrafos.
Quando não usar
- o valor é curto, estruturado ou pode ser escolhido entre opções.
Composição React
import { Textarea } from "@/components/ui/textarea"
<Textarea
id="message"
name="message"
aria-label="Mensagem"
placeholder="Descreva sua solicitação"
/>Implementação
Instalação
Configure o namespace uma única vez na integração React.
npx shadcn@latest add @tis/textareapnpm dlx shadcn@latest add @tis/textareayarn dlx shadcn@latest add @tis/textareabunx --bun shadcn@latest add @tis/textareaContrato público
- Item do registry
@tis/textarea- Distribuição
- Source copiado para a aplicação
- Status
- Beta
Arquitetura técnica
- Provider
- React nativo
- Papel do provider
- Nativo ou composição
- Arquitetura comportamental
- Base UI
- CSS
ds-tis/css
Acessibilidade
Semântica e comportamento
Forneça label, preserve readonly/disabled e associe helper, contador e error por aria-describedby.
Responsabilidade do consumidor
- fornecer nomes e descrições acessíveis contextuais;
- preservar teclado, foco visível e HTML semântico;
- testar conteúdo, fluxo e contraste reais na aplicação.
Evidência de validação
Instalado no consumer React/Vite permanente e coberto por build de produção, browser, responsividade e Axe.