feat(deps): bump eslint-plugin-react from 7.31.11 to 7.32.2 #1178
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
![dependabot[bot]](https://avatars.githubusercontent.com/in/29110?s=60&v=4){kind=small}
Bumps [eslint-plugin-react](https://github.com/jsx-eslint/eslint-plugin-react) from 7.31.11 to 7.32.2. - [Release notes](https://github.com/jsx-eslint/eslint-plugin-react/releases) - [Changelog](https://github.com/jsx-eslint/eslint-plugin-react/blob/master/CHANGELOG.md) - [Commits](jsx-eslint/eslint-plugin-react@v7.31.11...v7.32.2) --- updated-dependencies: - dependency-name: eslint-plugin-react dependency-type: direct:production update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] <support@github.com>
dependabot
bot
added
dependencies
Diff between eslint-plugin-react 7.31.11 and 7.32.2diff --git a/lib/rules/destructuring-assignment.js b/lib/rules/destructuring-assignment.js
index v7.31.11..v7.32.2 100644
--- a/lib/rules/destructuring-assignment.js
+++ b/lib/rules/destructuring-assignment.js
@@ -9,4 +9,5 @@
const isAssignmentLHS = require('../util/ast').isAssignmentLHS;
const report = require('../util/report');
+const testReactVersion = require('../util/version').testReactVersion;
const DEFAULT_OPTION = 'always';
@@ -95,4 +96,6 @@
const sfcParams = createSFCParams();
+ // set to save renamed var of useContext
+ const contextSet = new Set();
/**
* @param {ASTNode} node We expect either an ArrowFunctionExpression,
@@ -129,5 +132,5 @@
const propsName = sfcParams.propsName();
const contextName = sfcParams.contextName();
- // props.aProp || context.aProp
+ // props.aProp
const isPropUsed = (
(propsName && node.object.name === propsName)
@@ -135,5 +138,5 @@
)
&& !isAssignmentLHS(node);
- if (isPropUsed && configuration === 'always') {
+ if (isPropUsed && configuration === 'always' && !node.optional) {
report(context, messages.useDestructAssignment, 'useDestructAssignment', {
node,
@@ -143,4 +146,19 @@
});
}
+
+ // const foo = useContext(aContext);
+ // foo.aProp
+ const isContextUsed = contextSet.has(node.object.name) && !isAssignmentLHS(node);
+ const optional = node.optional
+ // the below is for the old typescript-eslint parser
+ || context.getSourceCode().getText(node).slice(node.object.range[1] - node.range[0], node.object.range[1] - node.range[0] + 1) === '?';
+ if (isContextUsed && configuration === 'always' && !optional) {
+ report(context, messages.useDestructAssignment, 'useDestructAssignment', {
+ node,
+ data: {
+ type: node.object.name,
+ },
+ });
+ }
}
@@ -177,6 +195,7 @@
}
+ const hasHooks = testReactVersion(context, '>= 16.9');
+
return {
-
FunctionDeclaration: handleStatelessComponent,
@@ -213,6 +232,11 @@
const destructuring = (node.init && node.id && node.id.type === 'ObjectPattern');
+ const identifier = (node.init && node.id && node.id.type === 'Identifier');
// let {foo} = props;
- const destructuringSFC = destructuring && (node.init.name === 'props' || node.init.name === 'context');
+ const destructuringSFC = destructuring && node.init.name === 'props';
+ // let {foo} = useContext(aContext);
+ const destructuringUseContext = hasHooks && destructuring && node.init.callee && node.init.callee.name === 'useContext';
+ // let foo = useContext(aContext);
+ const assignUseContext = hasHooks && identifier && node.init.callee && node.init.callee.name === 'useContext';
// let {foo} = this.props;
const destructuringClass = destructuring && node.init.object && node.init.object.type === 'ThisExpression' && (
@@ -220,4 +244,17 @@
);
+ if (SFCComponent && assignUseContext) {
+ contextSet.add(node.id.name);
+ }
+
+ if (SFCComponent && destructuringUseContext && configuration === 'never') {
+ report(context, messages.noDestructAssignment, 'noDestructAssignment', {
+ node,
+ data: {
+ type: node.init.callee.name,
+ },
+ });
+ }
+
if (SFCComponent && destructuringSFC && configuration === 'never') {
report(context, messages.noDestructAssignment, 'noDestructAssignment', {
diff --git a/lib/rules/forbid-component-props.js b/lib/rules/forbid-component-props.js
index v7.31.11..v7.32.2 100644
--- a/lib/rules/forbid-component-props.js
+++ b/lib/rules/forbid-component-props.js
@@ -40,5 +40,5 @@
type: 'array',
items: {
- oneOf: [{
+ anyOf: [{
type: 'string',
}, {
diff --git a/lib/rules/forbid-dom-props.js b/lib/rules/forbid-dom-props.js
index v7.31.11..v7.32.2 100644
--- a/lib/rules/forbid-dom-props.js
+++ b/lib/rules/forbid-dom-props.js
@@ -55,5 +55,5 @@
type: 'array',
items: {
- oneOf: [{
+ anyOf: [{
type: 'string',
}, {
diff --git a/lib/rules/function-component-definition.js b/lib/rules/function-component-definition.js
index v7.31.11..v7.32.2 100644
--- a/lib/rules/function-component-definition.js
+++ b/lib/rules/function-component-definition.js
@@ -133,5 +133,5 @@
properties: {
namedComponents: {
- oneOf: [
+ anyOf: [
{
enum: [
@@ -155,5 +155,5 @@
},
unnamedComponents: {
- oneOf: [
+ anyOf: [
{ enum: ['arrow-function', 'function-expression'] },
{
diff --git a/lib/rules/hook-use-state.js b/lib/rules/hook-use-state.js
index v7.31.11..v7.32.2 100644
--- a/lib/rules/hook-use-state.js
+++ b/lib/rules/hook-use-state.js
@@ -9,4 +9,5 @@
const docsUrl = require('../util/docsUrl');
const report = require('../util/report');
+const getMessageData = require('../util/message');
// ------------------------------------------------------------------------------
@@ -14,6 +15,13 @@
// ------------------------------------------------------------------------------
+function isNodeDestructuring(node) {
+ return node && (node.type === 'ArrayPattern' || node.type === 'ObjectPattern');
+}
+
const messages = {
useStateErrorMessage: 'useState call is not destructured into value + setter pair',
+ useStateErrorMessageOrAddOption: 'useState call is not destructured into value + setter pair (you can allow destructuring by enabling "allowDestructuredState" option)',
+ suggestPair: 'Destructure useState call into value + setter pair',
+ suggestMemo: 'Replace useState call with useMemo',
};
@@ -27,134 +35,169 @@
},
messages,
- schema: [],
+ schema: [{
+ type: 'object',
+ properties: {
+ allowDestructuredState: {
+ default: false,
+ type: 'boolean',
+ },
+ },
+ additionalProperties: false,
+ }],
type: 'suggestion',
hasSuggestions: true,
},
- create: Components.detect((context, components, util) => ({
- CallExpression(node) {
- const isImmediateReturn = node.parent
- && node.parent.type === 'ReturnStatement';
+ create: Components.detect((context, components, util) => {
+ const configuration = context.options[0] || {};
+ const allowDestructuredState = configuration.allowDestructuredState || false;
- if (isImmediateReturn || !util.isReactHookCall(node, ['useState'])) {
- return;
- }
+ return {
+ CallExpression(node) {
+ const isImmediateReturn = node.parent
+ && node.parent.type === 'ReturnStatement';
- const isDestructuringDeclarator = node.parent
- && node.parent.type === 'VariableDeclarator'
- && node.parent.id.type === 'ArrayPattern';
+ if (isImmediateReturn || !util.isReactHookCall(node, ['useState'])) {
+ return;
+ }
- if (!isDestructuringDeclarator) {
- report(
- context,
- messages.useStateErrorMessage,
- 'useStateErrorMessage',
- { node }
- );
- return;
- }
+ const isDestructuringDeclarator = node.parent
+ && node.parent.type === 'VariableDeclarator'
+ && node.parent.id.type === 'ArrayPattern';
- const variableNodes = node.parent.id.elements;
- const valueVariable = variableNodes[0];
- const setterVariable = variableNodes[1];
+ if (!isDestructuringDeclarator) {
+ report(
+ context,
+ messages.useStateErrorMessage,
+ 'useStateErrorMessage',
+ {
+ node,
+ suggest: false,
+ }
+ );
+ return;
+ }
- const valueVariableName = valueVariable
- ? valueVariable.name
- : undefined;
+ const variableNodes = node.parent.id.elements;
+ const valueVariable = variableNodes[0];
+ const setterVariable = variableNodes[1];
+ const isOnlyValueDestructuring = isNodeDestructuring(valueVariable) && !isNodeDestructuring(setterVariable);
- const setterVariableName = setterVariable
- ? setterVariable.name
- : undefined;
+ if (allowDestructuredState && isOnlyValueDestructuring) {
+ return;
+ }
- const caseCandidateMatch = valueVariableName ? valueVariableName.match(/(^[a-z]+)(.*)/) : undefined;
- const upperCaseCandidatePrefix = caseCandidateMatch ? caseCandidateMatch[1] : undefined;
- const caseCandidateSuffix = caseCandidateMatch ? caseCandidateMatch[2] : undefined;
- const expectedSetterVariableNames = upperCaseCandidatePrefix ? [
- `set${upperCaseCandidatePrefix.charAt(0).toUpperCase()}${upperCaseCandidatePrefix.slice(1)}${caseCandidateSuffix}`,
- `set${upperCaseCandidatePrefix.toUpperCase()}${caseCandidateSuffix}`,
- ] : [];
+ const valueVariableName = valueVariable
+ ? valueVariable.name
+ : undefined;
- const isSymmetricGetterSetterPair = valueVariable
- && setterVariable
- && expectedSetterVariableNames.indexOf(setterVariableName) !== -1
- && variableNodes.length === 2;
+ const setterVariableName = setterVariable
+ ? setterVariable.name
+ : undefined;
- if (!isSymmetricGetterSetterPair) {
- const suggestions = [
- {
- desc: 'Destructure useState call into value + setter pair',
- fix: (fixer) => {
- if (expectedSetterVariableNames.length === 0) {
- return;
+ const caseCandidateMatch = valueVariableName ? valueVariableName.match(/(^[a-z]+)(.*)/) : undefined;
+ const upperCaseCandidatePrefix = caseCandidateMatch ? caseCandidateMatch[1] : undefined;
+ const caseCandidateSuffix = caseCandidateMatch ? caseCandidateMatch[2] : undefined;
+ const expectedSetterVariableNames = upperCaseCandidatePrefix ? [
+ `set${upperCaseCandidatePrefix.charAt(0).toUpperCase()}${upperCaseCandidatePrefix.slice(1)}${caseCandidateSuffix}`,
+ `set${upperCaseCandidatePrefix.toUpperCase()}${caseCandidateSuffix}`,
+ ] : [];
+
+ const isSymmetricGetterSetterPair = valueVariable
+ && setterVariable
+ && expectedSetterVariableNames.indexOf(setterVariableName) !== -1
+ && variableNodes.length === 2;
+
+ if (!isSymmetricGetterSetterPair) {
+ const suggestions = [
+ Object.assign(
+ getMessageData('suggestPair', messages.suggestPair),
+ {
+ fix(fixer) {
+ if (expectedSetterVariableNames.length > 0) {
+ return fixer.replaceTextRange(
+ node.parent.id.range,
+ `[${valueVariableName}, ${expectedSetterVariableNames[0]}]`
+ );
+ }
+ },
}
+ ),
+ ];
- const fix = fixer.replaceTextRange(
- node.parent.id.range,
- `[${valueVariableName}, ${expectedSetterVariableNames[0]}]`
- );
+ const defaultReactImports = components.getDefaultReactImports();
+ const defaultReactImportSpecifier = defaultReactImports
+ ? defaultReactImports[0]
+ : undefined;
- return fix;
- },
- },
- ];
+ const defaultReactImportName = defaultReactImportSpecifier
+ ? defaultReactImportSpecifier.local.name
+ : undefined;
- const defaultReactImports = components.getDefaultReactImports();
- const defaultReactImportSpecifier = defaultReactImports
- ? defaultReactImports[0]
- : undefined;
+ const namedReactImports = components.getNamedReactImports();
+ const useStateReactImportSpecifier = namedReactImports
+ ? namedReactImports.find((specifier) => specifier.imported.name === 'useState')
+ : undefined;
- const defaultReactImportName = defaultReactImportSpecifier
- ? defaultReactImportSpecifier.local.name
- : undefined;
+ const isSingleGetter = valueVariable && variableNodes.length === 1;
+ const isUseStateCalledWithSingleArgument = node.arguments.length === 1;
+ if (isSingleGetter && isUseStateCalledWithSingleArgument) {
+ const useMemoReactImportSpecifier = namedReactImports
+ && namedReactImports.find((specifier) => specifier.imported.name === 'useMemo');
- const namedReactImports = components.getNamedReactImports();
- const useStateReactImportSpecifier = namedReactImports
- ? namedReactImports.find((specifier) => specifier.imported.name === 'useState')
- : undefined;
+ let useMemoCode;
+ if (useMemoReactImportSpecifier) {
+ useMemoCode = useMemoReactImportSpecifier.local.name;
+ } else if (defaultReactImportName) {
+ useMemoCode = `${defaultReactImportName}.useMemo`;
+ } else {
+ useMemoCode = 'useMemo';
+ }
- const isSingleGetter = valueVariable && variableNodes.length === 1;
- const isUseStateCalledWithSingleArgument = node.arguments.length === 1;
- if (isSingleGetter && isUseStateCalledWithSingleArgument) {
- const useMemoReactImportSpecifier = namedReactImports
- && namedReactImports.find((specifier) => specifier.imported.name === 'useMemo');
+ suggestions.unshift(Object.assign(
+ getMessageData('suggestMemo', messages.suggestMemo),
+ {
+ fix: (fixer) => [
+ // Add useMemo import, if necessary
+ useStateReactImportSpecifier
+ && (!useMemoReactImportSpecifier || defaultReactImportName)
+ && fixer.insertTextAfter(useStateReactImportSpecifier, ', useMemo'),
+ // Convert single-value destructure to simple assignment
+ fixer.replaceTextRange(node.parent.id.range, valueVariableName),
+ // Convert useState call to useMemo + arrow function + dependency array
+ fixer.replaceTextRange(
+ node.range,
+ `${useMemoCode}(() => ${context.getSourceCode().getText(node.arguments[0])}, [])`
+ ),
+ ].filter(Boolean),
+ }
+ ));
+ }
- let useMemoCode;
- if (useMemoReactImportSpecifier) {
- useMemoCode = useMemoReactImportSpecifier.local.name;
- } else if (defaultReactImportName) {
- useMemoCode = `${defaultReactImportName}.useMemo`;
- } else {
- useMemoCode = 'useMemo';
+ if (isOnlyValueDestructuring) {
+ report(
+ context,
+ messages.useStateErrorMessageOrAddOption,
+ 'useStateErrorMessageOrAddOption',
+ {
+ node: node.parent.id,
+ suggest: false,
+ }
+ );
+ return;
}
- suggestions.unshift({
- desc: 'Replace useState call with useMemo',
- fix: (fixer) => [
- // Add useMemo import, if necessary
- useStateReactImportSpecifier
- && (!useMemoReactImportSpecifier || defaultReactImportName)
- && fixer.insertTextAfter(useStateReactImportSpecifier, ', useMemo'),
- // Convert single-value destructure to simple assignment
- fixer.replaceTextRange(node.parent.id.range, valueVariableName),
- // Convert useState call to useMemo + arrow function + dependency array
- fixer.replaceTextRange(
- node.range,
- `${useMemoCode}(() => ${context.getSourceCode().getText(node.arguments[0])}, [])`
- ),
- ].filter(Boolean),
- });
+ report(
+ context,
+ messages.useStateErrorMessage,
+ 'useStateErrorMessage',
+ {
+ node: node.parent.id,
+ suggest: suggestions,
+ }
+ );
}
-
- report(
- context,
- messages.useStateErrorMessage,
- 'useStateErrorMessage',
- {
- node: node.parent.id,
- suggest: suggestions,
- }
- );
- }
- },
- })),
+ },
+ };
+ }),
};
diff --git a/index.js b/index.js
index v7.31.11..v7.32.2 100644
--- a/index.js
+++ b/index.js
@@ -1,187 +1,31 @@
'use strict';
-const fromEntries = require('object.fromentries');
-const entries = require('object.entries');
+const configAll = require('./configs/all');
+const configRecommended = require('./configs/recommended');
+const configRuntime = require('./configs/jsx-runtime');
-/* eslint-disable global-require */
-const allRules = {
- 'boolean-prop-naming': require('./lib/rules/boolean-prop-naming'),
- 'button-has-type': require('./lib/rules/button-has-type'),
- 'default-props-match-prop-types': require('./lib/rules/default-props-match-prop-types'),
- 'destructuring-assignment': require('./lib/rules/destructuring-assignment'),
- 'display-name': require('./lib/rules/display-name'),
- 'forbid-component-props': require('./lib/rules/forbid-component-props'),
- 'forbid-dom-props': require('./lib/rules/forbid-dom-props'),
- 'forbid-elements': require('./lib/rules/forbid-elements'),
- 'forbid-foreign-prop-types': require('./lib/rules/forbid-foreign-prop-types'),
- 'forbid-prop-types': require('./lib/rules/forbid-prop-types'),
- 'function-component-definition': require('./lib/rules/function-component-definition'),
- 'hook-use-state': require('./lib/rules/hook-use-state'),
- 'iframe-missing-sandbox': require('./lib/rules/iframe-missing-sandbox'),
- 'jsx-boolean-value': require('./lib/rules/jsx-boolean-value'),
- 'jsx-child-element-spacing': require('./lib/rules/jsx-child-element-spacing'),
- 'jsx-closing-bracket-location': require('./lib/rules/jsx-closing-bracket-location'),
- 'jsx-closing-tag-location': require('./lib/rules/jsx-closing-tag-location'),
- 'jsx-curly-spacing': require('./lib/rules/jsx-curly-spacing'),
- 'jsx-curly-newline': require('./lib/rules/jsx-curly-newline'),
- 'jsx-equals-spacing': require('./lib/rules/jsx-equals-spacing'),
- 'jsx-filename-extension': require('./lib/rules/jsx-filename-extension'),
- 'jsx-first-prop-new-line': require('./lib/rules/jsx-first-prop-new-line'),
- 'jsx-handler-names': require('./lib/rules/jsx-handler-names'),
- 'jsx-indent': require('./lib/rules/jsx-indent'),
- 'jsx-indent-props': require('./lib/rules/jsx-indent-props'),
- 'jsx-key': require('./lib/rules/jsx-key'),
- 'jsx-max-depth': require('./lib/rules/jsx-max-depth'),
- 'jsx-max-props-per-line': require('./lib/rules/jsx-max-props-per-line'),
- 'jsx-newline': require('./lib/rules/jsx-newline'),
- 'jsx-no-bind': require('./lib/rules/jsx-no-bind'),
- 'jsx-no-comment-textnodes': require('./lib/rules/jsx-no-comment-textnodes'),
- 'jsx-no-constructed-context-values': require('./lib/rules/jsx-no-constructed-context-values'),
- 'jsx-no-duplicate-props': require('./lib/rules/jsx-no-duplicate-props'),
- 'jsx-no-leaked-render': require('./lib/rules/jsx-no-leaked-render'),
- 'jsx-no-literals': require('./lib/rules/jsx-no-literals'),
- 'jsx-no-script-url': require('./lib/rules/jsx-no-script-url'),
- 'jsx-no-target-blank': require('./lib/rules/jsx-no-target-blank'),
- 'jsx-no-useless-fragment': require('./lib/rules/jsx-no-useless-fragment'),
- 'jsx-one-expression-per-line': require('./lib/rules/jsx-one-expression-per-line'),
- 'jsx-no-undef': require('./lib/rules/jsx-no-undef'),
- 'jsx-curly-brace-presence': require('./lib/rules/jsx-curly-brace-presence'),
- 'jsx-pascal-case': require('./lib/rules/jsx-pascal-case'),
- 'jsx-fragments': require('./lib/rules/jsx-fragments'),
- 'jsx-props-no-multi-spaces': require('./lib/rules/jsx-props-no-multi-spaces'),
- 'jsx-props-no-spreading': require('./lib/rules/jsx-props-no-spreading'),
- 'jsx-sort-default-props': require('./lib/rules/jsx-sort-default-props'),
- 'jsx-sort-props': require('./lib/rules/jsx-sort-props'),
- 'jsx-space-before-closing': require('./lib/rules/jsx-space-before-closing'),
- 'jsx-tag-spacing': require('./lib/rules/jsx-tag-spacing'),
- 'jsx-uses-react': require('./lib/rules/jsx-uses-react'),
- 'jsx-uses-vars': require('./lib/rules/jsx-uses-vars'),
- 'jsx-wrap-multilines': require('./lib/rules/jsx-wrap-multilines'),
- 'no-invalid-html-attribute': require('./lib/rules/no-invalid-html-attribute'),
- 'no-access-state-in-setstate': require('./lib/rules/no-access-state-in-setstate'),
- 'no-adjacent-inline-elements': require('./lib/rules/no-adjacent-inline-elements'),
- 'no-array-index-key': require('./lib/rules/no-array-index-key'),
- 'no-arrow-function-lifecycle': require('./lib/rules/no-arrow-function-lifecycle'),
- 'no-children-prop': require('./lib/rules/no-children-prop'),
- 'no-danger': require('./lib/rules/no-danger'),
- 'no-danger-with-children': require('./lib/rules/no-danger-with-children'),
- 'no-deprecated': require('./lib/rules/no-deprecated'),
- 'no-did-mount-set-state': require('./lib/rules/no-did-mount-set-state'),
- 'no-did-update-set-state': require('./lib/rules/no-did-update-set-state'),
- 'no-direct-mutation-state': require('./lib/rules/no-direct-mutation-state'),
- 'no-find-dom-node': require('./lib/rules/no-find-dom-node'),
- 'no-is-mounted': require('./lib/rules/no-is-mounted'),
- 'no-multi-comp': require('./lib/rules/no-multi-comp'),
- 'no-namespace': require('./lib/rules/no-namespace'),
- 'no-set-state': require('./lib/rules/no-set-state'),
- 'no-string-refs': require('./lib/rules/no-string-refs'),
- 'no-redundant-should-component-update': require('./lib/rules/no-redundant-should-component-update'),
- 'no-render-return-value': require('./lib/rules/no-render-return-value'),
- 'no-this-in-sfc': require('./lib/rules/no-this-in-sfc'),
- 'no-typos': require('./lib/rules/no-typos'),
- 'no-unescaped-entities': require('./lib/rules/no-unescaped-entities'),
- 'no-unknown-property': require('./lib/rules/no-unknown-property'),
- 'no-unsafe': require('./lib/rules/no-unsafe'),
- 'no-unstable-nested-components': require('./lib/rules/no-unstable-nested-components'),
- 'no-unused-class-component-methods': require('./lib/rules/no-unused-class-component-methods'),
- 'no-unused-prop-types': require('./lib/rules/no-unused-prop-types'),
- 'no-unused-state': require('./lib/rules/no-unused-state'),
- 'no-will-update-set-state': require('./lib/rules/no-will-update-set-state'),
- 'prefer-es6-class': require('./lib/rules/prefer-es6-class'),
- 'prefer-exact-props': require('./lib/rules/prefer-exact-props'),
- 'prefer-read-only-props': require('./lib/rules/prefer-read-only-props'),
- 'prefer-stateless-function': require('./lib/rules/prefer-stateless-function'),
- 'prop-types': require('./lib/rules/prop-types'),
- 'react-in-jsx-scope': require('./lib/rules/react-in-jsx-scope'),
- 'require-default-props': require('./lib/rules/require-default-props'),
- 'require-optimization': require('./lib/rules/require-optimization'),
- 'require-render-return': require('./lib/rules/require-render-return'),
- 'self-closing-comp': require('./lib/rules/self-closing-comp'),
- 'sort-comp': require('./lib/rules/sort-comp'),
- 'sort-prop-types': require('./lib/rules/sort-prop-types'),
- 'state-in-constructor': require('./lib/rules/state-in-constructor'),
- 'static-property-placement': require('./lib/rules/static-property-placement'),
- 'style-prop-object': require('./lib/rules/style-prop-object'),
- 'void-dom-elements-no-children': require('./lib/rules/void-dom-elements-no-children'),
-};
-/* eslint-enable */
+const allRules = require('./lib/rules');
-function filterRules(rules, predicate) {
- return fromEntries(entries(rules).filter((entry) => predicate(entry[1])));
-}
+// for legacy config system
+const plugins = [
+ 'react',
+];
-function configureAsError(rules) {
- return fromEntries(Object.keys(rules).map((key) => [`react/${key}`, 2]));
-}
-
-const activeRules = filterRules(allRules, (rule) => !rule.meta.deprecated);
-const activeRulesConfig = configureAsError(activeRules);
-
-const deprecatedRules = filterRules(allRules, (rule) => rule.meta.deprecated);
-
module.exports = {
- deprecatedRules,
+ deprecatedRules: configAll.plugins.react.deprecatedRules,
rules: allRules,
configs: {
- recommended: {
- plugins: [
- 'react',
- ],
- parserOptions: {
- ecmaFeatures: {
- jsx: true,
- },
- },
- rules: {
- 'react/display-name': 2,
- 'react/jsx-key': 2,
- 'react/jsx-no-comment-textnodes': 2,
- 'react/jsx-no-duplicate-props': 2,
- 'react/jsx-no-target-blank': 2,
- 'react/jsx-no-undef': 2,
- 'react/jsx-uses-react': 2,
- 'react/jsx-uses-vars': 2,
- 'react/no-children-prop': 2,
- 'react/no-danger-with-children': 2,
- 'react/no-deprecated': 2,
- 'react/no-direct-mutation-state': 2,
- 'react/no-find-dom-node': 2,
- 'react/no-is-mounted': 2,
- 'react/no-render-return-value': 2,
- 'react/no-string-refs': 2,
- 'react/no-unescaped-entities': 2,
- 'react/no-unknown-property': 2,
- 'react/no-unsafe': 0,
- 'react/prop-types': 2,
- 'react/react-in-jsx-scope': 2,
- 'react/require-render-return': 2,
- },
- },
- all: {
- plugins: [
- 'react',
- ],
- parserOptions: {
- ecmaFeatures: {
- jsx: true,
- },
- },
- rules: activeRulesConfig,
- },
- 'jsx-runtime': {
- plugins: [
- 'react',
- ],
- parserOptions: {
- ecmaFeatures: {
- jsx: true,
- },
- jsxPragma: null, // for @typescript/eslint-parser
- },
- rules: {
- 'react/react-in-jsx-scope': 0,
- 'react/jsx-uses-react': 0,
- },
- },
+ recommended: Object.assign({}, configRecommended, {
+ parserOptions: configRecommended.languageOptions.parserOptions,
+ plugins,
+ }),
+ all: Object.assign({}, configAll, {
+ parserOptions: configAll.languageOptions.parserOptions,
+ plugins,
+ }),
+ 'jsx-runtime': Object.assign({}, configRuntime, {
+ parserOptions: configRuntime.languageOptions.parserOptions,
+ plugins,
+ }),
},
};
diff --git a/lib/rules/jsx-closing-bracket-location.js b/lib/rules/jsx-closing-bracket-location.js
index v7.31.11..v7.32.2 100644
--- a/lib/rules/jsx-closing-bracket-location.js
+++ b/lib/rules/jsx-closing-bracket-location.js
@@ -31,5 +31,5 @@
schema: [{
- oneOf: [
+ anyOf: [
{
enum: ['after-props', 'props-aligned', 'tag-aligned', 'line-aligned'],
diff --git a/lib/rules/jsx-curly-brace-presence.js b/lib/rules/jsx-curly-brace-presence.js
index v7.31.11..v7.32.2 100755
--- a/lib/rules/jsx-curly-brace-presence.js
+++ b/lib/rules/jsx-curly-brace-presence.js
@@ -51,5 +51,5 @@
schema: [
{
- oneOf: [
+ anyOf: [
{
type: 'object',
diff --git a/lib/rules/jsx-curly-newline.js b/lib/rules/jsx-curly-newline.js
index v7.31.11..v7.32.2 100644
--- a/lib/rules/jsx-curly-newline.js
+++ b/lib/rules/jsx-curly-newline.js
@@ -57,5 +57,5 @@
schema: [
{
- oneOf: [
+ anyOf: [
{
enum: ['consistent', 'never'],
diff --git a/lib/rules/jsx-curly-spacing.js b/lib/rules/jsx-curly-spacing.js
index v7.31.11..v7.32.2 100644
--- a/lib/rules/jsx-curly-spacing.js
+++ b/lib/rules/jsx-curly-spacing.js
@@ -69,5 +69,5 @@
},
basicConfigOrBoolean: {
- oneOf: [{
+ anyOf: [{
$ref: '#/definitions/basicConfig',
}, {
@@ -78,5 +78,5 @@
type: 'array',
items: [{
- oneOf: [{
+ anyOf: [{
allOf: [{
$ref: '#/definitions/basicConfig',
diff --git a/lib/rules/jsx-indent-props.js b/lib/rules/jsx-indent-props.js
index v7.31.11..v7.32.2 100644
--- a/lib/rules/jsx-indent-props.js
+++ b/lib/rules/jsx-indent-props.js
@@ -56,5 +56,5 @@
schema: [{
- oneOf: [{
+ anyOf: [{
enum: ['tab', 'first'],
}, {
@@ -64,5 +64,5 @@
properties: {
indentMode: {
- oneOf: [{
+ anyOf: [{
enum: ['tab', 'first'],
}, {
diff --git a/lib/rules/jsx-indent.js b/lib/rules/jsx-indent.js
index v7.31.11..v7.32.2 100644
--- a/lib/rules/jsx-indent.js
+++ b/lib/rules/jsx-indent.js
@@ -59,5 +59,5 @@
schema: [{
- oneOf: [{
+ anyOf: [{
enum: ['tab'],
}, {
diff --git a/lib/rules/jsx-newline.js b/lib/rules/jsx-newline.js
index v7.31.11..v7.32.2 100644
--- a/lib/rules/jsx-newline.js
+++ b/lib/rules/jsx-newline.js
@@ -73,4 +73,13 @@
const sourceCode = context.getSourceCode();
+ function isBlockCommentInCurlyBraces(element) {
+ const elementRawValue = sourceCode.getText(element);
+ return /^\s*{\/\*/.test(elementRawValue);
+ }
+
+ function isNonBlockComment(element) {
+ return !isBlockCommentInCurlyBraces(element) && (element.type === 'JSXElement' || element.type === 'JSXExpressionContainer');
+ }
+
return {
'Program:exit'() {
@@ -94,5 +103,13 @@
const isWithoutNewLine = !/\n\s*\n/.test(firstAdjacentSibling.value);
- if (allowMultilines && (isMultilined(element) || isMultilined(secondAdjacentSibling))) {
+ if (isBlockCommentInCurlyBraces(element)) return;
+
+ if (
+ allowMultilines
+ && (
+ isMultilined(element)
+ || isMultilined(elements.slice(index + 2).find(isNonBlockComment))
+ )
+ ) {
if (!isWithoutNewLine) return;
@@ -116,4 +133,5 @@
if (isWithoutNewLine === prevent) return;
+
const messageId = prevent
? 'prevent'
diff --git a/lib/rules/jsx-no-constructed-context-values.js b/lib/rules/jsx-no-constructed-context-values.js
index v7.31.11..v7.32.2 100644
--- a/lib/rules/jsx-no-constructed-context-values.js
+++ b/lib/rules/jsx-no-constructed-context-values.js
@@ -139,4 +139,5 @@
},
messages,
+ schema: {},
},
diff --git a/lib/rules/jsx-no-leaked-render.js b/lib/rules/jsx-no-leaked-render.js
index v7.31.11..v7.32.2 100644
--- a/lib/rules/jsx-no-leaked-render.js
+++ b/lib/rules/jsx-no-leaked-render.js
@@ -8,4 +8,5 @@
const docsUrl = require('../util/docsUrl');
const report = require('../util/report');
+const testReactVersion = require('../util/version').testReactVersion;
const isParenthesized = require('../util/ast').isParenthesized;
@@ -61,7 +62,25 @@
nodeText = `(${nodeText})`;
}
+ if (node.parent && node.parent.type === 'ConditionalExpression' && node.parent.consequent.value === false) {
+ return `${getIsCoerceValidNestedLogicalExpression(node) ? '' : '!'}${nodeText}`;
+ }
return `${getIsCoerceValidNestedLogicalExpression(node) ? '' : '!!'}${nodeText}`;
}).join(' && ');
+ if (rightNode.parent && rightNode.parent.type === 'ConditionalExpression' && rightNode.parent.consequent.value === false) {
+ const consequentVal = rightNode.parent.consequent.raw || rightNode.parent.consequent.name;
+ const alternateVal = rightNode.parent.alternate.raw || rightNode.parent.alternate.name;
+ if (rightNode.parent.test && rightNode.parent.test.type === 'LogicalExpression') {
+ return fixer.replaceText(reportedNode, `${newText} ? ${consequentVal} : ${alternateVal}`);
+ }
+ return fixer.replaceText(reportedNode, `${newText} && ${alternateVal}`);
+ }
+
+ if (rightNode.type === 'ConditionalExpression') {
+ return fixer.replaceText(reportedNode, `${newText} && (${rightSideText})`);
+ }
+ if (rightNode.type === 'Literal') {
+ return null;
+ }
return fixer.replaceText(reportedNode, `${newText} && ${rightSideText}`);
}
@@ -131,4 +150,7 @@
}
+ if (testReactVersion(context, '>= 18') && leftSide.type === 'Literal' && leftSide.value === '') {
+ return;
+ }
report(context, messages.noPotentialLeakedRender, 'noPotentialLeakedRender', {
node,
diff --git a/lib/rules/jsx-no-useless-fragment.js b/lib/rules/jsx-no-useless-fragment.js
index v7.31.11..v7.32.2 100644
--- a/lib/rules/jsx-no-useless-fragment.js
+++ b/lib/rules/jsx-no-useless-fragment.js
@@ -95,4 +95,12 @@
},
messages,
+ schema: [{
+ type: 'object',
+ properties: {
+ allowExpressions: {
+ type: 'boolean',
+ },
+ },
+ }],
},
diff --git a/lib/rules/jsx-sort-default-props.js b/lib/rules/jsx-sort-default-props.js
index v7.31.11..v7.32.2 100644
--- a/lib/rules/jsx-sort-default-props.js
+++ b/lib/rules/jsx-sort-default-props.js
@@ -2,4 +2,5 @@
* @fileoverview Enforce default props alphabetical sorting
* @author Vladimir Kattsov
+ * @deprecated
*/
@@ -9,5 +10,8 @@
const docsUrl = require('../util/docsUrl');
const report = require('../util/report');
+const log = require('../util/log');
+let isWarnedForDeprecation = false;
+
// ------------------------------------------------------------------------------
// Rule Definition
@@ -20,4 +24,6 @@
module.exports = {
meta: {
+ deprecated: true,
+ replacedBy: ['sort-default-props'],
docs: {
description: 'Enforce defaultProps declarations alphabetical sorting',
@@ -169,4 +175,13 @@
checkNode(node.parent.right);
},
+
+ Program() {
+ if (isWarnedForDeprecation) {
+ return;
+ }
+
+ log('The react/jsx-sort-default-props rule is deprecated. It has been renamed to `react/sort-default-props`.');
+ isWarnedForDeprecation = true;
+ },
};
},
diff --git a/lib/rules/no-invalid-html-attribute.js b/lib/rules/no-invalid-html-attribute.js
index v7.31.11..v7.32.2 100644
--- a/lib/rules/no-invalid-html-attribute.js
+++ b/lib/rules/no-invalid-html-attribute.js
@@ -9,4 +9,5 @@
const docsUrl = require('../util/docsUrl');
const report = require('../util/report');
+const getMessageData = require('../util/message');
// ------------------------------------------------------------------------------
@@ -233,4 +234,9 @@
onlyStrings: '“{{attributeName}}” attribute only supports strings.',
spaceDelimited: '”{{attributeName}}“ attribute values should be space delimited.',
+ suggestRemoveDefault: '"remove {{attributeName}}"',
+ suggestRemoveEmpty: '"remove empty attribute {{attributeName}}"',
+ suggestRemoveInvalid: '“remove invalid attribute {{reportingValue}}”',
+ suggestRemoveWhitespaces: 'remove whitespaces in “{{reportingValue}}”',
+ suggestRemoveNonString: 'remove non-string value in “{{reportingValue}}”',
};
@@ -255,7 +261,10 @@
node,
data: { attributeName },
- fix(fixer) {
- return fixer.remove(parentNode);
- },
+ suggest: [
+ Object.assign(
+ getMessageData('suggestRemoveNonString', messages.suggestRemoveNonString),
+ { fix(fixer) { return fixer.remove(parentNode); } }
+ ),
+ ],
});
return;
@@ -266,7 +275,10 @@
node,
data: { attributeName },
- fix(fixer) {
- return fixer.remove(parentNode);
- },
+ suggest: [
+ Object.assign(
+ getMessageData('suggestRemoveEmpty', messages.suggestRemoveEmpty),
+ { fix(fixer) { return fixer.remove(node.parent); } }
+ ),
+ ],
});
return;
@@ -277,14 +289,21 @@
const allowedTags = VALID_VALUES.get(attributeName).get(singlePart.value);
const reportingValue = singlePart.reportingValue;
+
+ const suggest = [
+ Object.assign(
+ getMessageData('suggestRemoveInvalid', messages.suggestRemoveInvalid),
+ { fix(fixer) { return fixer.removeRange(singlePart.range); } }
+ ),
+ ];
+
if (!allowedTags) {
+ const data = {
+ attributeName,
+ reportingValue,
+ };
report(context, messages.neverValid, 'neverValid', {
node,
- data: {
- attributeName,
- reportingValue,
- },
- fix(fixer) {
- return fixer.removeRange(singlePart.range);
- },
+ data,
+ suggest,
});
} else if (!allowedTags.has(parentNodeName)) {
@@ -296,7 +315,5 @@
elementName: parentNodeName,
},
- fix(fixer) {
- return fixer.removeRange(singlePart.range);
- },
+ suggest,
});
}
@@ -325,4 +342,5 @@
missingValue: Array.from(siblings).join(', '),
},
+ suggest: false,
});
}
@@ -338,7 +356,10 @@
node,
data: { attributeName },
- fix(fixer) {
- return fixer.removeRange(whitespacePart.range);
- },
+ suggest: [
+ Object.assign(
+ getMessageData('suggestRemoveWhitespaces', messages.suggestRemoveWhitespaces),
+ { fix(fixer) { return fixer.removeRange(whitespacePart.range); } }
+ ),
+ ],
});
} else if (whitespacePart.value !== '\u0020') {
@@ -346,7 +367,10 @@
node,
data: { attributeName },
- fix(fixer) {
- return fixer.replaceTextRange(whitespacePart.range, '\u0020');
- },
+ suggest: [
+ Object.assign(
+ getMessageData('suggestRemoveWhitespaces', messages.suggestRemoveWhitespaces),
+ { fix(fixer) { return fixer.replaceTextRange(whitespacePart.range, '\u0020'); } }
+ ),
+ ],
});
}
@@ -359,8 +383,4 @@
const attribute = node.name.name;
- function fix(fixer) {
- return fixer.remove(node);
- }
-
const parentNodeName = node.parent.name.name;
if (!COMPONENT_ATTRIBUTE_MAP.has(attribute) || !COMPONENT_ATTRIBUTE_MAP.get(attribute).has(parentNodeName)) {
@@ -375,14 +395,26 @@
tagNames,
},
- fix,
+ suggest: [
+ Object.assign(
+ getMessageData('suggestRemoveDefault', messages.suggestRemoveDefault),
+ { fix(fixer) { return fixer.remove(node); } }
+ ),
+ ],
});
return;
}
+ function fix(fixer) { return fixer.remove(node); }
+
if (!node.value) {
report(context, messages.emptyIsMeaningless, 'emptyIsMeaningless', {
node,
data: { attributeName: attribute },
- fix,
+ suggest: [
+ Object.assign(
+ getMessageData('suggestRemoveEmpty', messages.suggestRemoveEmpty),
+ { fix }
+ ),
+ ],
});
return;
@@ -405,14 +437,21 @@
node,
data: { attributeName: attribute },
- fix,
+ suggest: [
+ Object.assign(
+ getMessageData('suggestRemoveDefault', messages.suggestRemoveDefault),
+ { fix }
+ ),
+ ],
});
- return;
- }
-
- if (node.value.expression.type === 'Identifier' && node.value.expression.name === 'undefined') {
+ } else if (node.value.expression.type === 'Identifier' && node.value.expression.name === 'undefined') {
report(context, messages.onlyStrings, 'onlyStrings', {
node,
data: { attributeName: attribute },
- fix,
+ suggest: [
+ Object.assign(
+ getMessageData('suggestRemoveDefault', messages.suggestRemoveDefault),
+ { fix }
+ ),
+ ],
});
}
@@ -442,9 +481,12 @@
reportingValue: value.value,
},
+ suggest: [
+ Object.assign(
+ getMessageData('suggestRemoveInvalid', messages.suggestRemoveInvalid),
+ { fix(fixer) { return fixer.replaceText(value, value.raw.replace(value.value, '')); } }
+ ),
+ ],
});
- return;
- }
-
- if (!validTagSet.has(node.arguments[0].value)) {
+ } else if (!validTagSet.has(node.arguments[0].value)) {
report(context, messages.notValidFor, 'notValidFor', {
node: value,
@@ -454,4 +496,5 @@
elementName: node.arguments[0].value,
},
+ suggest: false,
});
}
@@ -494,4 +537,5 @@
tagNames,
},
+ suggest: false,
});
@@ -506,4 +550,5 @@
attributeName: attribute,
},
+ suggest: false,
});
@@ -532,5 +577,4 @@
module.exports = {
meta: {
- fixable: 'code',
docs: {
description: 'Disallow usage of invalid attributes',
@@ -546,4 +590,6 @@
},
}],
+ type: 'suggestion',
+ hasSuggestions: true, // eslint-disable-line eslint-plugin/require-meta-has-suggestions
},
diff --git a/lib/rules/no-unescaped-entities.js b/lib/rules/no-unescaped-entities.js
index v7.31.11..v7.32.2 100644
--- a/lib/rules/no-unescaped-entities.js
+++ b/lib/rules/no-unescaped-entities.js
@@ -53,5 +53,5 @@
type: 'array',
items: {
- oneOf: [{
+ anyOf: [{
type: 'string',
}, {
diff --git a/lib/rules/no-unknown-property.js b/lib/rules/no-unknown-property.js
index v7.31.11..v7.32.2 100644
--- a/lib/rules/no-unknown-property.js
+++ b/lib/rules/no-unknown-property.js
@@ -43,4 +43,5 @@
'g',
'line',
+ 'marker',
'mask',
'path',
@@ -545,5 +546,5 @@
const tagName = getTagName(node);
- if (tagName === 'fbt') { return; } // fbt nodes are bonkers, let's not go there
+ if (tagName === 'fbt' || tagName === 'fbs') { return; } // fbt/fbs nodes are bonkers, let's not go there
if (!isValidHTMLTagInJSX(node)) { return; }
diff --git a/lib/util/propTypesSort.js b/lib/util/propTypesSort.js
index v7.31.11..v7.32.2 100644
--- a/lib/util/propTypesSort.js
+++ b/lib/util/propTypesSort.js
@@ -119,7 +119,35 @@
* @returns {Object|*|{range, text}} the sort order of the two elements.
*/
+const commentnodeMap = new WeakMap(); // all nodes reference WeakMap for start and end range
function fixPropTypesSort(fixer, context, declarations, ignoreCase, requiredFirst, callbacksLast, sortShapeProp) {
function sortInSource(allNodes, source) {
const originalSource = source;
+ const sourceCode = context.getSourceCode();
+ for (let i = 0; i < allNodes.length; i++) {
+ const node = allNodes[i];
+ let commentAfter = [];
+ let commentBefore = [];
+ let newStart = 0;
+ let newEnd = 0;
+ try {
+ commentBefore = sourceCode.getCommentsBefore(node);
+ commentAfter = sourceCode.getCommentsAfter(node);
+ } catch (e) { /**/ }
+
+ if (commentAfter.length === 0 || commentBefore.length === 0) {
+ newStart = node.range[0];
+ newEnd = node.range[1];
+ }
+
+ const firstCommentBefore = commentBefore[0];
+ if (commentBefore.length >= 1) {
+ newStart = firstCommentBefore.range[0];
+ }
+ const lastCommentAfter = commentAfter[commentAfter.length - 1];
+ if (commentAfter.length >= 1) {
+ newEnd = lastCommentAfter.range[1];
+ }
+ commentnodeMap.set(node, { start: newStart, end: newEnd, hasComment: true });
+ }
const nodeGroups = allNodes.reduce((acc, curr) => {
if (curr.type === 'ExperimentalSpreadProperty' || curr.type === 'SpreadElement') {
@@ -139,5 +167,9 @@
source = nodes.reduceRight((acc, attr, index) => {
const sortedAttr = sortedAttributes[index];
- let sortedAttrText = context.getSourceCode().getText(sortedAttr);
+ const sourceCodeText = sourceCode.getText();
+ let sortedAttrText = sourceCodeText.substring(
+ commentnodeMap.get(sortedAttr).start,
+ commentnodeMap.get(sortedAttr).end
+ );
if (sortShapeProp && isShapeProp(sortedAttr.value)) {
const shape = getShapeProperties(sortedAttr.value);
@@ -150,5 +182,5 @@
}
}
- return `${acc.slice(0, attr.range[0])}${sortedAttrText}${acc.slice(attr.range[1])}`;
+ return `${acc.slice(0, commentnodeMap.get(attr).start)}${sortedAttrText}${acc.slice(commentnodeMap.get(attr).end)}`;
}, source);
});
@@ -158,6 +190,6 @@
const source = sortInSource(declarations, context.getSourceCode().getText());
- const rangeStart = declarations[0].range[0];
- const rangeEnd = declarations[declarations.length - 1].range[1];
+ const rangeStart = commentnodeMap.get(declarations[0]).start;
+ const rangeEnd = commentnodeMap.get(declarations[declarations.length - 1]).end;
return fixer.replaceTextRange([rangeStart, rangeEnd], source.slice(rangeStart, rangeEnd));
}
diff --git a/lib/util/report.js b/lib/util/report.js
index v7.31.11..v7.32.2 100644
--- a/lib/util/report.js
+++ b/lib/util/report.js
@@ -1,11 +1,10 @@
'use strict';
-const semver = require('semver');
-const eslintPkg = require('eslint/package.json');
+const getMessageData = require('./message');
module.exports = function report(context, message, messageId, data) {
context.report(
Object.assign(
- messageId && semver.satisfies(eslintPkg.version, '>= 4.15') ? { messageId } : { message },
+ getMessageData(messageId, message),
data
)
diff --git a/lib/rules/sort-prop-types.js b/lib/rules/sort-prop-types.js
index v7.31.11..v7.32.2 100644
--- a/lib/rules/sort-prop-types.js
+++ b/lib/rules/sort-prop-types.js
@@ -9,5 +9,5 @@
const docsUrl = require('../util/docsUrl');
const propWrapperUtil = require('../util/propWrapper');
-// const propTypesSortUtil = require('../util/propTypesSort');
+const propTypesSortUtil = require('../util/propTypesSort');
const report = require('../util/report');
@@ -30,5 +30,5 @@
url: docsUrl('sort-prop-types'),
},
- // fixable: 'code',
+ fixable: 'code',
messages,
@@ -107,15 +107,15 @@
}
- // function fix(fixer) {
- // return propTypesSortUtil.fixPropTypesSort(
- // fixer,
- // context,
- // declarations,
- // ignoreCase,
- // requiredFirst,
- // callbacksLast,
- // sortShapeProp
- // );
- // }
+ function fix(fixer) {
+ return propTypesSortUtil.fixPropTypesSort(
+ fixer,
+ context,
+ declarations,
+ ignoreCase,
+ requiredFirst,
+ callbacksLast,
+ sortShapeProp
+ );
+ }
const callbackPropsLastSeen = new WeakSet();
@@ -151,5 +151,5 @@
report(context, messages.requiredPropsFirst, 'requiredPropsFirst', {
node: curr,
- // fix
+ fix,
});
}
@@ -169,5 +169,5 @@
report(context, messages.callbackPropsLast, 'callbackPropsLast', {
node: prev,
- // fix
+ fix,
});
}
@@ -181,5 +181,5 @@
report(context, messages.propsNotSorted, 'propsNotSorted', {
node: curr,
- // fix
+ fix,
});
}
diff --git a/package.json b/package.json
index v7.31.11..v7.32.2 100644
--- a/package.json
+++ b/package.json
@@ -1,5 +1,5 @@
{
"name": "eslint-plugin-react",
- "version": "7.31.11",
+ "version": "7.32.2",
"author": "Yannick Croissant <yannick.croissant+npm@gmail.com>",
"description": "React specific linting rules for ESLint",
@@ -17,5 +17,5 @@
"type-check": "tsc",
"unit-test": "istanbul cover node_modules/mocha/bin/_mocha tests/lib/**/*.js tests/util/**/*.js tests/index.js",
- "update:eslint-docs": "eslint-doc-generator --ignore-config all --config-emoji recommended,💼 --url-configs \"https://github.com/jsx-eslint/eslint-plugin-react/#shareable-configs\""
+ "update:eslint-docs": "eslint-doc-generator"
},
"repository": {
@@ -38,10 +38,10 @@
"object.values": "^1.1.6",
"prop-types": "^15.8.1",
- "resolve": "^2.0.0-next.3",
+ "resolve": "^2.0.0-next.4",
"semver": "^6.3.0",
"string.prototype.matchall": "^4.0.8"
},
"devDependencies": {
- "@babel/core": "^7.20.2",
+ "@babel/core": "^7.20.12",
"@babel/eslint-parser": "^7.19.1",
"@babel/plugin-syntax-decorators": "^7.19.0",
@@ -53,17 +53,17 @@
"@types/node": "^4.9.5",
"@typescript-eslint/parser": "^2.34.0 || ^3.10.1 || ^4.0.0 || ^5.0.0",
- "aud": "^2.0.1",
+ "aud": "^2.0.2",
"babel-eslint": "^8 || ^9 || ^10.1.0",
"eslint": "^3 || ^4 || ^5 || ^6 || ^7 || ^8",
"eslint-config-airbnb-base": "^15.0.0",
- "eslint-doc-generator": "^0.15.0",
+ "eslint-doc-generator": "^1.4.2",
"eslint-plugin-eslint-plugin": "^2.3.0 || ^3.5.3 || ^4.0.1 || ^5.0.5",
"eslint-plugin-import": "^2.26.0",
"eslint-remote-tester": "^3.0.0",
- "eslint-remote-tester-repositories": "^0.0.7",
+ "eslint-remote-tester-repositories": "^1.0.0",
"eslint-scope": "^3.7.3",
"espree": "^3.5.4",
"istanbul": "^0.4.5",
- "ls-engines": "^0.7.0",
+ "ls-engines": "^0.8.0",
"markdownlint-cli": "^0.8.0 || ^0.32.2",
"mocha": "^5.2.0",
@@ -95,4 +95,5 @@
"*.md",
"*.config.js",
+ ".eslint-doc-generatorrc.js",
".eslintrc",
".editorconfig",
diff --git a/README.md b/README.md
index v7.31.11..v7.32.2 100644
--- a/README.md
+++ b/README.md
@@ -16,7 +16,7 @@
```
-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.
+It is also possible to install ESLint globally rather than locally (using `npm install -g eslint`). However, this is not recommended, and any plugins or shareable configs that you use must be installed locally in either case.
-## Configuration
+## Configuration (legacy: `.eslintrc*`)
Use [our preset](#recommended) to get reasonable defaults:
@@ -110,126 +110,8 @@
```
-## List of supported rules
+### Shareable configs
-<!-- begin auto-generated rules list -->
+#### Recommended
-💼 Enabled in the `recommended` [configuration](https://github.com/jsx-eslint/eslint-plugin-react/#shareable-configs).\
-🔧 Automatically fixable by the [`--fix` CLI option](https://eslint.org/docs/user-guide/command-line-interface#--fix).\
-💡 Manually fixable by [editor suggestions](https://eslint.org/docs/developer-guide/working-with-rules#providing-suggestions).\
-❌ Deprecated.
-
-| Name | Description | 💼 | 🔧 | 💡 | ❌ |
-| :--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | :------------------------------------------------------------------------------------------------------------------------------------------- | :- | :- | :- | :- |
-| [boolean-prop-naming](docs/rules/boolean-prop-naming.md) | Enforces consistent naming for boolean props | | | | |
-| [button-has-type](docs/rules/button-has-type.md) | Disallow usage of `button` elements without an explicit `type` attribute | | | | |
-| [default-props-match-prop-types](docs/rules/default-props-match-prop-types.md) | Enforce all defaultProps have a corresponding non-required PropType | | | | |
-| [destructuring-assignment](docs/rules/destructuring-assignment.md) | Enforce consistent usage of destructuring assignment of props, state, and context | | 🔧 | | |
-| [display-name](docs/rules/display-name.md) | Disallow missing displayName in a React component definition | 💼 | | | |
-| [forbid-component-props](docs/rules/forbid-component-props.md) | Disallow certain props on components | | | | |
-| [forbid-dom-props](docs/rules/forbid-dom-props.md) | Disallow certain props on DOM Nodes | | | | |
-| [forbid-elements](docs/rules/forbid-elements.md) | Disallow certain elements | | | | |
-| [forbid-foreign-prop-types](docs/rules/forbid-foreign-prop-types.md) | Disallow using another component's propTypes | | | | |
-| [forbid-prop-types](docs/rules/forbid-prop-types.md) | Disallow certain propTypes | | | | |
-| [function-component-definition](docs/rules/function-component-definition.md) | Enforce a specific function type for function components | | 🔧 | | |
-| [hook-use-state](docs/rules/hook-use-state.md) | Ensure destructuring and symmetric naming of useState hook value and setter variables | | | 💡 | |
-| [iframe-missing-sandbox](docs/rules/iframe-missing-sandbox.md) | Enforce sandbox attribute on iframe elements | | | | |
-| [jsx-boolean-value](docs/rules/jsx-boolean-value.md) | Enforce boolean attributes notation in JSX | | 🔧 | | |
-| [jsx-child-element-spacing](docs/rules/jsx-child-element-spacing.md) | Enforce or disallow spaces inside of curly braces in JSX attributes and expressions | | | | |
-| [jsx-closing-bracket-location](docs/rules/jsx-closing-bracket-location.md) | Enforce closing bracket location in JSX | | 🔧 | | |
-| [jsx-closing-tag-location](docs/rules/jsx-closing-tag-location.md) | Enforce closing tag location for multiline JSX | | 🔧 | | |
-| [jsx-curly-brace-presence](docs/rules/jsx-curly-brace-presence.md) | Disallow unnecessary JSX expressions when literals alone are sufficient or enforce JSX expressions on literals in JSX children or attributes | | 🔧 | | |
-| [jsx-curly-newline](docs/rules/jsx-curly-newline.md) | Enforce consistent linebreaks in curly braces in JSX attributes and expressions | | 🔧 | | |
-| [jsx-curly-spacing](docs/rules/jsx-curly-spacing.md) | Enforce or disallow spaces inside of curly braces in JSX attributes and expressions | | 🔧 | | |
-| [jsx-equals-spacing](docs/rules/jsx-equals-spacing.md) | Enforce or disallow spaces around equal signs in JSX attributes | | 🔧 | | |
-| [jsx-filename-extension](docs/rules/jsx-filename-extension.md) | Disallow file extensions that may contain JSX | | | | |
-| [jsx-first-prop-new-line](docs/rules/jsx-first-prop-new-line.md) | Enforce proper position of the first property in JSX | | 🔧 | | |
-| [jsx-fragments](docs/rules/jsx-fragments.md) | Enforce shorthand or standard form for React fragments | | 🔧 | | |
-| [jsx-handler-names](docs/rules/jsx-handler-names.md) | Enforce event handler naming conventions in JSX | | | | |
-| [jsx-indent](docs/rules/jsx-indent.md) | Enforce JSX indentation | | 🔧 | | |
-| [jsx-indent-props](docs/rules/jsx-indent-props.md) | Enforce props indentation in JSX | | 🔧 | | |
-| [jsx-key](docs/rules/jsx-key.md) | Disallow missing `key` props in iterators/collection literals | 💼 | | | |
-| [jsx-max-depth](docs/rules/jsx-max-depth.md) | Enforce JSX maximum depth | | | | |
-| [jsx-max-props-per-line](docs/rules/jsx-max-props-per-line.md) | Enforce maximum of props on a single line in JSX | | 🔧 | | |
-| [jsx-newline](docs/rules/jsx-newline.md) | Require or prevent a new line after jsx elements and expressions. | | 🔧 | | |
-| [jsx-no-bind](docs/rules/jsx-no-bind.md) | Disallow `.bind()` or arrow functions in JSX props | | | | |
-| [jsx-no-comment-textnodes](docs/rules/jsx-no-comment-textnodes.md) | Disallow comments from being inserted as text nodes | 💼 | | | |
-| [jsx-no-constructed-context-values](docs/rules/jsx-no-constructed-context-values.md) | Disallows JSX context provider values from taking values that will cause needless rerenders | | | | |
-| [jsx-no-duplicate-props](docs/rules/jsx-no-duplicate-props.md) | Disallow duplicate properties in JSX | 💼 | | | |
-| [jsx-no-leaked-render](docs/rules/jsx-no-leaked-render.md) | Disallow problematic leaked values from being rendered | | 🔧 | | |
-| [jsx-no-literals](docs/rules/jsx-no-literals.md) | Disallow usage of string literals in JSX | | | | |
-| [jsx-no-script-url](docs/rules/jsx-no-script-url.md) | Disallow usage of `javascript:` URLs | | | | |
-| [jsx-no-target-blank](docs/rules/jsx-no-target-blank.md) | Disallow `target="_blank"` attribute without `rel="noreferrer"` | 💼 | 🔧 | | |
-| [jsx-no-undef](docs/rules/jsx-no-undef.md) | Disallow undeclared variables in JSX | 💼 | | | |
-| [jsx-no-useless-fragment](docs/rules/jsx-no-useless-fragment.md) | Disallow unnecessary fragments | | 🔧 | | |
-| [jsx-one-expression-per-line](docs/rules/jsx-one-expression-per-line.md) | Require one JSX element per line | | 🔧 | | |
-| [jsx-pascal-case](docs/rules/jsx-pascal-case.md) | Enforce PascalCase for user-defined JSX components | | | | |
-| [jsx-props-no-multi-spaces](docs/rules/jsx-props-no-multi-spaces.md) | Disallow multiple spaces between inline JSX props | | 🔧 | | |
-| [jsx-props-no-spreading](docs/rules/jsx-props-no-spreading.md) | Disallow JSX prop spreading | | | | |
-| [jsx-sort-default-props](docs/rules/jsx-sort-default-props.md) | Enforce defaultProps declarations alphabetical sorting | | | | |
-| [jsx-sort-props](docs/rules/jsx-sort-props.md) | Enforce props alphabetical sorting | | 🔧 | | |
-| [jsx-space-before-closing](docs/rules/jsx-space-before-closing.md) | Enforce spacing before closing bracket in JSX | | 🔧 | | ❌ |
-| [jsx-tag-spacing](docs/rules/jsx-tag-spacing.md) | Enforce whitespace in and around the JSX opening and closing brackets | | 🔧 | | |
-| [jsx-uses-react](docs/rules/jsx-uses-react.md) | Disallow React to be incorrectly marked as unused | 💼 | | | |
-| [jsx-uses-vars](docs/rules/jsx-uses-vars.md) | Disallow variables used in JSX to be incorrectly marked as unused | 💼 | | | |
-| [jsx-wrap-multilines](docs/rules/jsx-wrap-multilines.md) | Disallow missing parentheses around multiline JSX | | 🔧 | | |
-| [no-access-state-in-setstate](docs/rules/no-access-state-in-setstate.md) | Disallow when this.state is accessed within setState | | | | |
-| [no-adjacent-inline-elements](docs/rules/no-adjacent-inline-elements.md) | Disallow adjacent inline elements not separated by whitespace. | | | | |
-| [no-array-index-key](docs/rules/no-array-index-key.md) | Disallow usage of Array index in keys | | | | |
-| [no-arrow-function-lifecycle](docs/rules/no-arrow-function-lifecycle.md) | Lifecycle methods should be methods on the prototype, not class fields | | 🔧 | | |
-| [no-children-prop](docs/rules/no-children-prop.md) | Disallow passing of children as props | 💼 | | | |
-| [no-danger](docs/rules/no-danger.md) | Disallow usage of dangerous JSX properties | | | | |
-| [no-danger-with-children](docs/rules/no-danger-with-children.md) | Disallow when a DOM element is using both children and dangerouslySetInnerHTML | 💼 | | | |
-| [no-deprecated](docs/rules/no-deprecated.md) | Disallow usage of deprecated methods | 💼 | | | |
-| [no-did-mount-set-state](docs/rules/no-did-mount-set-state.md) | Disallow usage of setState in componentDidMount | | | | |
-| [no-did-update-set-state](docs/rules/no-did-update-set-state.md) | Disallow usage of setState in componentDidUpdate | | | | |
-| [no-direct-mutation-state](docs/rules/no-direct-mutation-state.md) | Disallow direct mutation of this.state | 💼 | | | |
-| [no-find-dom-node](docs/rules/no-find-dom-node.md) | Disallow usage of findDOMNode | 💼 | | | |
-| [no-invalid-html-attribute](docs/rules/no-invalid-html-attribute.md) | Disallow usage of invalid attributes | | 🔧 | | |
-| [no-is-mounted](docs/rules/no-is-mounted.md) | Disallow usage of isMounted | 💼 | | | |
-| [no-multi-comp](docs/rules/no-multi-comp.md) | Disallow multiple component definition per file | | | | |
-| [no-namespace](docs/rules/no-namespace.md) | Enforce that namespaces are not used in React elements | | | | |
-| [no-redundant-should-component-update](docs/rules/no-redundant-should-component-update.md) | Disallow usage of shouldComponentUpdate when extending React.PureComponent | | | | |
-| [no-render-return-value](docs/rules/no-render-return-value.md) | Disallow usage of the return value of ReactDOM.render | 💼 | | | |
-| [no-set-state](docs/rules/no-set-state.md) | Disallow usage of setState | | | | |
-| [no-string-refs](docs/rules/no-string-refs.md) | Disallow using string references | 💼 | | | |
-| [no-this-in-sfc](docs/rules/no-this-in-sfc.md) | Disallow `this` from being used in stateless functional components | | | | |
-| [no-typos](docs/rules/no-typos.md) | Disallow common typos | | | | |
-| [no-unescaped-entities](docs/rules/no-unescaped-entities.md) | Disallow unescaped HTML entities from appearing in markup | 💼 | | | |
-| [no-unknown-property](docs/rules/no-unknown-property.md) | Disallow usage of unknown DOM property | 💼 | 🔧 | | |
-| [no-unsafe](docs/rules/no-unsafe.md) | Disallow usage of unsafe lifecycle methods | | | | |
-| [no-unstable-nested-components](docs/rules/no-unstable-nested-components.md) | Disallow creating unstable components inside components | | | | |
-| [no-unused-class-component-methods](docs/rules/no-unused-class-component-methods.md) | Disallow declaring unused methods of component class | | | | |
-| [no-unused-prop-types](docs/rules/no-unused-prop-types.md) | Disallow definitions of unused propTypes | | | | |
-| [no-unused-state](docs/rules/no-unused-state.md) | Disallow definitions of unused state | | | | |
-| [no-will-update-set-state](docs/rules/no-will-update-set-state.md) | Disallow usage of setState in componentWillUpdate | | | | |
-| [prefer-es6-class](docs/rules/prefer-es6-class.md) | Enforce ES5 or ES6 class for React Components | | | | |
-| [prefer-exact-props](docs/rules/prefer-exact-props.md) | Prefer exact proptype definitions | | | | |
-| [prefer-read-only-props](docs/rules/prefer-read-only-props.md) | Enforce that props are read-only | | 🔧 | | |
-| [prefer-stateless-function](docs/rules/prefer-stateless-function.md) | Enforce stateless components to be written as a pure function | | | | |
-| [prop-types](docs/rules/prop-types.md) | Disallow missing props validation in a React component definition | 💼 | | | |
-| [react-in-jsx-scope](docs/rules/react-in-jsx-scope.md) | Disallow missing React when using JSX | 💼 | | | |
-| [require-default-props](docs/rules/require-default-props.md) | Enforce a defaultProps definition for every prop that is not a required prop | | | | |
-| [require-optimization](docs/rules/require-optimization.md) | Enforce React components to have a shouldComponentUpdate method | | | | |
-| [require-render-return](docs/rules/require-render-return.md) | Enforce ES5 or ES6 class for returning value in render function | 💼 | | | |
-| [self-closing-comp](docs/rules/self-closing-comp.md) | Disallow extra closing tags for components without children | | 🔧 | | |
-| [sort-comp](docs/rules/sort-comp.md) | Enforce component methods order | | | | |
-| [sort-prop-types](docs/rules/sort-prop-types.md) | Enforce propTypes declarations alphabetical sorting | | | | |
-| [state-in-constructor](docs/rules/state-in-constructor.md) | Enforce class component state initialization style | | | | |
-| [static-property-placement](docs/rules/static-property-placement.md) | Enforces where React component static properties should be positioned. | | | | |
-| [style-prop-object](docs/rules/style-prop-object.md) | Enforce style prop value is an object | | | | |
-| [void-dom-elements-no-children](docs/rules/void-dom-elements-no-children.md) | Disallow void DOM elements (e.g. `<img />`, `<br />`) from receiving children | | | | |
-
-<!-- end auto-generated rules list -->
-
-### 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
-
-### Recommended
-
This plugin exports a `recommended` configuration that enforces React good practices.
@@ -244,5 +126,5 @@
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.
@@ -260,4 +142,263 @@
**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).
+## Configuration (new: `eslint.config.js`)
+
+From [`v8.21.0`](https://github.com/eslint/eslint/releases/tag/v8.21.0), eslint announced a new config system.
+In the new system, `.eslintrc*` is no longer used. `eslint.config.js` would be the default config file name.
+In eslint `v8`, the legacy system (`.eslintrc*`) would still be supported, while in eslint `v9`, only the new system would be supported.
+
+And from [`v8.23.0`](https://github.com/eslint/eslint/releases/tag/v8.23.0), eslint CLI starts to look up `eslint.config.js`.
+**So, if your eslint is `>=8.23.0`, you're 100% ready to use the new config system.**
+
+You might want to check out the official blog posts,
+
+- <https://eslint.org/blog/2022/08/new-config-system-part-1/>
+- <https://eslint.org/blog/2022/08/new-config-system-part-2/>
+- <https://eslint.org/blog/2022/08/new-config-system-part-3/>
+
+and the [official docs](https://eslint.org/docs/latest/user-guide/configuring/configuration-files-new).
+
+### Plugin
+
+The default export of `eslint-plugin-react` is a plugin object.
+
+```js
+const react = require('eslint-plugin-react');
+const globals = require('globals');
+
+module.exports = [
+ …
+ {
+ files: ['**/*.{js,jsx,mjs,cjs,ts,tsx}'],
+ plugins: {
+ react,
+ },
+ languageOptions: {
+ parserOptions: {
+ ecmaFeatures: {
+ jsx: true,
+ },
+ },
+ globals: {
+ ...globals.browser,
+ },
+ },
+ rules: {
+ // ... any rules you want
+ 'react/jsx-uses-react': 'error',
+ 'react/jsx-uses-vars': 'error',
+ },
+ // ... others are omitted for brevity
+ },
+ …
+];
+```
+
+### Configuring shared settings
+
+Refer to the [official docs](https://eslint.org/docs/latest/user-guide/configuring/configuration-files-new#configuring-shared-settings).
+
+The schema of the `settings.react` object would be identical to that of what's already described above in the legacy config section.
+
+<!-- markdownlint-disable-next-line no-duplicate-heading -->
+### Shareable configs
+
+There're also 3 shareable configs.
+
+- `eslint-plugin-react/configs/all`
+- `eslint-plugin-react/configs/recommended`
+- `eslint-plugin-react/configs/jsx-runtime`
+
+If your eslint.config.js is ESM, include the `.js` extension (e.g. `eslint-plugin-react/recommended.js`). Note that the next semver-major will require omitting the extension for these imports.
+
+**Note**: These configurations will import `eslint-plugin-react` and enable JSX in [`languageOptions.parserOptions`](https://eslint.org/docs/latest/user-guide/configuring/configuration-files-new#configuration-objects).
+
+In the new config system, `plugin:` protocol(e.g. `plugin:react/recommended`) is no longer valid.
+As eslint does not automatically import the preset config (shareable config), you explicitly do it by yourself.
+
+```js
+const reactRecommended = require('eslint-plugin-react/configs/recommended');
+
+module.exports = [
+ …
+ reactRecommended, // This is not a plugin object, but a shareable config object
+ …
+];
+```
+
+You can of course add/override some properties.
+
+**Note**: Our shareable configs does not preconfigure `files` or [`languageOptions.globals`](https://eslint.org/docs/latest/user-guide/configuring/configuration-files-new#configuration-objects).
+For most of the cases, you probably want to configure some properties by yourself.
+
+```js
+const reactRecommended = require('eslint-plugin-react/configs/recommended');
+const globals = require('globals');
+
+module.exports = [
+ …
+ {
+ files: ['**/*.{js,mjs,cjs,jsx,mjsx,ts,tsx,mtsx}'],
+ ...reactRecommended,
+ languageOptions: {
+ ...reactRecommended.languageOptions,
+ globals: {
+ ...globals.serviceworker,
+ ...globals.browser;
+ },
+ },
+ },
+ …
+];
+```
+
+The above example is same as the example below, as the new config system is based on chaining.
+
+```js
+const reactRecommended = require('eslint-plugin-react/configs/recommended');
+const globals = require('globals');
+
+module.exports = [
+ …
+ {
+ files: ['**/*.{js,mjs,cjs,jsx,mjsx,ts,tsx,mtsx}'],
+ ...reactRecommended,
+ },
+ {
+ files: ['**/*.{js,mjs,cjs,jsx,mjsx,ts,tsx,mtsx}'],
+ languageOptions: {
+ globals: {
+ ...globals.serviceworker,
+ ...globals.browser,
+ },
+ },
+ },
+ …
+];
+```
+
+## List of supported rules
+
+<!-- begin auto-generated rules list -->
+
+💼 [Configurations](https://github.com/jsx-eslint/eslint-plugin-react/#shareable-configs) enabled in.\
+🚫 [Configurations](https://github.com/jsx-eslint/eslint-plugin-react/#shareable-configs) disabled in.\
+🏃 Set in the `jsx-runtime` [configuration](https://github.com/jsx-eslint/eslint-plugin-react/#shareable-configs).\
+☑️ Set in the `recommended` [configuration](https://github.com/jsx-eslint/eslint-plugin-react/#shareable-configs).\
+🔧 Automatically fixable by the [`--fix` CLI option](https://eslint.org/docs/user-guide/command-line-interface#--fix).\
+💡 Manually fixable by [editor suggestions](https://eslint.org/docs/developer-guide/working-with-rules#providing-suggestions).\
+❌ Deprecated.
+
+| Name | Description | 💼 | 🚫 | 🔧 | 💡 | ❌ |
+| :----------------------------------------------------------------------------------------- | :------------------------------------------------------------------------------------------------------------------------------------------- | :- | :- | :- | :- | :- |
+| [boolean-prop-naming](docs/rules/boolean-prop-naming.md) | Enforces consistent naming for boolean props | | | | | |
+| [button-has-type](docs/rules/button-has-type.md) | Disallow usage of `button` elements without an explicit `type` attribute | | | | | |
+| [default-props-match-prop-types](docs/rules/default-props-match-prop-types.md) | Enforce all defaultProps have a corresponding non-required PropType | | | | | |
+| [destructuring-assignment](docs/rules/destructuring-assignment.md) | Enforce consistent usage of destructuring assignment of props, state, and context | | | 🔧 | | |
+| [display-name](docs/rules/display-name.md) | Disallow missing displayName in a React component definition | ☑️ | | | | |
+| [forbid-component-props](docs/rules/forbid-component-props.md) | Disallow certain props on components | | | | | |
+| [forbid-dom-props](docs/rules/forbid-dom-props.md) | Disallow certain props on DOM Nodes | | | | | |
+| [forbid-elements](docs/rules/forbid-elements.md) | Disallow certain elements | | | | | |
+| [forbid-foreign-prop-types](docs/rules/forbid-foreign-prop-types.md) | Disallow using another component's propTypes | | | | | |
+| [forbid-prop-types](docs/rules/forbid-prop-types.md) | Disallow certain propTypes | | | | | |
+| [function-component-definition](docs/rules/function-component-definition.md) | Enforce a specific function type for function components | | | 🔧 | | |
+| [hook-use-state](docs/rules/hook-use-state.md) | Ensure destructuring and symmetric naming of useState hook value and setter variables | | | | 💡 | |
+| [iframe-missing-sandbox](docs/rules/iframe-missing-sandbox.md) | Enforce sandbox attribute on iframe elements | | | | | |
+| [jsx-boolean-value](docs/rules/jsx-boolean-value.md) | Enforce boolean attributes notation in JSX | | | 🔧 | | |
+| [jsx-child-element-spacing](docs/rules/jsx-child-element-spacing.md) | Enforce or disallow spaces inside of curly braces in JSX attributes and expressions | | | | | |
+| [jsx-closing-bracket-location](docs/rules/jsx-closing-bracket-location.md) | Enforce closing bracket location in JSX | | | 🔧 | | |
+| [jsx-closing-tag-location](docs/rules/jsx-closing-tag-location.md) | Enforce closing tag location for multiline JSX | | | 🔧 | | |
+| [jsx-curly-brace-presence](docs/rules/jsx-curly-brace-presence.md) | Disallow unnecessary JSX expressions when literals alone are sufficient or enforce JSX expressions on literals in JSX children or attributes | | | 🔧 | | |
+| [jsx-curly-newline](docs/rules/jsx-curly-newline.md) | Enforce consistent linebreaks in curly braces in JSX attributes and expressions | | | 🔧 | | |
+| [jsx-curly-spacing](docs/rules/jsx-curly-spacing.md) | Enforce or disallow spaces inside of curly braces in JSX attributes and expressions | | | 🔧 | | |
+| [jsx-equals-spacing](docs/rules/jsx-equals-spacing.md) | Enforce or disallow spaces around equal signs in JSX attributes | | | 🔧 | | |
+| [jsx-filename-extension](docs/rules/jsx-filename-extension.md) | Disallow file extensions that may contain JSX | | | | | |
+| [jsx-first-prop-new-line](docs/rules/jsx-first-prop-new-line.md) | Enforce proper position of the first property in JSX | | | 🔧 | | |
+| [jsx-fragments](docs/rules/jsx-fragments.md) | Enforce shorthand or standard form for React fragments | | | 🔧 | | |
+| [jsx-handler-names](docs/rules/jsx-handler-names.md) | Enforce event handler naming conventions in JSX | | | | | |
+| [jsx-indent](docs/rules/jsx-indent.md) | Enforce JSX indentation | | | 🔧 | | |
+| [jsx-indent-props](docs/rules/jsx-indent-props.md) | Enforce props indentation in JSX | | | 🔧 | | |
+| [jsx-key](docs/rules/jsx-key.md) | Disallow missing `key` props in iterators/collection literals | ☑️ | | | | |
+| [jsx-max-depth](docs/rules/jsx-max-depth.md) | Enforce JSX maximum depth | | | | | |
+| [jsx-max-props-per-line](docs/rules/jsx-max-props-per-line.md) | Enforce maximum of props on a single line in JSX | | | 🔧 | | |
+| [jsx-newline](docs/rules/jsx-newline.md) | Require or prevent a new line after jsx elements and expressions. | | | 🔧 | | |
+| [jsx-no-bind](docs/rules/jsx-no-bind.md) | Disallow `.bind()` or arrow functions in JSX props | | | | | |
+| [jsx-no-comment-textnodes](docs/rules/jsx-no-comment-textnodes.md) | Disallow comments from being inserted as text nodes | ☑️ | | | | |
+| [jsx-no-constructed-context-values](docs/rules/jsx-no-constructed-context-values.md) | Disallows JSX context provider values from taking values that will cause needless rerenders | | | | | |
+| [jsx-no-duplicate-props](docs/rules/jsx-no-duplicate-props.md) | Disallow duplicate properties in JSX | ☑️ | | | | |
+| [jsx-no-leaked-render](docs/rules/jsx-no-leaked-render.md) | Disallow problematic leaked values from being rendered | | | 🔧 | | |
+| [jsx-no-literals](docs/rules/jsx-no-literals.md) | Disallow usage of string literals in JSX | | | | | |
+| [jsx-no-script-url](docs/rules/jsx-no-script-url.md) | Disallow usage of `javascript:` URLs | | | | | |
+| [jsx-no-target-blank](docs/rules/jsx-no-target-blank.md) | Disallow `target="_blank"` attribute without `rel="noreferrer"` | ☑️ | | 🔧 | | |
+| [jsx-no-undef](docs/rules/jsx-no-undef.md) | Disallow undeclared variables in JSX | ☑️ | | | | |
+| [jsx-no-useless-fragment](docs/rules/jsx-no-useless-fragment.md) | Disallow unnecessary fragments | | | 🔧 | | |
+| [jsx-one-expression-per-line](docs/rules/jsx-one-expression-per-line.md) | Require one JSX element per line | | | 🔧 | | |
+| [jsx-pascal-case](docs/rules/jsx-pascal-case.md) | Enforce PascalCase for user-defined JSX components | | | | | |
+| [jsx-props-no-multi-spaces](docs/rules/jsx-props-no-multi-spaces.md) | Disallow multiple spaces between inline JSX props | | | 🔧 | | |
+| [jsx-props-no-spreading](docs/rules/jsx-props-no-spreading.md) | Disallow JSX prop spreading | | | | | |
+| [jsx-sort-default-props](docs/rules/jsx-sort-default-props.md) | Enforce defaultProps declarations alphabetical sorting | | | | | ❌ |
+| [jsx-sort-props](docs/rules/jsx-sort-props.md) | Enforce props alphabetical sorting | | | 🔧 | | |
+| [jsx-space-before-closing](docs/rules/jsx-space-before-closing.md) | Enforce spacing before closing bracket in JSX | | | 🔧 | | ❌ |
+| [jsx-tag-spacing](docs/rules/jsx-tag-spacing.md) | Enforce whitespace in and around the JSX opening and closing brackets | | | 🔧 | | |
+| [jsx-uses-react](docs/rules/jsx-uses-react.md) | Disallow React to be incorrectly marked as unused | ☑️ | 🏃 | | | |
+| [jsx-uses-vars](docs/rules/jsx-uses-vars.md) | Disallow variables used in JSX to be incorrectly marked as unused | ☑️ | | | | |
+| [jsx-wrap-multilines](docs/rules/jsx-wrap-multilines.md) | Disallow missing parentheses around multiline JSX | | | 🔧 | | |
+| [no-access-state-in-setstate](docs/rules/no-access-state-in-setstate.md) | Disallow when this.state is accessed within setState | | | | | |
+| [no-adjacent-inline-elements](docs/rules/no-adjacent-inline-elements.md) | Disallow adjacent inline elements not separated by whitespace. | | | | | |
+| [no-array-index-key](docs/rules/no-array-index-key.md) | Disallow usage of Array index in keys | | | | | |
+| [no-arrow-function-lifecycle](docs/rules/no-arrow-function-lifecycle.md) | Lifecycle methods should be methods on the prototype, not class fields | | | 🔧 | | |
+| [no-children-prop](docs/rules/no-children-prop.md) | Disallow passing of children as props | ☑️ | | | | |
+| [no-danger](docs/rules/no-danger.md) | Disallow usage of dangerous JSX properties | | | | | |
+| [no-danger-with-children](docs/rules/no-danger-with-children.md) | Disallow when a DOM element is using both children and dangerouslySetInnerHTML | ☑️ | | | | |
+| [no-deprecated](docs/rules/no-deprecated.md) | Disallow usage of deprecated methods | ☑️ | | | | |
+| [no-did-mount-set-state](docs/rules/no-did-mount-set-state.md) | Disallow usage of setState in componentDidMount | | | | | |
+| [no-did-update-set-state](docs/rules/no-did-update-set-state.md) | Disallow usage of setState in componentDidUpdate | | | | | |
+| [no-direct-mutation-state](docs/rules/no-direct-mutation-state.md) | Disallow direct mutation of this.state | ☑️ | | | | |
+| [no-find-dom-node](docs/rules/no-find-dom-node.md) | Disallow usage of findDOMNode | ☑️ | | | | |
+| [no-invalid-html-attribute](docs/rules/no-invalid-html-attribute.md) | Disallow usage of invalid attributes | | | | 💡 | |
+| [no-is-mounted](docs/rules/no-is-mounted.md) | Disallow usage of isMounted | ☑️ | | | | |
+| [no-multi-comp](docs/rules/no-multi-comp.md) | Disallow multiple component definition per file | | | | | |
+| [no-namespace](docs/rules/no-namespace.md) | Enforce that namespaces are not used in React elements | | | | | |
+| [no-object-type-as-default-prop](docs/rules/no-object-type-as-default-prop.md) | Disallow usage of referential-type variables as default param in functional component | | | | | |
+| [no-redundant-should-component-update](docs/rules/no-redundant-should-component-update.md) | Disallow usage of shouldComponentUpdate when extending React.PureComponent | | | | | |
+| [no-render-return-value](docs/rules/no-render-return-value.md) | Disallow usage of the return value of ReactDOM.render | ☑️ | | | | |
+| [no-set-state](docs/rules/no-set-state.md) | Disallow usage of setState | | | | | |
+| [no-string-refs](docs/rules/no-string-refs.md) | Disallow using string references | ☑️ | | | | |
+| [no-this-in-sfc](docs/rules/no-this-in-sfc.md) | Disallow `this` from being used in stateless functional components | | | | | |
+| [no-typos](docs/rules/no-typos.md) | Disallow common typos | | | | | |
+| [no-unescaped-entities](docs/rules/no-unescaped-entities.md) | Disallow unescaped HTML entities from appearing in markup | ☑️ | | | | |
+| [no-unknown-property](docs/rules/no-unknown-property.md) | Disallow usage of unknown DOM property | ☑️ | | 🔧 | | |
+| [no-unsafe](docs/rules/no-unsafe.md) | Disallow usage of unsafe lifecycle methods | | ☑️ | | | |
+| [no-unstable-nested-components](docs/rules/no-unstable-nested-components.md) | Disallow creating unstable components inside components | | | | | |
+| [no-unused-class-component-methods](docs/rules/no-unused-class-component-methods.md) | Disallow declaring unused methods of component class | | | | | |
+| [no-unused-prop-types](docs/rules/no-unused-prop-types.md) | Disallow definitions of unused propTypes | | | | | |
+| [no-unused-state](docs/rules/no-unused-state.md) | Disallow definitions of unused state | | | | | |
+| [no-will-update-set-state](docs/rules/no-will-update-set-state.md) | Disallow usage of setState in componentWillUpdate | | | | | |
+| [prefer-es6-class](docs/rules/prefer-es6-class.md) | Enforce ES5 or ES6 class for React Components | | | | | |
+| [prefer-exact-props](docs/rules/prefer-exact-props.md) | Prefer exact proptype definitions | | | | | |
+| [prefer-read-only-props](docs/rules/prefer-read-only-props.md) | Enforce that props are read-only | | | 🔧 | | |
+| [prefer-stateless-function](docs/rules/prefer-stateless-function.md) | Enforce stateless components to be written as a pure function | | | | | |
+| [prop-types](docs/rules/prop-types.md) | Disallow missing props validation in a React component definition | ☑️ | | | | |
+| [react-in-jsx-scope](docs/rules/react-in-jsx-scope.md) | Disallow missing React when using JSX | ☑️ | 🏃 | | | |
+| [require-default-props](docs/rules/require-default-props.md) | Enforce a defaultProps definition for every prop that is not a required prop | | | | | |
+| [require-optimization](docs/rules/require-optimization.md) | Enforce React components to have a shouldComponentUpdate method | | | | | |
+| [require-render-return](docs/rules/require-render-return.md) | Enforce ES5 or ES6 class for returning value in render function | ☑️ | | | | |
+| [self-closing-comp](docs/rules/self-closing-comp.md) | Disallow extra closing tags for components without children | | | 🔧 | | |
+| [sort-comp](docs/rules/sort-comp.md) | Enforce component methods order | | | | | |
+| [sort-default-props](docs/rules/sort-default-props.md) | Enforce defaultProps declarations alphabetical sorting | | | | | |
+| [sort-prop-types](docs/rules/sort-prop-types.md) | Enforce propTypes declarations alphabetical sorting | | | 🔧 | | |
+| [state-in-constructor](docs/rules/state-in-constructor.md) | Enforce class component state initialization style | | | | | |
+| [static-property-placement](docs/rules/static-property-placement.md) | Enforces where React component static properties should be positioned. | | | | | |
+| [style-prop-object](docs/rules/style-prop-object.md) | Enforce style prop value is an object | | | | | |
+| [void-dom-elements-no-children](docs/rules/void-dom-elements-no-children.md) | Disallow void DOM elements (e.g. `<img />`, `<br />`) from receiving children | | | | | |
+
+<!-- end auto-generated rules list -->
+
+## 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/jsx-eslint/eslint-plugin-jsx-a11y)
+- React Native: [eslint-plugin-react-native](https://github.com/Intellicode/eslint-plugin-react-native)
+
## License
diff --git a/configs/all.js b/configs/all.js
new file mode 100644
index v7.31.11..v7.32.2
--- a/configs/all.js
+++ b/configs/all.js
@@ -0,0 +1,39 @@
+'use strict';
+
+const fromEntries = require('object.fromentries');
+const entries = require('object.entries');
+
+const allRules = require('../lib/rules');
+
+function filterRules(rules, predicate) {
+ return fromEntries(entries(rules).filter((entry) => predicate(entry[1])));
+}
+
+function configureAsError(rules) {
+ return fromEntries(Object.keys(rules).map((key) => [`react/${key}`, 2]));
+}
+
+const activeRules = filterRules(allRules, (rule) => !rule.meta.deprecated);
+const activeRulesConfig = configureAsError(activeRules);
+
+const deprecatedRules = filterRules(allRules, (rule) => rule.meta.deprecated);
+
+module.exports = {
+ plugins: {
+ react: {
+ deprecatedRules,
+ rules: allRules,
+ },
+ },
+ rules: activeRulesConfig,
+ languageOptions: {
+ parserOptions: {
+ ecmaFeatures: {
+ jsx: true,
+ },
+ },
+ },
+};
+
+// this is so the `languageOptions` property won't be warned in the new config system
+Object.defineProperty(module.exports, 'languageOptions', { enumerable: false });
diff --git a/lib/rules/index.js b/lib/rules/index.js
new file mode 100644
index v7.31.11..v7.32.2
--- a/lib/rules/index.js
+++ b/lib/rules/index.js
@@ -0,0 +1,106 @@
+'use strict';
+
+/* eslint global-require: 0 */
+
+module.exports = {
+ 'boolean-prop-naming': require('./boolean-prop-naming'),
+ 'button-has-type': require('./button-has-type'),
+ 'default-props-match-prop-types': require('./default-props-match-prop-types'),
+ 'destructuring-assignment': require('./destructuring-assignment'),
+ 'display-name': require('./display-name'),
+ 'forbid-component-props': require('./forbid-component-props'),
+ 'forbid-dom-props': require('./forbid-dom-props'),
+ 'forbid-elements': require('./forbid-elements'),
+ 'forbid-foreign-prop-types': require('./forbid-foreign-prop-types'),
+ 'forbid-prop-types': require('./forbid-prop-types'),
+ 'function-component-definition': require('./function-component-definition'),
+ 'hook-use-state': require('./hook-use-state'),
+ 'iframe-missing-sandbox': require('./iframe-missing-sandbox'),
+ 'jsx-boolean-value': require('./jsx-boolean-value'),
+ 'jsx-child-element-spacing': require('./jsx-child-element-spacing'),
+ 'jsx-closing-bracket-location': require('./jsx-closing-bracket-location'),
+ 'jsx-closing-tag-location': require('./jsx-closing-tag-location'),
+ 'jsx-curly-spacing': require('./jsx-curly-spacing'),
+ 'jsx-curly-newline': require('./jsx-curly-newline'),
+ 'jsx-equals-spacing': require('./jsx-equals-spacing'),
+ 'jsx-filename-extension': require('./jsx-filename-extension'),
+ 'jsx-first-prop-new-line': require('./jsx-first-prop-new-line'),
+ 'jsx-handler-names': require('./jsx-handler-names'),
+ 'jsx-indent': require('./jsx-indent'),
+ 'jsx-indent-props': require('./jsx-indent-props'),
+ 'jsx-key': require('./jsx-key'),
+ 'jsx-max-depth': require('./jsx-max-depth'),
+ 'jsx-max-props-per-line': require('./jsx-max-props-per-line'),
+ 'jsx-newline': require('./jsx-newline'),
+ 'jsx-no-bind': require('./jsx-no-bind'),
+ 'jsx-no-comment-textnodes': require('./jsx-no-comment-textnodes'),
+ 'jsx-no-constructed-context-values': require('./jsx-no-constructed-context-values'),
+ 'jsx-no-duplicate-props': require('./jsx-no-duplicate-props'),
+ 'jsx-no-leaked-render': require('./jsx-no-leaked-render'),
+ 'jsx-no-literals': require('./jsx-no-literals'),
+ 'jsx-no-script-url': require('./jsx-no-script-url'),
+ 'jsx-no-target-blank': require('./jsx-no-target-blank'),
+ 'jsx-no-useless-fragment': require('./jsx-no-useless-fragment'),
+ 'jsx-one-expression-per-line': require('./jsx-one-expression-per-line'),
+ 'jsx-no-undef': require('./jsx-no-undef'),
+ 'jsx-curly-brace-presence': require('./jsx-curly-brace-presence'),
+ 'jsx-pascal-case': require('./jsx-pascal-case'),
+ 'jsx-fragments': require('./jsx-fragments'),
+ 'jsx-props-no-multi-spaces': require('./jsx-props-no-multi-spaces'),
+ 'jsx-props-no-spreading': require('./jsx-props-no-spreading'),
+ 'jsx-sort-default-props': require('./jsx-sort-default-props'),
+ 'jsx-sort-props': require('./jsx-sort-props'),
+ 'jsx-space-before-closing': require('./jsx-space-before-closing'),
+ 'jsx-tag-spacing': require('./jsx-tag-spacing'),
+ 'jsx-uses-react': require('./jsx-uses-react'),
+ 'jsx-uses-vars': require('./jsx-uses-vars'),
+ 'jsx-wrap-multilines': require('./jsx-wrap-multilines'),
+ 'no-invalid-html-attribute': require('./no-invalid-html-attribute'),
+ 'no-access-state-in-setstate': require('./no-access-state-in-setstate'),
+ 'no-adjacent-inline-elements': require('./no-adjacent-inline-elements'),
+ 'no-array-index-key': require('./no-array-index-key'),
+ 'no-arrow-function-lifecycle': require('./no-arrow-function-lifecycle'),
+ 'no-children-prop': require('./no-children-prop'),
+ 'no-danger': require('./no-danger'),
+ 'no-danger-with-children': require('./no-danger-with-children'),
+ 'no-deprecated': require('./no-deprecated'),
+ 'no-did-mount-set-state': require('./no-did-mount-set-state'),
+ 'no-did-update-set-state': require('./no-did-update-set-state'),
+ 'no-direct-mutation-state': require('./no-direct-mutation-state'),
+ 'no-find-dom-node': require('./no-find-dom-node'),
+ 'no-is-mounted': require('./no-is-mounted'),
+ 'no-multi-comp': require('./no-multi-comp'),
+ 'no-namespace': require('./no-namespace'),
+ 'no-set-state': require('./no-set-state'),
+ 'no-string-refs': require('./no-string-refs'),
+ 'no-redundant-should-component-update': require('./no-redundant-should-component-update'),
+ 'no-render-return-value': require('./no-render-return-value'),
+ 'no-this-in-sfc': require('./no-this-in-sfc'),
+ 'no-typos': require('./no-typos'),
+ 'no-unescaped-entities': require('./no-unescaped-entities'),
+ 'no-unknown-property': require('./no-unknown-property'),
+ 'no-unsafe': require('./no-unsafe'),
+ 'no-unstable-nested-components': require('./no-unstable-nested-components'),
+ 'no-unused-class-component-methods': require('./no-unused-class-component-methods'),
+ 'no-unused-prop-types': require('./no-unused-prop-types'),
+ 'no-unused-state': require('./no-unused-state'),
+ 'no-object-type-as-default-prop': require('./no-object-type-as-default-prop'),
+ 'no-will-update-set-state': require('./no-will-update-set-state'),
+ 'prefer-es6-class': require('./prefer-es6-class'),
+ 'prefer-exact-props': require('./prefer-exact-props'),
+ 'prefer-read-only-props': require('./prefer-read-only-props'),
+ 'prefer-stateless-function': require('./prefer-stateless-function'),
+ 'prop-types': require('./prop-types'),
+ 'react-in-jsx-scope': require('./react-in-jsx-scope'),
+ 'require-default-props': require('./require-default-props'),
+ 'require-optimization': require('./require-optimization'),
+ 'require-render-return': require('./require-render-return'),
+ 'self-closing-comp': require('./self-closing-comp'),
+ 'sort-comp': require('./sort-comp'),
+ 'sort-default-props': require('./sort-default-props'),
+ 'sort-prop-types': require('./sort-prop-types'),
+ 'state-in-constructor': require('./state-in-constructor'),
+ 'static-property-placement': require('./static-property-placement'),
+ 'style-prop-object': require('./style-prop-object'),
+ 'void-dom-elements-no-children': require('./void-dom-elements-no-children'),
+};
diff --git a/configs/jsx-runtime.js b/configs/jsx-runtime.js
new file mode 100644
index v7.31.11..v7.32.2
--- a/configs/jsx-runtime.js
+++ b/configs/jsx-runtime.js
@@ -0,0 +1,18 @@
+'use strict';
+
+const all = require('./all');
+
+module.exports = Object.assign({}, all, {
+ languageOptions: Object.assign({}, all.languageOptions, {
+ parserOptions: Object.assign({}, all.languageOptions.parserOptions, {
+ jsxPragma: null, // for @typescript/eslint-parser
+ }),
+ }),
+ rules: {
+ 'react/react-in-jsx-scope': 0,
+ 'react/jsx-uses-react': 0,
+ },
+});
+
+// this is so the `languageOptions` property won't be warned in the new config system
+Object.defineProperty(module.exports, 'languageOptions', { enumerable: false });
diff --git a/lib/util/message.js b/lib/util/message.js
new file mode 100644
index v7.31.11..v7.32.2
--- a/lib/util/message.js
+++ b/lib/util/message.js
@@ -0,0 +1,8 @@
+'use strict';
+
+const semver = require('semver');
+const eslintPkg = require('eslint/package.json');
+
+module.exports = function getMessageData(messageId, message) {
+ return messageId && semver.satisfies(eslintPkg.version, '>= 4.15') ? { messageId } : { message };
+};
diff --git a/lib/rules/no-object-type-as-default-prop.js b/lib/rules/no-object-type-as-default-prop.js
new file mode 100644
index v7.31.11..v7.32.2
--- a/lib/rules/no-object-type-as-default-prop.js
+++ b/lib/rules/no-object-type-as-default-prop.js
@@ -0,0 +1,103 @@
+/**
+ * @fileoverview Prevent usage of referential-type variables as default param in functional component
+ * @author Chang Yan
+ */
+
+'use strict';
+
+const values = require('object.values');
+
+const Components = require('../util/Components');
+const docsUrl = require('../util/docsUrl');
+const report = require('../util/report');
+
+const FORBIDDEN_TYPES_MAP = {
+ ArrowFunctionExpression: 'arrow function',
+ FunctionExpression: 'function expression',
+ ObjectExpression: 'object literal',
+ ArrayExpression: 'array literal',
+ ClassExpression: 'class expression',
+ NewExpression: 'construction expression',
+ JSXElement: 'JSX element',
+};
+
+const FORBIDDEN_TYPES = new Set(Object.keys(FORBIDDEN_TYPES_MAP));
+const MESSAGE_ID = 'forbiddenTypeDefaultParam';
+
+const messages = {
+ [MESSAGE_ID]: '{{propName}} has a/an {{forbiddenType}} as default prop. This could lead to potential infinite render loop in React. Use a variable reference instead of {{forbiddenType}}.',
+};
+function hasUsedObjectDestructuringSyntax(params) {
+ return (
+ params != null
+ && params.length === 1
+ && params[0].type === 'ObjectPattern'
+ );
+}
+
+function verifyDefaultPropsDestructuring(context, properties) {
+ // Loop through each of the default params
+ properties.filter((prop) => prop.type === 'Property' && prop.value.type === 'AssignmentPattern').forEach((prop) => {
+ const propName = prop.key.name;
+ const propDefaultValue = prop.value;
+
+ const propDefaultValueType = propDefaultValue.right.type;
+
+ if (
+ propDefaultValueType === 'Literal'
+ && propDefaultValue.right.regex != null
+ ) {
+ report(context, messages[MESSAGE_ID], MESSAGE_ID, {
+ node: propDefaultValue,
+ data: {
+ propName,
+ forbiddenType: 'regex literal',
+ },
+ });
+ } else if (
+ propDefaultValueType === 'CallExpression'
+ && propDefaultValue.right.callee.type === 'Identifier'
+ && propDefaultValue.right.callee.name === 'Symbol'
+ ) {
+ report(context, messages[MESSAGE_ID], MESSAGE_ID, {
+ node: propDefaultValue,
+ data: {
+ propName,
+ forbiddenType: 'Symbol literal',
+ },
+ });
+ } else if (FORBIDDEN_TYPES.has(propDefaultValueType)) {
+ report(context, messages[MESSAGE_ID], MESSAGE_ID, {
+ node: propDefaultValue,
+ data: {
+ propName,
+ forbiddenType: FORBIDDEN_TYPES_MAP[propDefaultValueType],
+ },
+ });
+ }
+ });
+}
+
+module.exports = {
+ meta: {
+ docs: {
+ description: 'Disallow usage of referential-type variables as default param in functional component',
+ category: 'Best Practices',
+ recommended: false,
+ url: docsUrl('no-object-type-as-default-prop'),
+ },
+ messages,
+ },
+ create: Components.detect((context, components) => ({
+ 'Program:exit'() {
+ const list = components.list();
+ values(list)
+ .filter((component) => hasUsedObjectDestructuringSyntax(component.node.params))
+ .forEach((component) => {
+ const node = component.node;
+ const properties = node.params[0].properties;
+ verifyDefaultPropsDestructuring(context, properties);
+ });
+ },
+ })),
+};
diff --git a/configs/recommended.js b/configs/recommended.js
new file mode 100644
index v7.31.11..v7.32.2
--- a/configs/recommended.js
+++ b/configs/recommended.js
@@ -0,0 +1,34 @@
+'use strict';
+
+const all = require('./all');
+
+module.exports = Object.assign({}, all, {
+ languageOptions: all.languageOptions,
+ rules: {
+ 'react/display-name': 2,
+ 'react/jsx-key': 2,
+ 'react/jsx-no-comment-textnodes': 2,
+ 'react/jsx-no-duplicate-props': 2,
+ 'react/jsx-no-target-blank': 2,
+ 'react/jsx-no-undef': 2,
+ 'react/jsx-uses-react': 2,
+ 'react/jsx-uses-vars': 2,
+ 'react/no-children-prop': 2,
+ 'react/no-danger-with-children': 2,
+ 'react/no-deprecated': 2,
+ 'react/no-direct-mutation-state': 2,
+ 'react/no-find-dom-node': 2,
+ 'react/no-is-mounted': 2,
+ 'react/no-render-return-value': 2,
+ 'react/no-string-refs': 2,
+ 'react/no-unescaped-entities': 2,
+ 'react/no-unknown-property': 2,
+ 'react/no-unsafe': 0,
+ 'react/prop-types': 2,
+ 'react/react-in-jsx-scope': 2,
+ 'react/require-render-return': 2,
+ },
+});
+
+// this is so the `languageOptions` property won't be warned in the new config system
+Object.defineProperty(module.exports, 'languageOptions', { enumerable: false });
diff --git a/lib/rules/sort-default-props.js b/lib/rules/sort-default-props.js
new file mode 100644
index v7.31.11..v7.32.2
--- a/lib/rules/sort-default-props.js
+++ b/lib/rules/sort-default-props.js
@@ -0,0 +1,174 @@
+/**
+ * @fileoverview Enforce default props alphabetical sorting
+ * @author Vladimir Kattsov
+ * @deprecated
+ */
+
+'use strict';
+
+const variableUtil = require('../util/variable');
+const docsUrl = require('../util/docsUrl');
+const report = require('../util/report');
+
+// ------------------------------------------------------------------------------
+// Rule Definition
+// ------------------------------------------------------------------------------
+
+const messages = {
+ propsNotSorted: 'Default prop types declarations should be sorted alphabetically',
+};
+
+module.exports = {
+ meta: {
+ docs: {
+ description: 'Enforce defaultProps declarations alphabetical sorting',
+ category: 'Stylistic Issues',
+ recommended: false,
+ url: docsUrl('sort-default-props'),
+ },
+ // fixable: 'code',
+
+ messages,
+
+ schema: [{
+ type: 'object',
+ properties: {
+ ignoreCase: {
+ type: 'boolean',
+ },
+ },
+ additionalProperties: false,
+ }],
+ },
+
+ create(context) {
+ const configuration = context.options[0] || {};
+ const ignoreCase = configuration.ignoreCase || false;
+
+ /**
+ * Get properties name
+ * @param {Object} node - Property.
+ * @returns {String} Property name.
+ */
+ function getPropertyName(node) {
+ if (node.key || ['MethodDefinition', 'Property'].indexOf(node.type) !== -1) {
+ return node.key.name;
+ }
+ if (node.type === 'MemberExpression') {
+ return node.property.name;
+ // Special case for class properties
+ // (babel-eslint@5 does not expose property name so we have to rely on tokens)
+ }
+ if (node.type === 'ClassProperty') {
+ const tokens = context.getSourceCode().getFirstTokens(node, 2);
+ return tokens[1] && tokens[1].type === 'Identifier' ? tokens[1].value : tokens[0].value;
+ }
+ return '';
+ }
+
+ /**
+ * Checks if the Identifier node passed in looks like a defaultProps declaration.
+ * @param {ASTNode} node The node to check. Must be an Identifier node.
+ * @returns {Boolean} `true` if the node is a defaultProps declaration, `false` if not
+ */
+ function isDefaultPropsDeclaration(node) {
+ const propName = getPropertyName(node);
+ return (propName === 'defaultProps' || propName === 'getDefaultProps');
+ }
+
+ function getKey(node) {
+ return context.getSourceCode().getText(node.key || node.argument);
+ }
+
+ /**
+ * Find a variable by name in the current scope.
+ * @param {string} name Name of the variable to look for.
+ * @returns {ASTNode|null} Return null if the variable could not be found, ASTNode otherwise.
+ */
+ function findVariableByName(name) {
+ const variable = variableUtil.variablesInScope(context).find((item) => item.name === name);
+
+ if (!variable || !variable.defs[0] || !variable.defs[0].node) {
+ return null;
+ }
+
+ if (variable.defs[0].node.type === 'TypeAlias') {
+ return variable.defs[0].node.right;
+ }
+
+ return variable.defs[0].node.init;
+ }
+
+ /**
+ * Checks if defaultProps declarations are sorted
+ * @param {Array} declarations The array of AST nodes being checked.
+ * @returns {void}
+ */
+ function checkSorted(declarations) {
+ // function fix(fixer) {
+ // return propTypesSortUtil.fixPropTypesSort(fixer, context, declarations, ignoreCase);
+ // }
+
+ declarations.reduce((prev, curr, idx, decls) => {
+ if (/Spread(?:Property|Element)$/.test(curr.type)) {
+ return decls[idx + 1];
+ }
+
+ let prevPropName = getKey(prev);
+ let currentPropName = getKey(curr);
+
+ if (ignoreCase) {
+ prevPropName = prevPropName.toLowerCase();
+ currentPropName = currentPropName.toLowerCase();
+ }
+
+ if (currentPropName < prevPropName) {
+ report(context, messages.propsNotSorted, 'propsNotSorted', {
+ node: curr,
+ // fix
+ });
+
+ return prev;
+ }
+
+ return curr;
+ }, declarations[0]);
+ }
+
+ function checkNode(node) {
+ if (!node) {
+ return;
+ }
+ if (node.type === 'ObjectExpression') {
+ checkSorted(node.properties);
+ } else if (node.type === 'Identifier') {
+ const propTypesObject = findVariableByName(node.name);
+ if (propTypesObject && propTypesObject.properties) {
+ checkSorted(propTypesObject.properties);
+ }
+ }
+ }
+
+ // --------------------------------------------------------------------------
+ // Public API
+ // --------------------------------------------------------------------------
+
+ return {
+ 'ClassProperty, PropertyDefinition'(node) {
+ if (!isDefaultPropsDeclaration(node)) {
+ return;
+ }
+
+ checkNode(node.value);
+ },
+
+ MemberExpression(node) {
+ if (!isDefaultPropsDeclaration(node)) {
+ return;
+ }
+
+ checkNode(node.parent.right);
+ },
+ };
+ },
+};
Command detailsnpm diff --diff=eslint-plugin-react@7.31.11 --diff=eslint-plugin-react@7.32.2 --diff-unified=2See also the Reported by ybiquitous/npm-diff-action@v1.4.1 (Node.js 18.13.0 and npm 9.4.0) |
ybiquitous
changed the title
ybiquitous
deleted the
dependabot/npm_and_yarn/eslint-plugin-react-7.32.2
branch
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Bumps eslint-plugin-react from 7.31.11 to 7.32.2.
Release notes
Sourced from eslint-plugin-react's releases.
... (truncated)
Changelog
Sourced from eslint-plugin-react's changelog.
... (truncated)
Commits
66b58ddUpdate CHANGELOG and bump version373167c[Tests]button-has-type: add passing test14e315a[Fix]no-unknown-property: addfillfor\<marker>4523e73[Fix]jsx-no-constructed-context-values,jsx-no-useless-fragment: add a r...d2194a5[Tests] avoid a deprecation warning0479acd[Fix] configs: restoreparserOptionsin legacy configsb2e069eUpdate CHANGELOG and bump version74a9522[Fix]destructuring-assignment: do not force destructuring of optionally ch...161e5a8[patch]destructuring-assignment: usereporthelper for all warningsc4c54cbUpdate link to eslint-plugin-jsx-a11y in READMEDependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting
@dependabot rebase.Dependabot commands and options
You can trigger Dependabot actions by commenting on this PR:
@dependabot rebasewill rebase this PR@dependabot recreatewill recreate this PR, overwriting any edits that have been made to it@dependabot mergewill merge this PR after your CI passes on it@dependabot squash and mergewill squash and merge this PR after your CI passes on it@dependabot cancel mergewill cancel a previously requested merge and block automerging@dependabot reopenwill reopen this PR if it is closed@dependabot closewill close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually@dependabot ignore this major versionwill close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)@dependabot ignore this minor versionwill close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)@dependabot ignore this dependencywill close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)