How to trigger a React click event with Web Component

I have rendered ReactComponent with WebComponent but component click event does not trigger

Is there a way to trigger ReactComponent events rendered by WebComponent?

A simple React component

const event = () => {
  console.log('aaaaaa');
}

export const Component = ({message}) => {
  return (
    <button type={'button'} onClick={event}> {message} </button>
  ) 
};

Call it in the WebComponent rendering

export class ConfirmButton extends HTMLElement {
  connectedCallback() {
    const parent = document.createElement('div');
    const message = this.getAttribute('message');
    this.attachShadow({ mode: 'open' }).appendChild(parent);

    ReactDOM.render(<Component message={message} />, parent);
  }
}

By assumption, "aaaa" should be displayed on the console when the button is clicked.

However, no results are displayed ...