Skip to content

fix(site): enlarge undersized Autocomplete clear and HelpPopover icon targets to 24px - #30890

Open
chrifro wants to merge 2 commits into
mainfrom
christin/deq-13-all-touch-targets-must-be-24px-large-or-leave-sufficient
Open

fix(site): enlarge undersized Autocomplete clear and HelpPopover icon targets to 24px#30890
chrifro wants to merge 2 commits into
mainfrom
christin/deq-13-all-touch-targets-must-be-24px-large-or-leave-sufficient

Conversation

@chrifro

@chrifro chrifro commented Oct 16, 2026 •
edited
Loading

Copy link
Copy Markdown
Contributor

🤖 This PR was generated by Coder Agents on behalf of @chrifro.

Fixes DEQ-13: two shared components render touch targets smaller than 24px, failing WCAG 2.2 SC 2.5.8 Target Size (Minimum).

Component Where it shows up Before After
Autocomplete clear button Workspace sharing user/group picker (Share popover + Settings › Sharing), plus other Autocomplete consumers 20×20 24×24
HelpPopoverIconTrigger "Outdated" icon next to workspace names in the Workspaces table, compaction-threshold settings 12×20 24×24

Both are one-class changes. The HelpPopoverIconTrigger uses min-h-6 min-w-6 instead of a fixed size so wider custom children still fit. Icon sizes are unchanged.

Proof

Red fill = clickable area, label = measured size. Captured from the dev server (./scripts/develop.sh).

Before After
Share popover: clear selection before after
Workspaces table: outdated info before after

axe-core target-size on the live app:

before  clear selection  20x20  Target has insufficient size (20px by 20px, should be at least 24px by 24px)
before  outdated info    12x20  Target has insufficient size (12px by 20px, should be at least 24px by 24px)
after   clear selection  24x24  no violations
after   outdated info    24x24  no violations
Audit notes
  • Workspace sharing: scanned both the Share popover and Settings › Sharing at each step (open, autocomplete open, user selected, member added, row role menu, row action menu). After this fix: 0 violations. Row controls are already compliant (Role select 160×46, Open menu 40×40). Group rows not exercised (no license locally); they share the user row code.
  • Other sub-24px candidates found by code search (ModelSelector effort info 12px, UsageIndicator section help 14px, FileReferenceChip remove 14px, AgentChatInput badge dismiss 20px, WorkspaceUploadPreview remove 20px): axe target-size passes for all across their Storybook stories with popovers opened. They meet the 2.5.8 spacing exception, and FileReferenceChip remove is tabIndex={-1}. Left unchanged.
  • Known, out of scope: the Autocomplete clear control is a role="button" nested inside the trigger <button> (invalid nesting). Fixing it means restructuring the trigger into sibling controls, so it belongs in a separate PR.

Checks

  • pnpm check, pnpm lint, pnpm format, tsc --noEmit
  • Vitest storybook + unit for Autocomplete, HelpPopover, WorkspaceOutdatedTooltip, WorkspacesPage, UserCompactionThresholdSettings, ChatSharingPopover, WorkspaceSharingForm, WorkspaceSharingPage (136 + 27 tests pass)

@chrifro
fix(site): enlarge undersized Autocomplete clear and HelpPopover icon…
0f577f7 
… targets to 24px

The Autocomplete clear button (used by the workspace sharing user/group
picker) was 20x20 and the HelpPopoverIconTrigger (outdated icon in the
workspaces table) was 12x20, failing WCAG 2.5.8 Target Size (Minimum).

Fixes DEQ-13
@linear-code

linear-code Bot commented Oct 16, 2026

Copy link
Copy Markdown

DEQ-13

@chrifro
chrifro requested a review from aqandrew October 16, 2026 11:51

This branch has not been deployed

No deployments
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@aqandrew aqandrew Awaiting requested review from aqandrew

At least 1 approving review is required to merge this pull request.

Assignees

@chrifro chrifro

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

1 participant

@chrifro