fix: [InputGroup] refinements (ENG-46733, ENG-46734) - #784
Merged
Conversation
Merge focus indicators into the group's single focus-within ring by
suppressing every descendant focus ring inside the group (buttons,
anchors, comboboxes, inner input wrappers, raw inputs). Only the
outer group ring is visible when any child receives focus.
Add a size prop ('small' | 'medium' | 'large', default 'medium')
matching the sibling input primitives. The root renders data-size
and toggles h-7/h-8/h-10 accordingly; the addon adapts its horizontal
padding via ancestor-scoped variants so the row height stays visually
balanced across sizes.
Refs: ENG-46733, ENG-46734
isaquebock
marked this pull request as ready for review
July 23, 2026 17:33
isaquebock
marked this pull request as draft
July 23, 2026 17:34
isaquebock
marked this pull request as ready for review
July 23, 2026 21:02
gdsantana
previously approved these changes
Jul 24, 2026
gdsantana
approved these changes
Jul 27, 2026
robsongajunior
approved these changes
Jul 28, 2026
gabriel-lisboa-azion
added a commit
that referenced
this pull request
Jul 28, 2026
Resolution policy: shared DS/infra takes main; apps/webkit-sample keeps this branch. The 104 add/add conflicts were an artifact of main squash-merging PRs while this branch merged origin/dev directly, so identical work landed on both sides with no shared blob ancestry. Verified main is a superset of this branch's shared-area work. - 143 conflicted files resolved to main's version. - 6 accepted as main's deletions: the three packages/*/.releaserc (semantic-release to release-please), the dead theme css-vars/resolve token scripts, and docs/GOVERNANCE_NEXT_STEPS.md. - apps/webkit-sample merged clean and is untouched. Preserved from this branch: popover-header min-height. Main carries min-h-[--(size-4)], which is invalid Tailwind, is the only such bracket form in webkit src, and resolves to 16px where the adjacent comment requires 1.75rem. Dropped from this branch: the drawer mobileBehavior catalog entry (documents a prop that exists in neither side's drawer.vue) and the text-label-* font-weight 400 change (kept main's 500 so main's visual baselines stay valid). Also regenerated packages/webkit/catalog.json, which main left stale after #784 removed InputGroup's size prop, and removed the superseded .github/workflows/app-storybook-dev.yml (dev-triggered, unreachable on a main-based trunk).
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
3 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
focus-within.size?: 'small' | 'medium' | 'large'(defaultmedium); altura do grupo e padding do addon adaptam viadata-sizee propagam para inputs internos.How to test (mapeado 1:1 com Jira)
ENG-46733 — "InputGroup apresenta Double Focus"
Problema Jira: "InputGroup apresenta problema de Double Focus (dois estados de foco simultâneos/duplicados)."
Default.InputText,InputPassword,<a>link, elementorole="combobox"— todos delegam o ring ao grupo.ENG-46734 — "Não suporta sizes — deve adaptar aos inputs internos"
Problema Jira: "InputGroup não dá suporte a sizes. Internamente ele precisa aceitar os sizes dos inputs internos e se adaptar de acordo."
Sizes.size="small"→ altura 28px; addon compx-xs; inputs internos alinhados.size="medium"(default) → altura 32px; addon com padding padrão.size="large"→ altura 40px; addon compx-md.data-sizerefletindo o prop.Tests
30 passed, 1 skipped (skip pré-existente de
aria-requiredno axe — não relacionado).