Reason: Placement of closing `>` in JSX

Created on 24 Feb 2018  路  4Comments  路  Source: reasonml/reason

/* Now */
<Component
  prop1
  prop2>
  ("child" |> ReasonReact.stringToElement)
</Component>

/* VS */
<Component
  prop1
  prop2
>
  ("child" |> ReasonReact.stringToElement)
</Component>

I used to the latter, imo it's easier to spot this place this way. Also, it's consistent with:

<Component
  prop1
  prop2
/>
FEATURE REQUEST Printer

Most helpful comment

@IwanKaramazow @rickyvetter TBH current behavior introduces a lot of inconvenience:

  • it's not possible to delete last prop w/o moving closing > to the next line
  • it's not possible to comment out last prop w/o moving closing > to the next line
  • it's not possible to add new prop after the last on by pressing o (vim) or Cmd + Enter w/o moving closing > to the next line.

Can it be reconsidered?

All 4 comments

Another option would be to further indent the properties.

<Component
    prop1
    prop2>
  ("child" |> ReasonReact.stringToElement)
</Component>

This makes the distinction between props and children more clear without adding an extra line. The Google style guide suggests formatting tags this way.

I'd be consistent w/ Prettier and /> 馃槢

I agree it would be best if /> and > formatted consistently.

@IwanKaramazow @rickyvetter TBH current behavior introduces a lot of inconvenience:

  • it's not possible to delete last prop w/o moving closing > to the next line
  • it's not possible to comment out last prop w/o moving closing > to the next line
  • it's not possible to add new prop after the last on by pressing o (vim) or Cmd + Enter w/o moving closing > to the next line.

Can it be reconsidered?

Was this page helpful?
0 / 5 - 0 ratings

Related issues

chenglou picture chenglou  路  3Comments

shaneosullivan picture shaneosullivan  路  3Comments

ondrejsevcik picture ondrejsevcik  路  3Comments

TrakBit picture TrakBit  路  3Comments

bobzhang picture bobzhang  路  3Comments