Skip to content

Conversation

@MartinCura
Copy link

@MartinCura MartinCura commented May 24, 2019

Follow eslint rule react/jsx-closing-bracket-location [1] by decreasing indent for a lonely closing bracket and not doing so for its next line. Fixes #129, fixes #210, fixes #284.

If a multi-line element is self-closing, the closing bracket should be aligned with the opening bracket. And because of this, there's no need to decrease the indent on the next line (less so automatically each time one types anything).

For example, under the previous behaviour:

<View>
  <Image
    source={...}
    style={{ width: 20 }}
    />
  <Text>Lorem ipsum</Text>
</View>

If one where to correct it manually, the next line would be problematic:

<View>
  <Image
    source={...}
    style={{ width: 20 }}
  />
<Text>Lorem ipsum</Text>
</View>

New behaviour:

<View>
  <Image
    source={...}
    style={{ width: 20 }}
  />
  <Text>Lorem ipsum</Text>
</View>

Checked for test regressions ✔️

Previous fix in #131 was rollbacked.
Anything i can help with so that this is merged, please tell me!

[1] https://github.com/yannickcr/eslint-plugin-react/blob/master/docs/rules/jsx-closing-bracket-location.md

Follow eslint rule jsx-closing-bracket-location [1] by not decreasing
indent on a lonely closing bracket. More info in PR.

[1] https://github.com/yannickcr/eslint-plugin-react/blob/master/docs/rules/jsx-closing-bracket-location.md
Decrease the indentation when inserting simply '/>', so that in the
flow of typing it aligns with the opening bracket for a multi-line
self-closing element. Check PR for more info.
@MartinCura MartinCura marked this pull request as ready for review May 24, 2019 19:51
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Incorrect indentation after multi-line self-closing element Indentation issues respect react/jsx-closing-bracket-location

1 participant