Message suggestions stay open when an empty field is clicked: the field's own focus no longer counts as outside the list

This commit is contained in:
2026-11-01 11:17:18 +01:00
parent e6614ff378
commit df1071ce73
@@ -156,6 +156,7 @@ function SuggestInput({
onChange: (next: string) => void
} & Omit<ComponentProps<typeof Input>, "value" | "onChange">) {
const [open, setOpen] = useState(false)
const input = useRef<HTMLInputElement>(null)
const matches = suggestions.filter(
(item) =>
item !== value && item.toLowerCase().includes(value.toLowerCase()),
@@ -168,6 +169,7 @@ function SuggestInput({
value={value}
autoComplete="off"
{...props}
ref={input}
onFocus={(event) => {
setOpen(true)
onFocus?.(event)
@@ -189,6 +191,12 @@ function SuggestInput({
align="start"
className="w-[var(--radix-popover-trigger-width)] p-0"
onOpenAutoFocus={(event) => event.preventDefault()}
// The field is outside the list. Focusing it opens the list, and the
// same focus event then reaches the list's outside check, which would
// close it again at once. Its own blur closes it instead.
onInteractOutside={(event) => {
if (event.target === input.current) event.preventDefault()
}}
>
<Command shouldFilter={false}>
<CommandList>