Skip to content

feat: [CDS-1575] Add type focus to <Select>#571

Merged
maximo-macchi-cb merged 8 commits intomasterfrom
max/select-type-focus
Apr 2, 2026
Merged

feat: [CDS-1575] Add type focus to <Select>#571
maximo-macchi-cb merged 8 commits intomasterfrom
max/select-type-focus

Conversation

@maximo-macchi-cb
Copy link
Copy Markdown
Contributor

What changed? Why?

This PR adds type focus behavior for the <Select> and <Combobox> components. When a user is focused on the component's trigger, if they type a letter and it matches the first letter of an option in the dropdown, the dropdown will open and auto focus to said option.

Root cause (required for bugfixes)

This behavior wasn't included in the original <Select> so it's not considered a bug.

UI changes

Testing

How has it been tested?

  • Unit tests
  • Interaction tests
  • Pseudo State tests
  • Manual - Web
  • Manual - Android (Emulator / Device)
  • Manual - iOS (Emulator / Device)

Testing instructions

You can test this yourself in the alpha/select/__stories__/Select.stories.tsx. Using your keyboard, focus on the trigger and type the letter "f". Confirm that the "Fig" option is auto focused when the dropdown opens.

Illustrations/Icons Checklist

Required if this PR changes files under packages/illustrations/** or packages/icons/**

  • verified visreg changes with Terran (include link to visreg run/approval)
  • all illustration/icons names have been reviewed by Dom and/or Terran

Change management

type=routine
risk=low
impact=sev5

automerge=false

@maximo-macchi-cb maximo-macchi-cb self-assigned this Mar 31, 2026
@linear
Copy link
Copy Markdown

linear bot commented Mar 31, 2026

@cb-heimdall
Copy link
Copy Markdown
Collaborator

cb-heimdall commented Mar 31, 2026

✅ Heimdall Review Status

Requirement Status More Info
Reviews 1/1
Denominator calculation
Show calculation
1 if user is bot 0
1 if user is external 0
2 if repo is sensitive 0
From .codeflow.yml 1
Additional review requirements
Show calculation
Max 0
0
From CODEOWNERS 1
Global minimum 0
Max 1
1
1 if commit is unverified 0
Sum 1
CODEOWNERS ✅ See below

CODEOWNERS

Code Owner Status Calculation
ui-systems-eng-team 1/1
Denominator calculation
Additional CODEOWNERS Requirement
Show calculation
Sum 0
0
From CODEOWNERS 1
Sum 1

cb-ekuersch
cb-ekuersch previously approved these changes Mar 31, 2026
Copy link
Copy Markdown
Contributor

@cb-ekuersch cb-ekuersch left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

one nit - but looks good!

}),
flip: () => ({}),
}));
jest.mock('@floating-ui/react-dom', () => {
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nit: might be useful to make this a reusable mock in common jest setup

@samcartersmith
Copy link
Copy Markdown
Contributor

Fix looks good from a11y perspective.

@maximo-macchi-cb maximo-macchi-cb merged commit 36fdae7 into master Apr 2, 2026
34 checks passed
@maximo-macchi-cb maximo-macchi-cb deleted the max/select-type-focus branch April 2, 2026 14:33
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Development

Successfully merging this pull request may close these issues.

4 participants