Skip to content

fix(selector): keyboard clear via Delete/Backspace (comboboxes-2)#3365

Open
cixzhang wants to merge 3 commits into
mainfrom
navi/fix/selector-clear-keyboard
Open

fix(selector): keyboard clear via Delete/Backspace (comboboxes-2)#3365
cixzhang wants to merge 3 commits into
mainfrom
navi/fix/selector-clear-keyboard

Conversation

@cixzhang

@cixzhang cixzhang commented Jul 2, 2026

Copy link
Copy Markdown
Contributor

Part of the accessibility & keyboard-management program (#3343). Fixes finding comboboxes-2.

Problem

Selector/MultiSelector exposed clearing a selection only through the mouse-clickable clear button. The audit's comboboxes-2 calls for a keyboard fallback (Delete/Backspace) so a keyboard-only user can clear the value without a pointer. (The clear button's earlier tabIndex={-1} was already removed alongside the trigger-focusability fix in #3324, so the button itself is now tabbable; this PR adds the keyboard shortcut.)

Fix

  • useCombobox (Selector) and useMultiCombobox (MultiSelector) gain an optional onClear callback. When the popup is closed, hasClear is set, and there is a value, pressing Delete or Backspace clears it — onChange(null) for Selector, onChange([]) for MultiSelector.
  • The clear button and the keyboard path now share one clearValue/clearValues function, so both go through the same changeAction/optimistic-update flow.
  • The shortcut is deliberately not active in hasSearch mode (those keys edit the search query) or while the popup is open (arrow navigation owns interaction there).

Tests

Adds 3 Selector + 3 MultiSelector cases: clear via Delete, clear via Backspace, and no-clear when hasClear is unset / nothing is selected. Full Selector + MultiSelector suites green (72 tests), typecheck + lint clean.

@vercel

vercel Bot commented Jul 2, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
astryx Ready Ready Preview, Comment Jul 2, 2026 7:55pm

Request Review

@meta-cla meta-cla Bot added the CLA Signed This label is managed by the Meta Open Source bot. label Jul 2, 2026
@github-actions

github-actions Bot commented Jul 2, 2026

Copy link
Copy Markdown
Contributor

PR Analysis Report

📚 Storybook Preview

View Storybook for this PR
GitHub Pages may take up to a minute to hydrate after deploy.

🧪 Sandbox Preview

View Sandbox for this PR
GitHub Pages may take up to a minute to hydrate after deploy.

No new or modified components detected.

Bundle Size Summary

Package Size (ESM) Size (CJS) Gzipped
@astryxdesign/core N/A 4.6KB 0B

Accessibility Audit

Status: No accessibility violations detected.


Generated by PR Enrichment workflow | Storybook | Sandbox | View full report

github-actions Bot added a commit that referenced this pull request Jul 2, 2026
Comment thread packages/core/src/MultiSelector/MultiSelector.tsx Outdated
Comment thread packages/core/src/MultiSelector/hooks.ts Outdated
@cixzhang

cixzhang commented Jul 2, 2026

Copy link
Copy Markdown
Contributor Author

fix merge conflicts

@cixzhang cixzhang marked this pull request as ready for review July 2, 2026 17:32
github-actions Bot added a commit that referenced this pull request Jul 2, 2026
@nynexman4464 nynexman4464 self-assigned this Jul 2, 2026
options={defaultOptions}
value={['Apple', 'Banana']}
onChange={onChange}
hasClear

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.

I'm slightly confused by this. Docs don't say MultiSelector supports hasClear and when I test in playground it doesn't work nevermind it works here now

I'm still a little confused how this activates though? I tried several times and couldn't get it "delete" to do anything when I tried

Screen.Recording.2026-07-02.at.2.17.39.PM.mov

cixzhang added 3 commits July 2, 2026 19:48
Adds a Delete/Backspace path in useCombobox/useMultiCombobox that clears the
value from the closed trigger when hasClear is set, so clearing is not
mouse-only. Guarded off in search mode and while the popup is open.
@cixzhang cixzhang force-pushed the navi/fix/selector-clear-keyboard branch from 41beb51 to 7f1877e Compare July 2, 2026 19:52
github-actions Bot added a commit that referenced this pull request Jul 2, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

CLA Signed This label is managed by the Meta Open Source bot.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants