Skip to content

Add height prop to TextArea component#1076

Merged
lucasn4s merged 3 commits intomainfrom
feature/textarea-height-prop-13734789671786383417
Apr 7, 2026
Merged

Add height prop to TextArea component#1076
lucasn4s merged 3 commits intomainfrom
feature/textarea-height-prop-13734789671786383417

Conversation

@lucasn4s
Copy link
Copy Markdown
Collaborator

This change introduces a new height prop to the TextArea component, allowing users to specify a starting (minimum) height for the input field.

Key changes:

  1. TextArea.vue: Added the height prop.
  2. BaseInput.vue: Added the height prop and updated the inputMinHeight computed property to apply the style to the textarea element.
  3. Tests: Added tests in src/tests/Textarea.spec.js and src/tests/BaseInput.spec.js to ensure the prop is correctly passed and applied.
  4. Documentation: Updated docs/components/forms/text-area.md to include the new prop in the playground.
  5. Version: Updated package.json version to 3.155.3.
  6. Metadata: Updated docs/.docgen/components-metadata.json via npm run generate:docs.

PR created automatically by Jules for task 13734789671786383417 started by @lucasn4s

- Added `height` prop to `TextArea` and `BaseInput` components.
- The `height` prop controls the `min-height` of the textarea.
- Supports both `Number` (pixels) and `String` (with units) values.
- Defaults to 120px if not provided.
- Updated unit tests and documentation.
- Incremented package version to 3.155.3.

Co-authored-by: lucasn4s <17988272+lucasn4s@users.noreply.github.com>
@google-labs-jules
Copy link
Copy Markdown
Contributor

👋 Jules, reporting for duty! I'm here to lend a hand with this pull request.

When you start a review, I'll add a 👀 emoji to each comment to let you know I've read it. I'll focus on feedback directed at me and will do my best to stay out of conversations between you and other bots or reviewers to keep the noise down.

I'll push a commit with your requested changes shortly after. Please note there might be a delay between these steps, but rest assured I'm on the job!

For more direct control, you can switch me to Reactive Mode. When this mode is on, I will only act on comments where you specifically mention me with @jules. You can find this option in the Pull Request section of your global Jules UI settings. You can always switch back!

New to Jules? Learn more at jules.google/docs.


For security, I will only act on instructions from the user who triggered this task.

@github-actions github-actions bot added the 🐛 Bug Algo não está funcionando label Mar 30, 2026
@greptile-apps
Copy link
Copy Markdown
Contributor

greptile-apps bot commented Mar 30, 2026

Greptile Summary

Esta PR adiciona a prop height ao componente TextArea (e ao BaseInput subjacente), permitindo que o desenvolvedor defina uma altura mínima (min-height) customizada para o textarea. A mudança é retrocompatível — o valor padrão é null, mantendo o comportamento anterior de 120px.

  • TextArea.vue: Prop height adicionada e repassada ao CdsBaseInput via spread de props — implementação correta.
  • BaseInput.vue: Lógica de inputMinHeight atualizada para considerar a nova prop, e :style=\"{ minHeight: inputMinHeight }\" adicionado ao elemento <textarea>. Há uma redundância: o inputMinHeight já era aplicado via CSS v-bind() na linha 666 do bloco <style>, tornando o estilo inline desnecessário (e o v-bind() no CSS inoperante para o textarea).
  • Falsy check: !props.height pode tratar 0 e '' como null, retornando o padrão 120px nesses casos extremos.
  • Testes e documentação: Bem cobertos — testes para número e string, snapshot atualizado, documentação do playground e metadados gerados corretamente.

Confidence Score: 5/5

PR segura para merge — todos os achados são sugestões de qualidade (P2) sem impacto funcional.

Todos os problemas encontrados são P2: redundância de estilo e edge case improvável com height: 0. A feature funciona corretamente para os casos de uso esperados, está bem testada e documentada.

src/components/BaseInput.vue — aplicação dupla de min-height (CSS v-bind + inline style) merece atenção para limpeza do código.

Important Files Changed

Filename Overview
src/components/BaseInput.vue Adiciona prop height e atualiza inputMinHeight; aplica min-height duas vezes (CSS v-bind + inline style), criando redundância.
src/components/TextArea.vue Adiciona prop height que é repassada ao CdsBaseInput via v-bind="{...$attrs, ...props}" — implementação simples e correta.
src/tests/BaseInput.spec.js Adiciona dois testes que verificam a aplicação correta do min-height para número e string — cobertura adequada.
src/tests/Textarea.spec.js Adiciona teste que verifica o repasse do height ao CdsBaseInput — correto.
src/tests/snapshots/Textarea.spec.js.snap Snapshot atualizado para refletir o novo style="min-height: 120px;" no textarea — consistente com a mudança.
docs/components/forms/text-area.md Documenta o novo height no playground — correto.
docs/.docgen/components-metadata.json Metadados atualizados automaticamente via npm run generate:docs — correto.
package.json Versão bumpeada de 3.155.2 para 3.155.3 (patch) — adequado para uma nova prop não-breaking.

Flowchart

%%{init: {'theme': 'neutral'}}%%
flowchart TD
    A["TextArea.vue\nheight prop"] -->|"v-bind spreads props"| B["BaseInput.vue\nheight prop recebida"]
    B --> C{"inputMinHeight\ncomputed"}
    C -->|"type !== 'textarea'"| D["retorna 'auto'"]
    C -->|"!height (null/falsy)"| E["retorna '120px' (padrão)"]
    C -->|"height é Number"| F["retorna `${height}px`"]
    C -->|"height é String"| G["retorna height as-is"]
    E --> H["Aplicado via CSS v-bind()\n(linha 666)"]
    F --> H
    G --> H
    E --> I["Aplicado via :style inline\n(linha 68) ⚠️ redundante"]
    F --> I
    G --> I
    H -->|"sobrescrito por"| I
Loading

Reviews (1): Last reviewed commit: "feat(TextArea): add height prop to contr..." | Re-trigger Greptile

Remove estilo duplicado
uesley
uesley previously approved these changes Apr 7, 2026
- Added `height` prop to `TextArea` and `BaseInput`.
- Implemented `min-height` control using `v-bind` in SCSS.
- Supports numeric (pixels) and string values.
- Updated unit tests to verify computed property logic.
- Updated snapshots and documentation.
- Version bumped to 3.155.3.

Co-authored-by: lucasn4s <17988272+lucasn4s@users.noreply.github.com>
@lucasn4s lucasn4s merged commit 28f2d60 into main Apr 7, 2026
8 checks passed
@lucasn4s lucasn4s deleted the feature/textarea-height-prop-13734789671786383417 branch April 7, 2026 17:15
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

🐛 Bug Algo não está funcionando

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants