rescript-lang / rescript

ReScript is a robustly typed language that compiles to efficient and human-readable JavaScript.
https://rescript-lang.org
Other
6.76k stars 449 forks source link

React PPX v4 no longer drops leading underscore from prop name #5908

Closed Minnozz closed 1 month ago

Minnozz commented 1 year ago

In previous versions of ReScript / the React PPX, I used the following bindings:

module Chart = {
   @module("react-chartjs-2") @react.component
   external make: (~_type: ChartType.t, ~data: {..}, ~options: {..}) => React.element = "Chart"
 }

The leading underscore from ~_type was dropped to bind to the prop type.

In the new React PPX, this underscore is no longer dropped, which makes the binding not work.

Minnozz commented 1 year ago

I believe this is related to #5904, but maybe this change should be mentioned separately in the changelog.

shulhi commented 1 year ago

I have the same issue, as a workaround, I did something like this – use an intermediate type as the prop (@as) working fine here.


module FormattedMessage = {
  module Internal = {
    @react.component @module("react-intl")
    external make: (
      ~id: string,
      ~defaultMessage: string,
      ~tagName: string=?,
      ~values: {..}=?,
      ~children: (~formattedMessage: React.element) => React.element=?,
    ) => React.element = "FormattedMessage"
  }

  type props<'a> = {
    @as("id") id_: string,
    defaultMessage: string,
    tagName?: string,
    values?: {..} as 'a,
  }

  let make = (props: props<'a>) =>
    <Internal
      id={props.id_}
      defaultMessage={props.defaultMessage}
      tagName=?{props.tagName}
      values=?{props.values}
    />
}
mununki commented 1 year ago

@Minnozz Good catch! I've updated the changelog in the following PR #5905 Thank you for suggestion.

mununki commented 1 year ago

Changelog https://github.com/rescript-lang/rescript-compiler/pull/5905/commits/196493893c021431607510749b5387a2e0333bc3

mununki commented 1 year ago

@shulhi That would be a good workaround without @react.component until the PR is merged. Thanks!

cknitt commented 1 year ago

Another option is to use ~\"type": ChartType.t.

github-actions[bot] commented 1 month ago

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.