From 04b4db1bcd95f0e0af3727c3d27a8ae49f8327ce Mon Sep 17 00:00:00 2001
From: Bryan Mishkin <698306+bmish@users.noreply.github.com>
Date: Sun, 21 Aug 2022 15:18:37 -0400
Subject: [PATCH] [Docs] Add markdownlint for documentation formatting
consistency
---
.markdownlint.json | 4 ++++
.markdownlintignore | 3 +++
README.md | 24 +++++++++----------
SECURITY.md | 1 -
docs/rules/boolean-prop-naming.md | 7 +++---
docs/rules/default-props-match-prop-types.md | 2 +-
docs/rules/destructuring-assignment.md | 1 +
docs/rules/iframe-missing-sandbox.md | 2 +-
docs/rules/jsx-curly-brace-presence.md | 8 ++++---
docs/rules/jsx-curly-newline.md | 2 +-
docs/rules/jsx-fragments.md | 4 ++--
docs/rules/jsx-indent-props.md | 1 -
docs/rules/jsx-max-props-per-line.md | 3 +++
docs/rules/jsx-newline.md | 2 +-
docs/rules/jsx-no-bind.md | 3 +++
.../jsx-no-constructed-context-values.md | 7 +++---
docs/rules/jsx-no-leaked-render.md | 8 ++++++-
docs/rules/jsx-no-script-url.md | 3 +++
docs/rules/jsx-no-target-blank.md | 2 +-
docs/rules/jsx-no-undef.md | 1 -
docs/rules/jsx-wrap-multilines.md | 3 ---
docs/rules/no-arrow-function-lifecycle.md | 1 +
docs/rules/no-danger-with-children.md | 1 -
docs/rules/no-danger.md | 2 +-
docs/rules/no-direct-mutation-state.md | 1 -
docs/rules/no-invalid-html-attribute.md | 1 +
docs/rules/no-string-refs.md | 1 +
docs/rules/no-typos.md | 1 -
docs/rules/no-unsafe.md | 2 ++
docs/rules/no-unused-prop-types.md | 3 ++-
docs/rules/prefer-stateless-function.md | 1 -
docs/rules/require-default-props.md | 2 +-
docs/rules/require-optimization.md | 15 ++++++------
docs/rules/sort-comp.md | 1 +
docs/rules/state-in-constructor.md | 1 -
docs/rules/static-property-placement.md | 23 ++++++++++--------
docs/rules/style-prop-object.md | 7 +++++-
docs/rules/void-dom-elements-no-children.md | 1 -
package.json | 4 ++++
39 files changed, 96 insertions(+), 63 deletions(-)
create mode 100644 .markdownlint.json
create mode 100644 .markdownlintignore
diff --git a/.markdownlint.json b/.markdownlint.json
new file mode 100644
index 0000000000..712a464c26
--- /dev/null
+++ b/.markdownlint.json
@@ -0,0 +1,4 @@
+{
+ "line-length": false,
+ "no-hard-tabs": { "spaces_per_tab": 2 }
+}
diff --git a/.markdownlintignore b/.markdownlintignore
new file mode 100644
index 0000000000..bdaede90d0
--- /dev/null
+++ b/.markdownlintignore
@@ -0,0 +1,3 @@
+CHANGELOG.md
+LICENSE
+node_modules
diff --git a/README.md b/README.md
index 49416de595..58c537e857 100644
--- a/README.md
+++ b/README.md
@@ -1,4 +1,6 @@
+
# `eslint-plugin-react` [![Version Badge][npm-version-svg]][package-url]
+
===================
[![github actions][actions-image]][actions-url]
@@ -8,16 +10,15 @@
React specific linting rules for `eslint`
-# Installation
+## Installation
```sh
-$ npm install eslint eslint-plugin-react --save-dev
+npm install eslint eslint-plugin-react --save-dev
```
It is also possible to install ESLint globally rather than locally (using npm install eslint --global). However, this is not recommended, and any plugins or shareable configs that you use must be installed locally in either case.
-# Configuration
-
+## Configuration
Use [our preset](#recommended) to get reasonable defaults:
@@ -109,7 +110,7 @@ Enable the rules that you would like to use.
}
```
-# List of supported rules
+## List of supported rules
✔: Enabled in the [`recommended`](#recommended) configuration.\
🔧: Fixable with [`eslint --fix`](https://eslint.org/docs/user-guide/command-line-interface#fixing-problems).\
@@ -179,7 +180,7 @@ Enable the rules that you would like to use.
| | | | [react/void-dom-elements-no-children](docs/rules/void-dom-elements-no-children.md) | Disallow void DOM elements (e.g. ``, ` `) from receiving children |
-## JSX-specific rules
+### JSX-specific rules
| ✔ | 🔧 | 💡 | Rule | Description |
@@ -225,15 +226,15 @@ Enable the rules that you would like to use.
| | 🔧 | | [react/jsx-wrap-multilines](docs/rules/jsx-wrap-multilines.md) | Disallow missing parentheses around multiline JSX |
-## Other useful plugins
+### Other useful plugins
- Rules of Hooks: [eslint-plugin-react-hooks](https://github.com/facebook/react/tree/master/packages/eslint-plugin-react-hooks)
- JSX accessibility: [eslint-plugin-jsx-a11y](https://github.com/evcohen/eslint-plugin-jsx-a11y)
- React Native: [eslint-plugin-react-native](https://github.com/Intellicode/eslint-plugin-react-native)
-# Shareable configurations
+## Shareable configurations
-## Recommended
+### Recommended
This plugin exports a `recommended` configuration that enforces React good practices.
@@ -247,7 +248,7 @@ To enable this configuration use the `extends` property in your `.eslintrc` conf
See [`eslint` documentation](https://eslint.org/docs/user-guide/configuring/configuration-files#extending-configuration-files) for more information about extending configuration files.
-## All
+### All
This plugin also exports an `all` configuration that includes every available rule.
This pairs well with the `eslint:all` rule.
@@ -263,11 +264,10 @@ This pairs well with the `eslint:all` rule.
**Note**: These configurations will import `eslint-plugin-react` and enable JSX in [parser options](https://eslint.org/docs/user-guide/configuring/language-options#specifying-parser-options).
-# License
+## License
`eslint-plugin-react` is licensed under the [MIT License](https://opensource.org/licenses/mit-license.php).
-
[npm-url]: https://npmjs.org/package/eslint-plugin-react
[npm-image]: https://img.shields.io/npm/v/eslint-plugin-react.svg
diff --git a/SECURITY.md b/SECURITY.md
index 8ea2512832..5f02cd3af8 100644
--- a/SECURITY.md
+++ b/SECURITY.md
@@ -9,7 +9,6 @@ This is the list of versions of `eslint-plugin-react` which are currently being
| 7.x | :white_check_mark: |
| < 7.x | :x: |
-
## Reporting a Vulnerability
To report a security vulnerability, please use the [Tidelift security contact](https://tidelift.com/security). Tidelift will coordinate the fix and disclosure.
diff --git a/docs/rules/boolean-prop-naming.md b/docs/rules/boolean-prop-naming.md
index 3c043ca9c0..ff642f7abc 100644
--- a/docs/rules/boolean-prop-naming.md
+++ b/docs/rules/boolean-prop-naming.md
@@ -36,6 +36,7 @@ var Hello = createReactClass({
render: function() { return
; };
});
```
+
```jsx
type Props = {
isEnabled: boolean
@@ -94,8 +95,8 @@ The custom message to display upon failure to match the rule. This overrides the
If you choose to use a custom message, you have access to two template variables.
-* `propName` – the name of the prop that does not match the pattern
-* `pattern` – the pattern against which all prop names are tested
+- `propName` – the name of the prop that does not match the pattern
+- `pattern` – the pattern against which all prop names are tested
For example, if a prop is named `something`, and if the rule's pattern is set to `"^(is|has)[A-Z]([A-Za-z0-9]?)+"`, you could set the custom message as follows:
@@ -105,7 +106,7 @@ message: 'It is better if your prop ({{ propName }}) matches this pattern: ({{ p
And the failure would look like so:
-```
+```plaintext
It is better if your prop (something) matches this pattern: (^is[A-Z]([A-Za-z0-9]?)+)
```
diff --git a/docs/rules/default-props-match-prop-types.md b/docs/rules/default-props-match-prop-types.md
index c3b8bd6400..2992221e2a 100644
--- a/docs/rules/default-props-match-prop-types.md
+++ b/docs/rules/default-props-match-prop-types.md
@@ -192,7 +192,7 @@ If you don't care about stray `defaultsProps` in your components, you can disabl
- [require-default-props](./require-default-props.md)
-# Resources
+## Resources
- [Official React documentation on defaultProps](https://facebook.github.io/react/docs/typechecking-with-proptypes.html#default-prop-values)
diff --git a/docs/rules/destructuring-assignment.md b/docs/rules/destructuring-assignment.md
index efbe0d9af6..a6b516d31f 100644
--- a/docs/rules/destructuring-assignment.md
+++ b/docs/rules/destructuring-assignment.md
@@ -3,6 +3,7 @@
🔧 This rule is automatically fixable using the `--fix` [flag](https://eslint.org/docs/latest/user-guide/command-line-interface#--fix) on the command line.
Rule can be set to either of `always` or `never`;
+
```js
"react/destructuring-assignment": [, 'always']
```
diff --git a/docs/rules/iframe-missing-sandbox.md b/docs/rules/iframe-missing-sandbox.md
index f21f98ad9f..2f5fad8b58 100644
--- a/docs/rules/iframe-missing-sandbox.md
+++ b/docs/rules/iframe-missing-sandbox.md
@@ -2,7 +2,7 @@
The sandbox attribute enables an extra set of restrictions for the content in the iframe. Using sandbox attribute is considered a good security practice.
-See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe#attr-sandbox
+See
## Rule Details
diff --git a/docs/rules/jsx-curly-brace-presence.md b/docs/rules/jsx-curly-brace-presence.md
index b4d7bff0aa..fb64b1b666 100644
--- a/docs/rules/jsx-curly-brace-presence.md
+++ b/docs/rules/jsx-curly-brace-presence.md
@@ -32,7 +32,7 @@ or alternatively
...
```
-### Valid options for
+### Valid options for ``
They are `always`, `never` and `ignore` for checking on JSX props and children.
@@ -45,7 +45,7 @@ If passed in the option to fix, this is how a style violation will get fixed
* `always`: wrap a JSX attribute in curly braces/JSX expression and/or a JSX child the same way but also with double quotes
* `never`: get rid of curly braces from a JSX attribute and/or a JSX child
-- All fixing operations use double quotes.
+* All fixing operations use double quotes.
For examples:
@@ -78,6 +78,7 @@ They can be fixed to:
```
Examples of **incorrect** code for this rule, when configured with `{ props: "always", children: "always", "propElementValues": "always" }`:
+
```jsx
/>;
```
@@ -89,6 +90,7 @@ They can be fixed to:
```
Examples of **incorrect** code for this rule, when configured with `{ props: "never", children: "never", "propElementValues": "never" }`:
+
```jsx
} />;
```
@@ -115,6 +117,7 @@ Examples of **incorrect** code for this rule, when configured with `"always"`:
```
They can be fixed to:
+
```jsx
{"Hello world"};
{"Hello world"};
@@ -152,7 +155,6 @@ will be warned and fixed to:
For example:
-
```jsx
Hello 'foo' "bar" world;
```
diff --git a/docs/rules/jsx-curly-newline.md b/docs/rules/jsx-curly-newline.md
index 7243fabe05..22bce651f5 100644
--- a/docs/rules/jsx-curly-newline.md
+++ b/docs/rules/jsx-curly-newline.md
@@ -18,6 +18,7 @@ This rule accepts either an object option:
singleline: "consistent" | "forbid" | "require", // default to 'consistent'
}
```
+
Option `multiline` takes effect when the jsx expression inside the curlies occupies multiple lines.
Option `singleline` takes effect when the jsx expression inside the curlies occupies a single line.
@@ -143,7 +144,6 @@ Examples of **correct** code for this rule:
```
-
## When Not To Use It
You can turn this rule off if you are not concerned with the consistency of padding linebreaks inside of JSX attributes or expressions.
diff --git a/docs/rules/jsx-fragments.md b/docs/rules/jsx-fragments.md
index 12b96eab6e..7b9e72d36f 100644
--- a/docs/rules/jsx-fragments.md
+++ b/docs/rules/jsx-fragments.md
@@ -2,7 +2,7 @@
🔧 This rule is automatically fixable using the `--fix` [flag](https://eslint.org/docs/latest/user-guide/command-line-interface#--fix) on the command line.
-In JSX, a React fragment is created either with `...`, or, using the shorthand syntax, `<>...>`.
+In JSX, a React [fragment] is created either with `...`, or, using the shorthand syntax, `<>...>`.
## Rule Details
@@ -58,6 +58,6 @@ Examples of **correct** code for this rule:
```
-[fragments]: https://reactjs.org/docs/fragments.html
+[fragment]: https://reactjs.org/docs/fragments.html
[shared_settings]: /README.md#configuration
[short_syntax]: https://reactjs.org/docs/fragments.html#short-syntax
diff --git a/docs/rules/jsx-indent-props.md b/docs/rules/jsx-indent-props.md
index fa5e32f5da..6800f5aa31 100644
--- a/docs/rules/jsx-indent-props.md
+++ b/docs/rules/jsx-indent-props.md
@@ -34,7 +34,6 @@ The indent mode can be `"tab"` for tab-based indentation, a positive number for
Note that using the `"first"` option allows very inconsistent indentation unless you also enable a rule that enforces the position of the first prop.
If the second parameter is an object, it can be used to specify the indent mode as well as the option `ignoreTernaryOperator`, which causes the indent level not to be increased by a `?` or `:` operator (default is `false`).
-
```js
...
"react/jsx-indent-props": [, 'tab'||'first'|