This is more for research than a real use case. But I'm interested if something like this is even possible.

I would like to return an event listener as a component, where the content is updated based on the data that is passed.

At the moment I can return the callback from the listener, but the values never update, I wonder if it's possible to compose this function/component in a way that would update based on this param that is sent?

Example:

const ChooseRating = () => {
  return (
    <button class="choose-rating" onClick={() => Emitter.send('rating', 4)}>
      Choose rating
    </button>
  )
}

const ShowRating = () => {
  return Emitter.listen('rating', (rating) => (<div>{rating}</div>))
}

ps: I'm using Solid.js for this at the moment, but if you know how to do this in React or any other JSX based thing let me know!