JSFiddle - React, Tailwind, and code Playground

JavaScript

CustomEventTarget.prototype = {
	
	'constructor': CustomEventTarget,
	
	on:   function( ev, el ) { this.eventTarget.addEventListener( ev, el ) },
	off:  function( ev, el ) { this.eventTarget.removeEventListener( ev, el ) },
	emit: function( ev ) { this.eventTarget.dispatchEvent( ev ) }
	
}

function CustomEventTarget() { this.eventTarget = new EventTarget }


// Usage

const tgt = new CustomEventTarget()
const typeArg = 'someEvent'
const customEventInit = { detail: { d1: 'd1', d2: 'd2' } }
const ev = new CustomEvent( typeArg, customEventInit )

tgt.on( typeArg, handleEvent )

tgt.emit( ev )

function handleEvent( ev ) {
	console.log( ev )
  document.body.innerHTML = ev.detail.d1 + '_' + ev.detail.d2
}