Mgt Person card used in fluent UI list view auto selects the row when personcard is expanded

Question

we are using Mgt-react based Personcard in fluentUI Listview. The Listview is enabled to use multliselect. Need to avoid auto selection of row when we expand personcard. we are rendering the below component in fluentUI listview as a column

  <div className="personprofile" onMouseDown={(event)=>{event.preventDefault()}}>
  <Person
    userId={id}
    personCardInteraction={PersonCardInteraction.hover}
    fallbackDetails = {personDetails}
  >
    <CustomPersonCard template="person-card" />
  </Person>
</div>

Answer 1

<div className="personprofile" onMouseDown={(event) => { event.preventDefault() }}>
  <Person
    userId={id}
    personCardInteraction={PersonCardInteraction.hover}
    fallbackDetails = {personDetails}
    onClick={(event)=>{event.preventDefault()}}
  >
    <CustomPersonCard template="person-card" />
  </Person>
</div>