компонент веб-реакции не генерирует события

Question

Я использую компоненты веб-реакции У меня есть компонент реакции, который я хочу преобразовать в веб-компонент, подобный следующему:

export default function SimpleComp(props) {
  let name = props.name;
  const onButtonClick = props.onButtonClick;
  return (
    <div>
      hello all! {name}
      <button onClick={onButtonClick}>Click this</button>
    </div>
  );
}

register(SimpleComp, 'simple-component', [
  'name'
  ],
  {
    onButtonClick: e => {
      console.log(e)
      e.stopPropagation();
      return new Event('clickbutton', { bubbles: true })
    }
  }
)

, а затем в App.js Iя вызываю такой компонент

function App() {
  const childEvent = () => {
    console.log('got an event from the parent')
  }
  return (
    <div className="App">
      <header className="App-header">
        <simple-component name='webcomponent' onButtonClick={childEvent}> </simple-component>
      </header>
    </div>
  );
}

childEvent не запускается.Все остальные функции вебкомпонента работают просто отлично.Это событие, выбрасываемое ребенком, является причиной проблемы.