Как остановить распространение события на глобальный прослушиватель в компоненте React?

У меня есть компонент, который должен прослушивать все события mousedown на моей странице.

document.addEventListener('mousedown', listener)

Теперь давайте предположим, что у меня есть кнопка в моем приложении React.

<button 
  onMouseDown={e => e.stopPropagation()}
  onClick={e => doSomething()}
/>  

Использование onMouseDown={e => e.stopPropagation()} не предотвратит срабатывание моего глобального прослушивателя mousedown, потому что React использует делегирование событий (я полагаю?)

Единственный способ заставить это работать — вызвать onMouseDown={e => e.nativeEvent.stopImmediatePropagation()}

Есть ли способ сделать это более естественным с точки зрения разработчика? Я имею в виду, что не очень удобно объяснять всем в большой команде, почему обычная функция e.stopPropagation() не работает, как работает делегирование событий и т.д...

Итак, есть ли что-нибудь, что я могу сделать, чтобы при вызове e.stopPropagation() он фактически не запускал мой основной прослушиватель mousedown?

Есть ли поддерживаемый способ от моего слушателя фильтровать события, для которых был вызван stopPropagation (React или нет?)

Есть ли способ изменить узел, на котором React обрабатывает делегированные события? (кажется, здесь document)