Skip to content

feat: support Enter key for creatable combobox options#88

Open
JokkimDoras wants to merge 2 commits into
Gsync:mainfrom
JokkimDoras:feat/combobox-create-combobox
Open

feat: support Enter key for creatable combobox options#88
JokkimDoras wants to merge 2 commits into
Gsync:mainfrom
JokkimDoras:feat/combobox-create-combobox

Conversation

@JokkimDoras

@JokkimDoras JokkimDoras commented Jul 22, 2026

Copy link
Copy Markdown

Added keyboard support for creatable comboboxes. Users can now press Enter to create and select a new option instead of having to click the "Create" action with the mouse. This improves accessibility and speeds up data entry while preserving the existing mouse-based behavior.

@Gsync

Gsync commented Jul 23, 2026

Copy link
Copy Markdown
Owner

Wrong base branch. This targets main. Per CONTRIBUTING.md, all PRs must be based on and target devmain is maintainer-only. Please rebase onto dev and retarget.

Enter no longer selects existing options. The unconditional e.preventDefault() in the new onKeyDown kills cmdk's own Enter handling. cmdk listens on the Command root and bails on defaultPrevented, so by the time the event bubbles up, selection never fires. Effects across all 8 Combobox call sites:

  • Arrow-key to an option → Enter → nothing selected. Keyboard selection of existing options is now impossible.
  • Typing a value that already exists → Enter → takes the create path. The DB upsert dedupes, but options.unshift(response) still inserts a second entry with the same id, so the option renders twice and React warns on the duplicate key.
  • Empty input → Enter → dead key.

Enter should only be intercepted when there's no highlighted item to commit; otherwise let it through.

Not gated on creatable. creatable is optional. On a non-creatable combobox, Enter falls through the switch to default: break, leaving response undefined → field.onChange(response.id) throws. Every current call site passes creatable, so it's latent, but it needs the guard.

package-lock.json is out of scope. +3505/−4461 with no package.json change — a regenerated lockfile with real version drift (e.g. @adobe/css-tools 4.4.4 → 4.5.0). Dependency updates are maintainer-only. Please git checkout dev -- package-lock.json.

Minor:

  • e.key == 'Enter' → use === (project requires strict equality).
  • Run Prettier — quote style and the missing semicolon don't match the file.
  • src/components/myjobs/AddJob.tsx only adds a whitespace-only line; drop it from the PR.

Tests. Please add coverage — two cases would have caught the regression: (1) arrow to an existing option → Enter → asserts it's selected and nothing new is created; (2) type a new value → Enter → asserts the create action ran and the popover closed. Worth running the existing suite too, since AddJob, TaskForm, AddEducation, and AddExperience specs all touch this component.


Reviewed by Claude Code

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

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants