[WEB-5654]fix: custom select selection and dropdown close #8324

This commit is contained in:
Vamsi Krishna
2025-12-12 15:43:30 +05:30
committed by GitHub
parent 119cf39b4d
commit 192ed9ba8d

View File

@@ -146,9 +146,13 @@ function Option(props: ICustomSelectItemProps) {
const { children, value, className } = props;
const closeDropdown = useContext(DropdownContext);
const handleMouseDown = useCallback(() => {
const handleClick = useCallback(() => {
// Close dropdown for both new and already-selected options.
requestAnimationFrame(() => closeDropdown());
// Use setTimeout to ensure HeadlessUI's onChange handler fires first for new selections.
// For already-selected options, this ensures the dropdown closes since onChange won't fire.
setTimeout(() => {
closeDropdown();
}, 0);
}, [closeDropdown]);
return (
@@ -163,9 +167,10 @@ function Option(props: ICustomSelectItemProps) {
className
)
}
onClick={handleClick}
>
{({ selected }) => (
<div onMouseDown={handleMouseDown} className="flex items-center justify-between gap-2 w-full">
<div className="flex items-center justify-between gap-2 w-full">
{children}
{selected && <Check className="h-3.5 w-3.5 flex-shrink-0" />}
</div>