without-propagation

You don't want a propagation, right?

<div>
  <button>Click me</button>
</div>

const div = document.querySelector('div')
const button = document.querySelector('button')

div.addEventListener('click', (e) => {
  console.log('Catch a click on the div')
})

button.addEventListener('click', (e) => {
  console.log('Catch a click on the button')
})

button.click()

// > Catch a click on the button
// > Catch a click on the div

Oh my... sure I don't

yarn add without-propagation

You're fine now:

import withoutPropagation from 'without-propagation'

const div = document.querySelector('div')
const button = document.querySelector('button')

div.addEventListener('click', (e) => {
  console.log('The event will be never fired')
})

button.addEventListener('click', withoutPropagation((e) => {
  console.log('Catch a click on the button only')
}))

button.click()

// > Catch a click on the button only