How to show infowindow on marker mouseover and close on mouse out but if the cursor is on infowindow don't close infowindow react google maps

Question

I want to show infowindow on marker hover and close on mouse leave, but only if mouse is not on infowindow. For now the infowindow is showing on mouse over, but infowindow is being close when hovering.

Here is the code:

   {SellerLocation === "on" && sellerData.map((element, index) => {
            return (
                <>
                    <Marker
                        key={index}
                        position={
                            {
                                lat: element.Marker.lat,
                                lng: element.Marker.lng
                            }}
                        icon={{
                            url: blueFalcon,
                            scaledSize: new window.google.maps.Size(40, 40)
                        }}
                        onMouseOver={() => {
                            setSelected("on")
                            setBuyerSelected("off")
                            setId(index)
                        }}
                        onClick={() => {
                            setSelected("on")
                            setBuyerSelected("off")
                            setId(index)
                        }}
                        onMouseOut={() => {
                            setSelected("off")
                        }}
                    >

                        {selected === "on" && id === index ?
                            <InfoWindow position={{
                                lat: element.Marker.lat,
                                lng: element.Marker.lng
                            }}
                                key={index}
                            >
                                    <div className="d-flex gig" style={{
                                        background: `url(${element.img})`
                                    }}>
                                            <p className='seller'>{element.name}</p>
                                            
                                </div>
                            </InfoWindow>
                            : ""}
                    </Marker>
                </>
            )
        })}