selection dialog is not being auto-closed after selecting an item. It requires user act to close it

[iranzithierry]

here's how am using it

<Command>
                    <CommandInput
                        placeholder={`Search ${title}...`}
                        className="h-9"
                    />
                    <CommandList>
                        <CommandEmpty>{`No ${title}s found.`}</CommandEmpty>
                        <CommandGroup>
                            {values.map((value) => (
                                <CommandItem
                                    value={value.label}
                                    key={value.value}
                                    onSelect={() => {
                                        setSelectedValue(value.value)
                                    }}
                                >
                                    {value.label}
                                    <CheckIcon
                                        className={cn(
                                            "ml-auto h-4 w-4",
                                            value.value === selectedValue
                                                ? "opacity-100"
                                                : "opacity-0"
                                        )}
                                    />
                                </CommandItem>
                            ))}
                        </CommandGroup>
                    </CommandList>
                </Command>

[Lexachoc]

looks like you're using shadcn. Calling setOpen(false) closes the dialog after selection.

https://github.com/pacocoursey/cmdk?tab=readme-ov-file#use

const [open, setOpen] = React.useState(false)

<Command>
    <CommandInput
        placeholder={`Search ${title}...`}
        className="h-9"
    />
    <CommandList>
        <CommandEmpty>{`No ${title}s found.`}</CommandEmpty>
        <CommandGroup>
            {values.map((value) => (
                <CommandItem
                    value={value.label}
                    key={value.value}
                    onSelect={() => {
                        setSelectedValue(value.value)
                        setOpen(false)
                    }}
                >
                    {value.label}
                    <CheckIcon
                        className={cn(
                            "ml-auto h-4 w-4",
                            value.value === selectedValue
                                ? "opacity-100"
                                : "opacity-0"
                        )}
                    />
                </CommandItem>
            ))}
        </CommandGroup>
    </CommandList>
</Command>

and if you're using Popover/Dialog:

<Popover open={open} onOpenChange={setOpen}>

<Dialog open={open} onOpenChange={setOpen}>