Skip to content

Commit 433b174

Browse files
Allow home/end key default behavior inside ComboboxInput when Combobox is closed (#3799)
Fixes #3558 Our combobox uses them to jump to the beginning or end of the option list but it doesn't make sense to capture these if the combobox isn't open. This will allow the home/end keys to function normally for the Combobox's input field which means, for Windows at least, the caret will moved to the beginning or end of the input. (macOS doesn't do this unless you also hold shift to select text). Before: https://github.com/user-attachments/assets/8d545613-cd93-4a46-8609-cc66dd960502 After: https://github.com/user-attachments/assets/426748b5-f66d-4bb9-80ba-be6a9b621618
1 parent 31b3e47 commit 433b174

File tree

2 files changed

+9
-0
lines changed

2 files changed

+9
-0
lines changed

packages/@headlessui-react/CHANGELOG.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
1313
- Don't accidentally open the `Combobox` when touching the `ComboboxButton` while dragging on mobile ([#3795](https://github.com/tailwindlabs/headlessui/pull/3795))
1414
- Ensure sibling `Dialog` components are scrollable on mobile ([#3796](https://github.com/tailwindlabs/headlessui/pull/3796))
1515
- Infer `Combobox` type based on `onChange` handler ([#3798](https://github.com/tailwindlabs/headlessui/pull/3798))
16+
- Allow home/end key default behavior inside `ComboboxInput` when `Combobox` is closed ([#3798](https://github.com/tailwindlabs/headlessui/pull/3798))
1617

1718
## [2.2.8] - 2025-09-12
1819

packages/@headlessui-react/src/components/combobox/combobox.tsx

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -734,6 +734,10 @@ function InputFn<
734734
})
735735

736736
case Keys.Home:
737+
if (machine.state.comboboxState === ComboboxState.Closed) {
738+
break
739+
}
740+
737741
if (event.shiftKey) {
738742
break
739743
}
@@ -748,6 +752,10 @@ function InputFn<
748752
return machine.actions.goToOption({ focus: Focus.First })
749753

750754
case Keys.End:
755+
if (machine.state.comboboxState === ComboboxState.Closed) {
756+
break
757+
}
758+
751759
if (event.shiftKey) {
752760
break
753761
}

0 commit comments

Comments
 (0)