jsx-eslint · ljharb · Oct 26, 2022 · Oct 20, 2022
diff --git a/.github/workflows/readme.yml b/.github/workflows/readme.yml
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -19,8 +19,10 @@ This change log adheres to standards from [Keep a CHANGELOG](https://keepachange
 ### Changed
 * [Perf] component detection: improve performance by avoiding traversing parents unnecessarily ([#3459][] @golopot)
 * [Docs] `forbid-component-props`: inclusive language w/ allowlist ([#3473][] @AndersDJohnson)
+* [Docs] automate doc generation with `eslint-doc-generator` ([#3469][] @bmish)
 
 [#3473]: https://github.com/jsx-eslint/eslint-plugin-react/pull/3473
+[#3469]: https://github.com/jsx-eslint/eslint-plugin-react/pull/3469
 [#3464]: https://github.com/jsx-eslint/eslint-plugin-react/pull/3464
 [#3461]: https://github.com/jsx-eslint/eslint-plugin-react/issues/3461
 [#3459]: https://github.com/jsx-eslint/eslint-plugin-react/pull/3459

diff --git a/README.md b/README.md
diff --git a/docs/rules/boolean-prop-naming.md b/docs/rules/boolean-prop-naming.md
@@ -1,6 +1,6 @@
-# Enforces consistent naming for boolean props (react/boolean-prop-naming)
+# Enforces consistent naming for boolean props (`react/boolean-prop-naming`)
 
-💼 This rule is enabled in the following [configs](https://github.com/jsx-eslint/eslint-plugin-react#shareable-configurations): `all`.
+<!-- end auto-generated rule header -->
 
 Allows you to enforce a consistent naming pattern for props which expect a boolean value.
 

diff --git a/docs/rules/button-has-type.md b/docs/rules/button-has-type.md
@@ -1,6 +1,6 @@
-# Disallow usage of `button` elements without an explicit `type` attribute (react/button-has-type)
+# Disallow usage of `button` elements without an explicit `type` attribute (`react/button-has-type`)
 
-💼 This rule is enabled in the following [configs](https://github.com/jsx-eslint/eslint-plugin-react#shareable-configurations): `all`.
+<!-- end auto-generated rule header -->
 
 The default value of `type` attribute for `button` HTML element is `"submit"` which is often not the desired behavior and may lead to unexpected page reloads.
 This rules enforces an explicit `type` attribute for all the `button` elements and checks that its value is valid per spec (i.e., is one of `"button"`, `"submit"`, and `"reset"`).

diff --git a/docs/rules/default-props-match-prop-types.md b/docs/rules/default-props-match-prop-types.md
@@ -1,6 +1,6 @@
-# Enforce all defaultProps have a corresponding non-required PropType (react/default-props-match-prop-types)
+# Enforce all defaultProps have a corresponding non-required PropType (`react/default-props-match-prop-types`)
 
-💼 This rule is enabled in the following [configs](https://github.com/jsx-eslint/eslint-plugin-react#shareable-configurations): `all`.
+<!-- end auto-generated rule header -->
 
 This rule aims to ensure that any prop in `defaultProps` has a non-required type
 definition.

diff --git a/docs/rules/destructuring-assignment.md b/docs/rules/destructuring-assignment.md
@@ -1,8 +1,8 @@
-# Enforce consistent usage of destructuring assignment of props, state, and context (react/destructuring-assignment)
+# Enforce consistent usage of destructuring assignment of props, state, and context (`react/destructuring-assignment`)
 
-💼 This rule is enabled in the following [configs](https://github.com/jsx-eslint/eslint-plugin-react#shareable-configurations): `all`.
+🔧 This rule is automatically fixable by the [`--fix` CLI option](https://eslint.org/docs/latest/user-guide/command-line-interface#--fix).
 
-🔧 This rule is automatically fixable using the `--fix` [flag](https://eslint.org/docs/latest/user-guide/command-line-interface#--fix) on the command line.
+<!-- end auto-generated rule header -->
 
 Rule can be set to either of `always` or `never`;
 

diff --git a/docs/rules/display-name.md b/docs/rules/display-name.md
@@ -1,6 +1,8 @@
-# Disallow missing displayName in a React component definition (react/display-name)
+# Disallow missing displayName in a React component definition (`react/display-name`)
 
-💼 This rule is enabled in the following [configs](https://github.com/jsx-eslint/eslint-plugin-react#shareable-configurations): `all`, `recommended`.
+💼 This rule is enabled in the `recommended` [config](https://github.com/jsx-eslint/eslint-plugin-react/#shareable-configs).
+
+<!-- end auto-generated rule header -->
 
 DisplayName allows you to name your component. This name is used by React in debugging messages.
 

diff --git a/docs/rules/forbid-component-props.md b/docs/rules/forbid-component-props.md
@@ -1,6 +1,6 @@
-# Disallow certain props on components (react/forbid-component-props)
+# Disallow certain props on components (`react/forbid-component-props`)
 
-💼 This rule is enabled in the following [configs](https://github.com/jsx-eslint/eslint-plugin-react#shareable-configurations): `all`.
+<!-- end auto-generated rule header -->
 
 By default this rule prevents passing of [props that add lots of complexity](https://medium.com/brigade-engineering/don-t-pass-css-classes-between-components-e9f7ab192785) (`className`, `style`) to Components. This rule only applies to Components (e.g. `<Foo />`) and not DOM nodes (e.g. `<div />`). The list of forbidden props can be customized with the `forbid` option.
 

diff --git a/docs/rules/forbid-dom-props.md b/docs/rules/forbid-dom-props.md
@@ -1,6 +1,6 @@
-# Disallow certain props on DOM Nodes (react/forbid-dom-props)
+# Disallow certain props on DOM Nodes (`react/forbid-dom-props`)
 
-💼 This rule is enabled in the following [configs](https://github.com/jsx-eslint/eslint-plugin-react#shareable-configurations): `all`.
+<!-- end auto-generated rule header -->
 
 This rule prevents passing of props to elements. This rule only applies to DOM Nodes (e.g. `<div />`) and not Components (e.g. `<Component />`).
 The list of forbidden props can be customized with the `forbid` option.

diff --git a/docs/rules/forbid-elements.md b/docs/rules/forbid-elements.md
@@ -1,6 +1,6 @@
-# Disallow certain elements (react/forbid-elements)
+# Disallow certain elements (`react/forbid-elements`)
 
-💼 This rule is enabled in the following [configs](https://github.com/jsx-eslint/eslint-plugin-react#shareable-configurations): `all`.
+<!-- end auto-generated rule header -->
 
 You may want to forbid usage of certain elements in favor of others, (e.g. forbid all `<div />` and use `<Box />` instead). This rule allows you to configure a list of forbidden elements and to specify their desired replacements.
 

diff --git a/docs/rules/forbid-foreign-prop-types.md b/docs/rules/forbid-foreign-prop-types.md
@@ -1,6 +1,6 @@
-# Disallow using another component's propTypes (react/forbid-foreign-prop-types)
+# Disallow using another component's propTypes (`react/forbid-foreign-prop-types`)
 
-💼 This rule is enabled in the following [configs](https://github.com/jsx-eslint/eslint-plugin-react#shareable-configurations): `all`.
+<!-- end auto-generated rule header -->
 
 This rule forbids using another component's prop types unless they are explicitly imported/exported. This allows people who want to use [babel-plugin-transform-react-remove-prop-types](https://github.com/oliviertassinari/babel-plugin-transform-react-remove-prop-types) to remove propTypes from their components in production builds, to do so safely.
 

diff --git a/docs/rules/forbid-prop-types.md b/docs/rules/forbid-prop-types.md
@@ -1,6 +1,6 @@
-# Disallow certain propTypes (react/forbid-prop-types)
+# Disallow certain propTypes (`react/forbid-prop-types`)
 
-💼 This rule is enabled in the following [configs](https://github.com/jsx-eslint/eslint-plugin-react#shareable-configurations): `all`.
+<!-- end auto-generated rule header -->
 
 By default this rule prevents vague prop types with more specific alternatives available (`any`, `array`, `object`), but any prop type can be disabled if desired. The defaults are chosen because they have obvious replacements. `any` should be replaced with, well, anything. `array` and `object` can be replaced with `arrayOf` and `shape`, respectively.
 

diff --git a/docs/rules/function-component-definition.md b/docs/rules/function-component-definition.md
@@ -1,8 +1,8 @@
-# Enforce a specific function type for function components (react/function-component-definition)
+# Enforce a specific function type for function components (`react/function-component-definition`)
 
-💼 This rule is enabled in the following [configs](https://github.com/jsx-eslint/eslint-plugin-react#shareable-configurations): `all`.
+🔧 This rule is automatically fixable by the [`--fix` CLI option](https://eslint.org/docs/latest/user-guide/command-line-interface#--fix).
 
-🔧 This rule is automatically fixable using the `--fix` [flag](https://eslint.org/docs/latest/user-guide/command-line-interface#--fix) on the command line.
+<!-- end auto-generated rule header -->
 
 This option enforces a specific function type for function components.
 

diff --git a/docs/rules/hook-use-state.md b/docs/rules/hook-use-state.md
@@ -1,6 +1,8 @@
-# Ensure destructuring and symmetric naming of useState hook value and setter variables (react/hook-use-state)
+# Ensure destructuring and symmetric naming of useState hook value and setter variables (`react/hook-use-state`)
 
-💼 This rule is enabled in the following [configs](https://github.com/jsx-eslint/eslint-plugin-react#shareable-configurations): `all`.
+💡 This rule is manually fixable by [editor suggestions](https://eslint.org/docs/developer-guide/working-with-rules#providing-suggestions).
+
+<!-- end auto-generated rule header -->
 
 💡 This rule provides editor [suggestions](https://eslint.org/docs/developer-guide/working-with-rules#providing-suggestions).
 

diff --git a/docs/rules/iframe-missing-sandbox.md b/docs/rules/iframe-missing-sandbox.md
@@ -1,6 +1,6 @@
-# Enforce sandbox attribute on iframe elements (react/iframe-missing-sandbox)
+# Enforce sandbox attribute on iframe elements (`react/iframe-missing-sandbox`)
 
-💼 This rule is enabled in the following [configs](https://github.com/jsx-eslint/eslint-plugin-react#shareable-configurations): `all`.
+<!-- end auto-generated rule header -->
 
 The sandbox attribute enables an extra set of restrictions for the content in the iframe. Using sandbox attribute is considered a good security practice.
 

diff --git a/docs/rules/jsx-boolean-value.md b/docs/rules/jsx-boolean-value.md
@@ -1,8 +1,8 @@
-# Enforce boolean attributes notation in JSX (react/jsx-boolean-value)
+# Enforce boolean attributes notation in JSX (`react/jsx-boolean-value`)
 
-💼 This rule is enabled in the following [configs](https://github.com/jsx-eslint/eslint-plugin-react#shareable-configurations): `all`.
+🔧 This rule is automatically fixable by the [`--fix` CLI option](https://eslint.org/docs/latest/user-guide/command-line-interface#--fix).
 
-🔧 This rule is automatically fixable using the `--fix` [flag](https://eslint.org/docs/latest/user-guide/command-line-interface#--fix) on the command line.
+<!-- end auto-generated rule header -->
 
 [When using a boolean attribute in JSX](https://facebook.github.io/react/docs/jsx-in-depth.html#boolean-attributes), you can set the attribute value to `true` or omit the value.
 

diff --git a/docs/rules/jsx-child-element-spacing.md b/docs/rules/jsx-child-element-spacing.md
@@ -1,6 +1,6 @@
-# Enforce or disallow spaces inside of curly braces in JSX attributes and expressions (react/jsx-child-element-spacing)
+# Enforce or disallow spaces inside of curly braces in JSX attributes and expressions (`react/jsx-child-element-spacing`)
 
-💼 This rule is enabled in the following [configs](https://github.com/jsx-eslint/eslint-plugin-react#shareable-configurations): `all`.
+<!-- end auto-generated rule header -->
 
 ## Rule Details
 

diff --git a/docs/rules/jsx-closing-bracket-location.md b/docs/rules/jsx-closing-bracket-location.md
@@ -1,8 +1,8 @@
-# Enforce closing bracket location in JSX (react/jsx-closing-bracket-location)
+# Enforce closing bracket location in JSX (`react/jsx-closing-bracket-location`)
 
-💼 This rule is enabled in the following [configs](https://github.com/jsx-eslint/eslint-plugin-react#shareable-configurations): `all`.
+🔧 This rule is automatically fixable by the [`--fix` CLI option](https://eslint.org/docs/latest/user-guide/command-line-interface#--fix).
 
-🔧 This rule is automatically fixable using the `--fix` [flag](https://eslint.org/docs/latest/user-guide/command-line-interface#--fix) on the command line.
+<!-- end auto-generated rule header -->
 
 Enforce the closing bracket location for JSX multiline elements.
 

diff --git a/docs/rules/jsx-closing-tag-location.md b/docs/rules/jsx-closing-tag-location.md
@@ -1,8 +1,8 @@
-# Enforce closing tag location for multiline JSX (react/jsx-closing-tag-location)
+# Enforce closing tag location for multiline JSX (`react/jsx-closing-tag-location`)
 
-💼 This rule is enabled in the following [configs](https://github.com/jsx-eslint/eslint-plugin-react#shareable-configurations): `all`.
+🔧 This rule is automatically fixable by the [`--fix` CLI option](https://eslint.org/docs/latest/user-guide/command-line-interface#--fix).
 
-🔧 This rule is automatically fixable using the `--fix` [flag](https://eslint.org/docs/latest/user-guide/command-line-interface#--fix) on the command line.
+<!-- end auto-generated rule header -->
 
 Enforce the closing tag location for multiline JSX elements.
 

diff --git a/docs/rules/jsx-curly-brace-presence.md b/docs/rules/jsx-curly-brace-presence.md
@@ -1,8 +1,8 @@
-# Disallow unnecessary JSX expressions when literals alone are sufficient or enforce JSX expressions on literals in JSX children or attributes (react/jsx-curly-brace-presence)
+# Disallow unnecessary JSX expressions when literals alone are sufficient or enforce JSX expressions on literals in JSX children or attributes (`react/jsx-curly-brace-presence`)
 
-💼 This rule is enabled in the following [configs](https://github.com/jsx-eslint/eslint-plugin-react#shareable-configurations): `all`.
+🔧 This rule is automatically fixable by the [`--fix` CLI option](https://eslint.org/docs/latest/user-guide/command-line-interface#--fix).
 
-🔧 This rule is automatically fixable using the `--fix` [flag](https://eslint.org/docs/latest/user-guide/command-line-interface#--fix) on the command line.
+<!-- end auto-generated rule header -->
 
 This rule allows you to enforce curly braces or disallow unnecessary curly braces in JSX props and/or children.
 

diff --git a/docs/rules/jsx-curly-newline.md b/docs/rules/jsx-curly-newline.md
@@ -1,8 +1,8 @@
-# Enforce consistent linebreaks in curly braces in JSX attributes and expressions (react/jsx-curly-newline)
+# Enforce consistent linebreaks in curly braces in JSX attributes and expressions (`react/jsx-curly-newline`)
 
-💼 This rule is enabled in the following [configs](https://github.com/jsx-eslint/eslint-plugin-react#shareable-configurations): `all`.
+🔧 This rule is automatically fixable by the [`--fix` CLI option](https://eslint.org/docs/latest/user-guide/command-line-interface#--fix).
 
-🔧 This rule is automatically fixable using the `--fix` [flag](https://eslint.org/docs/latest/user-guide/command-line-interface#--fix) on the command line.
+<!-- end auto-generated rule header -->
 
 Many style guides require or disallow newlines inside of jsx curly expressions.
 

diff --git a/docs/rules/jsx-curly-spacing.md b/docs/rules/jsx-curly-spacing.md
@@ -1,8 +1,8 @@
-# Enforce or disallow spaces inside of curly braces in JSX attributes and expressions (react/jsx-curly-spacing)
+# Enforce or disallow spaces inside of curly braces in JSX attributes and expressions (`react/jsx-curly-spacing`)
 
-💼 This rule is enabled in the following [configs](https://github.com/jsx-eslint/eslint-plugin-react#shareable-configurations): `all`.
+🔧 This rule is automatically fixable by the [`--fix` CLI option](https://eslint.org/docs/latest/user-guide/command-line-interface#--fix).
 
-🔧 This rule is automatically fixable using the `--fix` [flag](https://eslint.org/docs/latest/user-guide/command-line-interface#--fix) on the command line.
+<!-- end auto-generated rule header -->
 
 While formatting preferences are very personal, a number of style guides require or disallow spaces between curly braces.
 

diff --git a/docs/rules/jsx-equals-spacing.md b/docs/rules/jsx-equals-spacing.md
@@ -1,8 +1,8 @@
-# Enforce or disallow spaces around equal signs in JSX attributes (react/jsx-equals-spacing)
+# Enforce or disallow spaces around equal signs in JSX attributes (`react/jsx-equals-spacing`)
 
-💼 This rule is enabled in the following [configs](https://github.com/jsx-eslint/eslint-plugin-react#shareable-configurations): `all`.
+🔧 This rule is automatically fixable by the [`--fix` CLI option](https://eslint.org/docs/latest/user-guide/command-line-interface#--fix).
 
-🔧 This rule is automatically fixable using the `--fix` [flag](https://eslint.org/docs/latest/user-guide/command-line-interface#--fix) on the command line.
+<!-- end auto-generated rule header -->
 
 Some style guides require or disallow spaces around equal signs.
 

diff --git a/docs/rules/jsx-filename-extension.md b/docs/rules/jsx-filename-extension.md
@@ -1,6 +1,6 @@
-# Disallow file extensions that may contain JSX (react/jsx-filename-extension)
+# Disallow file extensions that may contain JSX (`react/jsx-filename-extension`)
 
-💼 This rule is enabled in the following [configs](https://github.com/jsx-eslint/eslint-plugin-react#shareable-configurations): `all`.
+<!-- end auto-generated rule header -->
 
 ## Rule Details
 

diff --git a/docs/rules/jsx-first-prop-new-line.md b/docs/rules/jsx-first-prop-new-line.md
@@ -1,8 +1,8 @@
-# Enforce proper position of the first property in JSX (react/jsx-first-prop-new-line)
+# Enforce proper position of the first property in JSX (`react/jsx-first-prop-new-line`)
 
-💼 This rule is enabled in the following [configs](https://github.com/jsx-eslint/eslint-plugin-react#shareable-configurations): `all`.
+🔧 This rule is automatically fixable by the [`--fix` CLI option](https://eslint.org/docs/latest/user-guide/command-line-interface#--fix).
 
-🔧 This rule is automatically fixable using the `--fix` [flag](https://eslint.org/docs/latest/user-guide/command-line-interface#--fix) on the command line.
+<!-- end auto-generated rule header -->
 
 Ensure correct position of the first property.
 

diff --git a/docs/rules/jsx-fragments.md b/docs/rules/jsx-fragments.md
@@ -1,8 +1,8 @@
-# Enforce shorthand or standard form for React fragments (react/jsx-fragments)
+# Enforce shorthand or standard form for React fragments (`react/jsx-fragments`)
 
-💼 This rule is enabled in the following [configs](https://github.com/jsx-eslint/eslint-plugin-react#shareable-configurations): `all`.
+🔧 This rule is automatically fixable by the [`--fix` CLI option](https://eslint.org/docs/latest/user-guide/command-line-interface#--fix).
 
-🔧 This rule is automatically fixable using the `--fix` [flag](https://eslint.org/docs/latest/user-guide/command-line-interface#--fix) on the command line.
+<!-- end auto-generated rule header -->
 
 In JSX, a React [fragment] is created either with `<React.Fragment>...</React.Fragment>`, or, using the shorthand syntax, `<>...</>`.
 

diff --git a/docs/rules/jsx-handler-names.md b/docs/rules/jsx-handler-names.md
@@ -1,6 +1,6 @@
-# Enforce event handler naming conventions in JSX (react/jsx-handler-names)
+# Enforce event handler naming conventions in JSX (`react/jsx-handler-names`)
 
-💼 This rule is enabled in the following [configs](https://github.com/jsx-eslint/eslint-plugin-react#shareable-configurations): `all`.
+<!-- end auto-generated rule header -->
 
 Ensures that any component or prop methods used to handle events are correctly prefixed.
 

diff --git a/docs/rules/jsx-indent-props.md b/docs/rules/jsx-indent-props.md
@@ -1,8 +1,8 @@
-# Enforce props indentation in JSX (react/jsx-indent-props)
+# Enforce props indentation in JSX (`react/jsx-indent-props`)
 
-💼 This rule is enabled in the following [configs](https://github.com/jsx-eslint/eslint-plugin-react#shareable-configurations): `all`.
+🔧 This rule is automatically fixable by the [`--fix` CLI option](https://eslint.org/docs/latest/user-guide/command-line-interface#--fix).
 
-🔧 This rule is automatically fixable using the `--fix` [flag](https://eslint.org/docs/latest/user-guide/command-line-interface#--fix) on the command line.
+<!-- end auto-generated rule header -->
 
 This option validates a specific indentation style for props.
 

diff --git a/docs/rules/jsx-indent.md b/docs/rules/jsx-indent.md
@@ -1,8 +1,8 @@
-# Enforce JSX indentation (react/jsx-indent)
+# Enforce JSX indentation (`react/jsx-indent`)
 
-💼 This rule is enabled in the following [configs](https://github.com/jsx-eslint/eslint-plugin-react#shareable-configurations): `all`.
+🔧 This rule is automatically fixable by the [`--fix` CLI option](https://eslint.org/docs/latest/user-guide/command-line-interface#--fix).
 
-🔧 This rule is automatically fixable using the `--fix` [flag](https://eslint.org/docs/latest/user-guide/command-line-interface#--fix) on the command line.
+<!-- end auto-generated rule header -->
 
 This option validates a specific indentation style for JSX.
 

diff --git a/docs/rules/jsx-key.md b/docs/rules/jsx-key.md
@@ -1,6 +1,8 @@
-# Disallow missing `key` props in iterators/collection literals (react/jsx-key)
+# Disallow missing `key` props in iterators/collection literals (`react/jsx-key`)
 
-💼 This rule is enabled in the following [configs](https://github.com/jsx-eslint/eslint-plugin-react#shareable-configurations): `all`, `recommended`.
+💼 This rule is enabled in the `recommended` [config](https://github.com/jsx-eslint/eslint-plugin-react/#shareable-configs).
+
+<!-- end auto-generated rule header -->
 
 Warn if an element that likely requires a `key` prop--namely, one present in an
 array literal or an arrow function expression.

diff --git a/docs/rules/jsx-max-depth.md b/docs/rules/jsx-max-depth.md
@@ -1,6 +1,6 @@
-# Enforce JSX maximum depth (react/jsx-max-depth)
+# Enforce JSX maximum depth (`react/jsx-max-depth`)
 
-💼 This rule is enabled in the following [configs](https://github.com/jsx-eslint/eslint-plugin-react#shareable-configurations): `all`.
+<!-- end auto-generated rule header -->
 
 This option validates a specific depth for JSX.