Event delegation wrapper/HOF

delegate.js

function delegate(selector, handler) {
  return (ev) => {
    const tgt = ev.target;
    // Check if the event target matches the selector or if it is a descendant
    // of the selector
    if (tgt.matches(selector) || tgt.matches(`${selector} ${tgt.nodeName.toLowerCase()}`)) {
      // Since `ev.target` is the deepest element that triggered the event, it
      // won't always match the selector for the delegated event, so we add a
      // custom key to the event object for the delegate event target.
      handler(Object.assign(ev, { delegateTarget: closest(tgt, selector) }));
    }
  }
}