27
Textarea autosize Componentes
Caixa de texto que cresce sozinha conforme o conteúdo, com altura mínima e máxima.
O que é
Evita a barra de rolagem interna feia em textareas curtas — a caixa cresce junto com o texto até um limite, depois vira scroll normal.
Como funciona
Recalcula scrollHeight a cada tecla e ajusta a altura do elemento, respeitando os limites min/max definidos.
Exemplos
1. Crescimento vertical automático — digite várias linhas
Ao vivo
Sem limite máximo (cresce livremente)
Com limite máximo (min: 60px, max: 160px)
<!-- Cresce sem limite de altura -->
<textarea sw-textarea sw-textarea-min="60" placeholder="Digite..."></textarea>
<!-- Cresce até no máximo 160px (depois ativa scrollbar) -->
<textarea sw-textarea sw-textarea-min="60" sw-textarea-max="160"></textarea>
2. Combo — autosize + contador de caracteres (Textlimit)
Ao vivo
Autosize + contador à direita
Autosize + contador centralizado
<!-- Combo autosize + contador -->
<textarea sw-textarea sw-textarea-min="80" sw-textarea-max="200"
sw-textlimit sw-textlimit-max="200"
placeholder="Digite..."></textarea>
<!-- Combo autosize + expansão centralizada -->
<textarea sw-textarea sw-textarea-min="80" sw-textarea-max="200"
sw-textlimit sw-textlimit-max="150"
sw-textlimit-center></textarea>
Atributos
sw-textarea-min
altura mínima em px (padrão 60)
sw-textarea-max
altura máxima em px (padrão 0 = sem limite) — depois disso vira scroll interno normal
API (JavaScript)
SW.Textarea.initAll(root?)
reinicializa textareas novos adicionados dinamicamente à página
Limitações — o que ele não faz
Nenhuma.