Will the compiler support plain JSX function calls again?

[fhammerschmidt]

This used to work at some point? But now it seems to check for either a hook function or a JSX return value to determine if it is a component. In ReScript we compile built-in JSX to plain function calls like so:

// ReScript input
module Button = {
  @react.component
  let make = () => <button className="inline-block px-6" />
}

// JS output
import * as JsxRuntime from "react/jsx-runtime";

function Playground$Button(props) {
  return JsxRuntime.jsx("button", {
    className: "inline-block px-6"
  });
}

Otherwise, this would require us to implement a "preserve" mode, where all the ReScript JSX needs to be transpiled to JS JSX.

[nojaf]

Hello @poteto, any thoughts on this?

[fhammerschmidt]

The only workaround is to annotate every component with "use memo" it seems.

https://playground.react.dev/#N4Igzg9grgTgxgUxALhAejQAgOIIHYIwCGALggCaYBGAnpgEoIDKcMAlgA4kA0mACgBkAogEEmQzEIAiASQAqmAOryAEpgDCI+kIA6ePWwC2HCDBKYAVJiJhMAKTAAPelDwkjCTADMYEQ5h0QGAQiOBI0ACsnAFoYV3dDBECAbj09L1cwtgg8TEMiAGsEAAoOXw4wAEpMYD1MAJAoME9EwwhAuswAGwRzAgB3YLhTSgBeGswAOmmyiArMAF9U3Mxgklhch2d4j0mox2LAqigSEhzA3mKBoZHJuC6bMAA5IkTMccCOR2iANkwOGjRABMkwArNQAObRKhdKAIX4ABgRF0w1wQwxg5EqlWWCzSBEcJjMNU6+SK3D0eP0eBACyAA

[nojaf]

Oh, that is interesting! Using JsxRuntime.jsx might not prompt the compiler to recognize the function as a React component. If that's the case, it seems feasible to enhance that detection, perhaps?

[fhammerschmidt]

Yes it seems that the autodetection is just not implemented (yet?) and I mainly wanted to know here if that is on the roadmap. Thanks for digging it up again.
@poteto @josephsavona