From 90441b0aa7ec033b1e3354fc864608c63e8bbb1c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Isaque=20B=C3=B6ck?= Date: Wed, 22 Jul 2026 13:03:24 -0300 Subject: [PATCH 1/5] fix: [InputGroup] double focus and size support (ENG-46733, ENG-46734) From 5c7b4e1572407a76b7b10be5fdfb898ab9253582 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Isaque=20B=C3=B6ck?= Date: Wed, 22 Jul 2026 13:15:19 -0300 Subject: [PATCH 2/5] fix: InputGroup double focus and size support (ENG-46733, ENG-46734) 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 --- .specs/input-group.md | 14 +++-- .../inputs/input-group/InputGroup.stories.js | 50 ++++++++++++++++- .../input-group-addon/input-group-addon.vue | 2 +- .../inputs/input-group/input-group.test.ts | 56 ++++++++++++++++++- .../inputs/input-group/input-group.vue | 8 ++- 5 files changed, 122 insertions(+), 8 deletions(-) diff --git a/.specs/input-group.md b/.specs/input-group.md index 43a508512..9da72112a 100644 --- a/.specs/input-group.md +++ b/.specs/input-group.md @@ -7,9 +7,9 @@ spec_version: 4 figma: url: https://www.figma.com/design/t97pXRs7xME3SJDs5iZ5RF/Webkit?node-id=3714-10802 node_id: 3714:10802 -checksum: a084ea5340b76e0a5664fd895a69ce39d6b1679fa243ba3dd7a4c14b9af913bc +checksum: 2a6f539a2733213f73bb59cf27a14c1d6eb0a41016c1c6feaccbfcf217117668 created: 2026-07-01 -last_updated: 2026-07-06 +last_updated: 2026-07-22 --- # InputGroup — Component Spec @@ -107,6 +107,7 @@ Root props: | Prop | Type | Default | Required | JSDoc | |---|---|---|---|---| +| `size` | `'small' \| 'medium' \| 'large'` | `'medium'` | no | Size token; affects the root's height and inner addon padding. Heights: small=28px, medium=32px, large=40px. Matches the sibling input primitives (`InputText`, `Select`) — set the same `size` on child controls to keep them visually aligned. | | `invalid` | `boolean` | `false` | no | Renders the error border and sets `aria-invalid="true"` on the root. | | `required` | `boolean` | `false` | no | Renders the required (warning) border and sets `aria-required="true"` on the root. | | `disabled` | `boolean` | `false` | no | Renders the disabled visual (muted fill, not-allowed cursor, no focus-within ring) and sets `aria-disabled="true"` on the root. Does not propagate to the child controls — each child is responsible for its own `disabled` attribute (mirrors how `FieldText` disables `InputText`). | @@ -126,6 +127,8 @@ Root props: ## States - Visual states on root: `default`, `hover`, `focus-within`, `invalid`, `required`, `disabled` +- `data-size` mirrors the `size` prop and drives the root height (`small`=`h-7`, `medium`=`h-8`, `large`=`h-10`) +- Only one focus indicator is visible when a descendant is focused: the group draws the single `focus-within` ring on its root, and the inner input primitives' own focus rings are suppressed via `[&_*]:focus-visible:!ring-0 [&_*]:focus-within:!ring-0` so `Button`, `Select.Trigger`, `InputText` wrappers, and raw `` share the group's ring instead of stacking their own on top - `data-invalid` mirrors the `invalid` prop; sets `aria-invalid="true"` - `data-required` mirrors the `required` prop; sets `aria-required="true"` - `data-disabled` mirrors the `disabled` prop; sets `aria-disabled="true"` @@ -160,7 +163,9 @@ Root props: | root text (disabled) | `var(--text-disabled)` | | root border width | `border` (Tailwind utility) | | root shape | `var(--shape-elements)` | -| root height | `h-8` (Tailwind utility) | +| root height (small) | `h-7` (Tailwind utility) | +| root height (medium) | `h-8` (Tailwind utility) | +| root height (large) | `h-10` (Tailwind utility) | | focus ring | `var(--ring-color)` | | focus ring offset | `var(--bg-canvas)` | | child seam | `border-r border-[color:var(--border-default)]` (applied via `[&>*:not(:last-child)]:border-r`) | @@ -188,6 +193,7 @@ Root props: ## Stories (Storybook) - Default — root with a middle input, no addons or extra children. +- Sizes — the three sizes stacked (small=28px, medium=32px, large=40px). - WithAddonLeft — `https://` + middle input. - WithAddonRight — middle input + `.com`. - BothAddons — addon + input + addon. @@ -198,7 +204,7 @@ Root props: - Required — `required=true` (warning border, always visible). - Disabled — `disabled=true` (muted fill, not-allowed cursor, no focus ring). -Justification for ten stories (deviates from Default+Types+Sizes+state pattern): the component has no `kind` and no `size`, so `Types` and `Sizes` do not apply. Four addon-composition stories (Default, WithAddonLeft, WithAddonRight, BothAddons) document the static-content path. Three integration stories (WithButton, WithSelect, WithAll) prove Button/Select-as-children — the whole point of v4. Three state stories exercise `Invalid`, `Required`, and `Disabled` — the visual signals the component can emit. +Justification for eleven stories (deviates from Default+Types+Sizes+state pattern): the component has no `kind`, so `Types` does not apply. `Sizes` documents the three-height axis. Four addon-composition stories (Default, WithAddonLeft, WithAddonRight, BothAddons) document the static-content path. Three integration stories (WithButton, WithSelect, WithAll) prove Button/Select-as-children — the whole point of v4. Three state stories exercise `Invalid`, `Required`, and `Disabled` — the visual signals the component can emit. ## Constraints — DO NOT diff --git a/apps/storybook/src/stories/components/inputs/input-group/InputGroup.stories.js b/apps/storybook/src/stories/components/inputs/input-group/InputGroup.stories.js index ec4e2da7e..ec3f3c224 100644 --- a/apps/storybook/src/stories/components/inputs/input-group/InputGroup.stories.js +++ b/apps/storybook/src/stories/components/inputs/input-group/InputGroup.stories.js @@ -45,6 +45,17 @@ const meta = { } }, argTypes: { + size: { + control: 'inline-radio', + options: ['small', 'medium', 'large'], + description: + 'Size token; affects the root height (28/32/40px) and inner addon padding. Match the same `size` on child controls.', + table: { + category: 'props', + type: { summary: "'small' | 'medium' | 'large'" }, + defaultValue: { summary: "'medium'" } + } + }, invalid: { control: 'boolean', description: 'Renders the error border and sets `aria-invalid="true"` on the root.', @@ -64,6 +75,7 @@ const meta = { } }, args: { + size: 'medium', invalid: false, required: false, disabled: false @@ -77,7 +89,7 @@ const Template = (args) => ({ setup() { return { props: args } }, - template: `${MIDDLE_INPUT}` + template: `${MIDDLE_INPUT}` }) const DEFAULT_MARKUP = ` @@ -95,6 +107,42 @@ export const Default = { } } +const SIZES_MARKUP = `
+ + https:// + ${MIDDLE_INPUT} + .com + + + https:// + ${MIDDLE_INPUT} + .com + + + https:// + ${MIDDLE_INPUT} + .com + +
` + +/** @type {import('@storybook/vue3').StoryObj} */ +export const Sizes = { + render: () => ({ + components, + template: SIZES_MARKUP + }), + parameters: { + docs: { + controls: { disable: true }, + description: { + story: + 'The three sizes stacked (`small`=28px, `medium`=32px, `large`=40px). Match the same `size` on child input controls to keep the inner content vertically centered.' + }, + source: { code: toSfc(IMPORTS, toSource(SIZES_MARKUP)) } + } + } +} + const WITH_ADDON_LEFT_MARKUP = ` https:// ${MIDDLE_INPUT} diff --git a/packages/webkit/src/components/inputs/input-group/input-group-addon/input-group-addon.vue b/packages/webkit/src/components/inputs/input-group/input-group-addon/input-group-addon.vue index 4eec14b12..6c6200b74 100644 --- a/packages/webkit/src/components/inputs/input-group/input-group-addon/input-group-addon.vue +++ b/packages/webkit/src/components/inputs/input-group/input-group-addon/input-group-addon.vue @@ -16,7 +16,7 @@ diff --git a/packages/webkit/src/components/inputs/input-group/input-group.test.ts b/packages/webkit/src/components/inputs/input-group/input-group.test.ts index c0666b686..a095ecd92 100644 --- a/packages/webkit/src/components/inputs/input-group/input-group.test.ts +++ b/packages/webkit/src/components/inputs/input-group/input-group.test.ts @@ -6,7 +6,7 @@ import * as stories from '../../../../../../apps/storybook/src/stories/component import { expectNoA11yViolations } from '../../../test/axe' import InputGroup, { InputGroupAddon } from './index' -const { Default, BothAddons, WithButton, WithSelect, Invalid, Required, Disabled } = +const { Default, Sizes, BothAddons, WithButton, WithSelect, Invalid, Required, Disabled } = composeStories(stories) // The middle input is a consumer-provided raw ; aria-label gives it an @@ -98,6 +98,53 @@ describe('InputGroup', () => { }) }) + describe('size', () => { + it('defaults data-size to "medium" on the root', () => { + const { getByTestId } = render(InputGroup, { slots: { default: LABELLED_INPUT } }) + expect(getByTestId('input-group').getAttribute('data-size')).toBe('medium') + }) + + it.each(['small', 'medium', 'large'] as const)( + 'reflects size="%s" as data-size on the root', + (size) => { + const { getByTestId } = render(InputGroup, { + props: { size }, + slots: { default: LABELLED_INPUT } + }) + expect(getByTestId('input-group').getAttribute('data-size')).toBe(size) + } + ) + + it('propagates size to inner addons via CSS ancestor selector (data-size on root)', () => { + const { getByTestId } = render(InputGroup, { + props: { size: 'large' }, + slots: { + default: `$${LABELLED_INPUT}` + } + }) + // The group's data-size is the single source of truth read by the addon's + // ancestor-scoped Tailwind variants ([[data-size=large]_&]:...). Assert + // the contract at the boundary the CSS reads. + expect(getByTestId('input-group').getAttribute('data-size')).toBe('large') + }) + }) + + describe('focus (single ring — ENG-46733)', () => { + it('suppresses focus rings on all descendant elements so only the group ring shows', () => { + const { getByTestId } = render(InputGroup, { + slots: { default: LABELLED_INPUT } + }) + const root = getByTestId('input-group') + const cls = root.getAttribute('class') ?? '' + // Descendant focus rings (buttons, links, comboboxes, input wrappers) are + // neutralized — the group owns the single visible focus indicator. + expect(cls).toContain('[&_*]:focus-visible:!ring-0') + expect(cls).toContain('[&_*]:focus-within:!ring-0') + // The group itself still renders its focus-within ring. + expect(cls).toContain('focus-within:ring-2') + }) + }) + describe('disabled', () => { it('sets data-disabled and aria-disabled="true" on the root', () => { const { getByTestId } = render(InputGroup, { @@ -221,6 +268,13 @@ describe('InputGroup', () => { expect(getByTestId('select-trigger__value').textContent?.trim()).toBe('BRL') }) + it('renders the Sizes story with one group per size, each carrying data-size', () => { + const { getAllByTestId } = render(Sizes) + const groups = getAllByTestId('input-group') + expect(groups).toHaveLength(3) + expect(groups.map((g) => g.getAttribute('data-size'))).toEqual(['small', 'medium', 'large']) + }) + it('renders the Invalid story with data-invalid on the root', () => { const { getByTestId } = render(Invalid) expect(getByTestId('input-group').getAttribute('data-invalid')).toBe('true') diff --git a/packages/webkit/src/components/inputs/input-group/input-group.vue b/packages/webkit/src/components/inputs/input-group/input-group.vue index 7002787d4..3e4df77e3 100644 --- a/packages/webkit/src/components/inputs/input-group/input-group.vue +++ b/packages/webkit/src/components/inputs/input-group/input-group.vue @@ -3,7 +3,11 @@ defineOptions({ name: 'InputGroup', inheritAttrs: false }) + export type InputGroupSize = 'small' | 'medium' | 'large' + export interface Props { + /** Size token; affects the root's height and inner addon padding. Heights: small=28px, medium=32px, large=40px. Matches the sibling input primitives — set the same size on child controls to keep them visually aligned. */ + size?: InputGroupSize /** Renders the error border and sets aria-invalid on the root. */ invalid?: boolean /** Renders the required (warning) border and sets aria-required on the root. */ @@ -13,6 +17,7 @@ } const props = withDefaults(defineProps(), { + size: 'medium', invalid: false, required: false, disabled: false @@ -32,13 +37,14 @@ v-bind="$attrs" role="group" :data-testid="testId" + :data-size="props.size" :data-invalid="props.invalid || null" :data-required="props.required || null" :data-disabled="props.disabled || null" :aria-invalid="props.invalid ? 'true' : undefined" :aria-required="props.required ? 'true' : undefined" :aria-disabled="props.disabled ? 'true' : undefined" - class="relative inline-flex items-center w-full h-8 overflow-hidden rounded-[var(--shape-elements)] border border-[var(--border-default)] bg-[var(--bg-surface)] transition-colors duration-150 ease-out motion-reduce:transition-none [&:not(:focus-within):not([data-invalid]):not([data-required]):not([data-disabled])]:hover:border-[var(--border-strong)] focus-within:outline-none focus-within:ring-2 focus-within:ring-[var(--ring-color)] focus-within:ring-offset-2 focus-within:ring-offset-[var(--bg-canvas)] data-[invalid]:border-[var(--danger-border)] data-[required]:border-[var(--warning-border)] data-[disabled]:bg-[var(--bg-disabled)] data-[disabled]:text-[var(--text-disabled)] data-[disabled]:cursor-not-allowed data-[disabled]:focus-within:ring-0 data-[disabled]:focus-within:ring-offset-0 [&_button]:!border-transparent [&_button]:!rounded-none [&_button]:focus-visible:!ring-0 [&_button]:focus-visible:!ring-offset-0 [&_a]:!border-transparent [&_a]:!rounded-none [&_a]:focus-visible:!ring-0 [&_a]:focus-visible:!ring-offset-0 [&_[role=combobox]]:!border-transparent [&_[role=combobox]]:!rounded-none [&_[data-mode]]:!w-auto [&>*:not(:last-child)]:!border-r [&>*:not(:last-child)]:!border-r-[color:var(--border-default)] [&>*:first-child]:rounded-l-[var(--shape-elements)] [&>*:not(:first-child)]:rounded-l-none [&>*:last-child]:rounded-r-[var(--shape-elements)] [&>*:not(:last-child)]:rounded-r-none" + class="relative inline-flex items-center w-full overflow-hidden rounded-[var(--shape-elements)] border border-[var(--border-default)] bg-[var(--bg-surface)] transition-colors duration-150 ease-out motion-reduce:transition-none data-[size=small]:h-7 data-[size=medium]:h-8 data-[size=large]:h-10 [&:not(:focus-within):not([data-invalid]):not([data-required]):not([data-disabled])]:hover:border-[var(--border-strong)] focus-within:outline-none focus-within:ring-2 focus-within:ring-[var(--ring-color)] focus-within:ring-offset-2 focus-within:ring-offset-[var(--bg-canvas)] data-[invalid]:border-[var(--danger-border)] data-[required]:border-[var(--warning-border)] data-[disabled]:bg-[var(--bg-disabled)] data-[disabled]:text-[var(--text-disabled)] data-[disabled]:cursor-not-allowed data-[disabled]:focus-within:ring-0 data-[disabled]:focus-within:ring-offset-0 [&_*]:focus-visible:!ring-0 [&_*]:focus-visible:!ring-offset-0 [&_*]:focus-within:!ring-0 [&_*]:focus-within:!ring-offset-0 [&_input]:!outline-none [&_button]:!border-transparent [&_button]:!rounded-none [&_a]:!border-transparent [&_a]:!rounded-none [&_[role=combobox]]:!border-transparent [&_[role=combobox]]:!rounded-none [&_[data-mode]]:!w-auto [&>*:not(:last-child)]:!border-r [&>*:not(:last-child)]:!border-r-[color:var(--border-default)] [&>*:first-child]:rounded-l-[var(--shape-elements)] [&>*:not(:first-child)]:rounded-l-none [&>*:last-child]:rounded-r-[var(--shape-elements)] [&>*:not(:last-child)]:rounded-r-none" > From f9b47096fb3c1493c4656c552ef4c07105be2566 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Isaque=20B=C3=B6ck?= Date: Wed, 22 Jul 2026 14:19:02 -0300 Subject: [PATCH 3/5] chore: rebuild catalog.json --- packages/webkit/catalog.json | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/packages/webkit/catalog.json b/packages/webkit/catalog.json index 581a985bc..b3864c90e 100644 --- a/packages/webkit/catalog.json +++ b/packages/webkit/catalog.json @@ -4959,6 +4959,13 @@ "structure": "composition", "status": "approved", "props": [ + { + "name": "size", + "type": "'small' | 'medium' | 'large'", + "default": "'medium'", + "required": "no", + "doc": "Size token; affects the root's height and inner addon padding. Heights: small=28px, medium=32px, large=40px. Matches the sibling input primitives (`InputText`, `Select`) — set the same `size` on child controls to keep them visually aligned." + }, { "name": "invalid", "type": "boolean", @@ -5000,6 +5007,13 @@ "structure": "composition", "status": "approved", "props": [ + { + "name": "size", + "type": "'small' | 'medium' | 'large'", + "default": "'medium'", + "required": "no", + "doc": "Size token; affects the root's height and inner addon padding. Heights: small=28px, medium=32px, large=40px. Matches the sibling input primitives (`InputText`, `Select`) — set the same `size` on child controls to keep them visually aligned." + }, { "name": "invalid", "type": "boolean", From e8129d4719aa69333791ccff155384533c3144ff Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Isaque=20B=C3=B6ck?= Date: Mon, 27 Jul 2026 17:17:21 -0300 Subject: [PATCH 4/5] test: add visual baselines for the input group sizes story --- ...nts-inputs-inputgroup--sizes--dark-mobile.png | Bin 0 -> 7348 bytes ...nts-inputs-inputgroup--sizes--dark-tablet.png | Bin 0 -> 7881 bytes ...s-inputs-inputgroup--sizes--light-desktop.png | Bin 0 -> 7977 bytes ...ts-inputs-inputgroup--sizes--light-mobile.png | Bin 0 -> 7135 bytes ...ts-inputs-inputgroup--sizes--light-tablet.png | Bin 0 -> 7667 bytes .../components-inputs-inputgroup--sizes.png | Bin 0 -> 8205 bytes 6 files changed, 0 insertions(+), 0 deletions(-) create mode 100644 apps/storybook/.storybook/test-visual/__image_snapshots__/linux/components-inputs-inputgroup--sizes--dark-mobile.png create mode 100644 apps/storybook/.storybook/test-visual/__image_snapshots__/linux/components-inputs-inputgroup--sizes--dark-tablet.png create mode 100644 apps/storybook/.storybook/test-visual/__image_snapshots__/linux/components-inputs-inputgroup--sizes--light-desktop.png create mode 100644 apps/storybook/.storybook/test-visual/__image_snapshots__/linux/components-inputs-inputgroup--sizes--light-mobile.png create mode 100644 apps/storybook/.storybook/test-visual/__image_snapshots__/linux/components-inputs-inputgroup--sizes--light-tablet.png create mode 100644 apps/storybook/.storybook/test-visual/__image_snapshots__/linux/components-inputs-inputgroup--sizes.png diff --git a/apps/storybook/.storybook/test-visual/__image_snapshots__/linux/components-inputs-inputgroup--sizes--dark-mobile.png b/apps/storybook/.storybook/test-visual/__image_snapshots__/linux/components-inputs-inputgroup--sizes--dark-mobile.png new file mode 100644 index 0000000000000000000000000000000000000000..252963c96acc515fc41b4211f034b2a970c22dab GIT binary patch literal 7348 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 Z0PgkmGy{Lf$UNTx6l7IoDx}^A{tL|eEqed} literal 0 HcmV?d00001 diff --git a/apps/storybook/.storybook/test-visual/__image_snapshots__/linux/components-inputs-inputgroup--sizes--dark-tablet.png b/apps/storybook/.storybook/test-visual/__image_snapshots__/linux/components-inputs-inputgroup--sizes--dark-tablet.png new file mode 100644 index 0000000000000000000000000000000000000000..8c710aa46550c8e06dd98436c6f40f16ef4a448b GIT binary patch literal 7881 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 literal 0 HcmV?d00001 diff --git a/apps/storybook/.storybook/test-visual/__image_snapshots__/linux/components-inputs-inputgroup--sizes--light-tablet.png b/apps/storybook/.storybook/test-visual/__image_snapshots__/linux/components-inputs-inputgroup--sizes--light-tablet.png new file mode 100644 index 0000000000000000000000000000000000000000..342b311c3b60be3e13f014c32378e4d743093f78 GIT binary patch literal 7667 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 Kxk{NgAO8b2uZ9Hx literal 0 HcmV?d00001 diff --git a/apps/storybook/.storybook/test-visual/__image_snapshots__/linux/components-inputs-inputgroup--sizes.png b/apps/storybook/.storybook/test-visual/__image_snapshots__/linux/components-inputs-inputgroup--sizes.png new file mode 100644 index 0000000000000000000000000000000000000000..f9f6f7e8e5d1af3a67a4785e429c650a124c8531 GIT binary patch literal 8205 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 F{{`0{vxooy literal 0 HcmV?d00001 From 9b8f8fc37bae7ab5d0efcf2e0b800c2a6fc5a5a5 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Isaque=20B=C3=B6ck?= Date: Mon, 27 Jul 2026 17:38:21 -0300 Subject: [PATCH 5/5] test: remove comments from input group test additions --- .../src/components/inputs/input-group/input-group.test.ts | 8 +------- 1 file changed, 1 insertion(+), 7 deletions(-) diff --git a/packages/webkit/src/components/inputs/input-group/input-group.test.ts b/packages/webkit/src/components/inputs/input-group/input-group.test.ts index a095ecd92..b405f9de2 100644 --- a/packages/webkit/src/components/inputs/input-group/input-group.test.ts +++ b/packages/webkit/src/components/inputs/input-group/input-group.test.ts @@ -122,25 +122,19 @@ describe('InputGroup', () => { default: `$${LABELLED_INPUT}` } }) - // The group's data-size is the single source of truth read by the addon's - // ancestor-scoped Tailwind variants ([[data-size=large]_&]:...). Assert - // the contract at the boundary the CSS reads. expect(getByTestId('input-group').getAttribute('data-size')).toBe('large') }) }) - describe('focus (single ring — ENG-46733)', () => { + describe('focus (single ring)', () => { it('suppresses focus rings on all descendant elements so only the group ring shows', () => { const { getByTestId } = render(InputGroup, { slots: { default: LABELLED_INPUT } }) const root = getByTestId('input-group') const cls = root.getAttribute('class') ?? '' - // Descendant focus rings (buttons, links, comboboxes, input wrappers) are - // neutralized — the group owns the single visible focus indicator. expect(cls).toContain('[&_*]:focus-visible:!ring-0') expect(cls).toContain('[&_*]:focus-within:!ring-0') - // The group itself still renders its focus-within ring. expect(cls).toContain('focus-within:ring-2') }) })