How do you allow consumers to pass functions into components?

[brandonpittman]

If I have a Button component and want to let the consumer pass in an onClick handler, I run into trouble like this:

type ButtonProps = {
  onClick: (event: MouseEvent) => void
}

But when I try to use this with Qwik, it wants the $ at the end of onClick. The Qwik component from Mitosis is set to onClick$, but if I check props, it's looking for onClick and fails when it's undefined. If I check props.onClick$ it'll work, but then the React consumer would also have to pass its handler as onClick$ which isn't a thing you'd do in React and I'm not sure it would even work.

The docs gives no guidance on this.

Mitosis gets pitched as a solution for building design systems but it can't handle children types, function props, or ...rest spreads.

[samijaber]

This might be better suited as an issue. If you could create one with the proper reproduction steps, we can then investigate a possible fix.

[k-schneider]

Did an issue ever get created for this? I'm wondering what the best approach is myself. You can use $ to create a QRL and use onClick without the trailing $ but it's kind of tedious and doesn't mesh well with how Qwik components should work.