eslint-plugin-react-x 5.22.0 → 5.23.0

package/dist/index.js

@@ -144,7 +144,7 @@ const rules$6 = {
 //#endregion
 //#region package.json
 var name$6 = "eslint-plugin-react-x";
-var version = "5.22.0";
+var version = "5.23.0";
 
 //#endregion
 //#region src/utils/create-rule.ts
@@ -1125,7 +1125,7 @@ function getUnknownDependenciesMessage(reactiveHookName) {
 }
 
 //#endregion
-//#region src/rules/globals/lib.ts
+//#region src/rules/globals/helpers.ts
 /**
 * Array methods that mutate the array in place.
 * @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array
@@ -1154,7 +1154,7 @@ function resolveToFunction(context, node, seen = /* @__PURE__ */ new Set()) {
 
 //#endregion
 //#region src/rules/globals/collect.ts
-function createFactCollector$2() {
+function createFactCollector$3() {
 	const facts = {
 		callEdges: [],
 		methodCalls: [],
@@ -1355,7 +1355,7 @@ var globals_default = createRule({
 function create$49(context) {
 	const hooks = core.getHookCollector(context);
 	const comps = core.getFunctionComponentCollector(context);
-	const facts = createFactCollector$2();
+	const facts = createFactCollector$3();
 	return merge(hooks.visitor, comps.visitor, facts.visitor, { "Program:exit"(program) {
 		const renderFunctions = [...comps.api.getAllComponents(program), ...hooks.api.getAllHooks(program)].map(({ node }) => node);
 		const directEffects = inferGlobalMutations(context, facts.facts);
@@ -1375,7 +1375,7 @@ function create$49(context) {
 }
 
 //#endregion
-//#region src/rules/immutability/lib.ts
+//#region src/rules/immutability/helpers.ts
 /**
 * Methods that mutate their receiver in place.
 * @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array
@@ -1481,7 +1481,7 @@ function isRefLikeChain(context, node) {
 
 //#endregion
 //#region src/rules/immutability/collect.ts
-function createFactCollector$1() {
+function createFactCollector$2() {
 	const facts = {
 		mutations: [],
 		sinks: []
@@ -1742,7 +1742,7 @@ var immutability_default = createRule({
 function create$48(context) {
 	const hooks = core.getHookCollector(context);
 	const comps = core.getFunctionComponentCollector(context);
-	const facts = createFactCollector$1();
+	const facts = createFactCollector$2();
 	return merge(hooks.visitor, comps.visitor, facts.visitor, { "Program:exit"(program) {
 		for (const hook of hooks.api.getAllHooks(program)) for (const expression of hook.rets) if (expression != null) facts.facts.sinks.push({
 			kind: "hook-return",
@@ -5080,7 +5080,7 @@ function create$7(context) {
 }
 
 //#endregion
-//#region src/rules/refs/lib.ts
+//#region src/rules/refs/helpers.ts
 const SYNC_ARRAY_CALLBACKS = /* @__PURE__ */ new Set([
 	"every",
 	"filter",
@@ -5272,7 +5272,7 @@ function isAfterTerminatingNonNullGuard(node, getNullBranch) {
 * reachable during render and are not collected. All inference is deferred to
 * `Program:exit`.
 */
-function createFactCollector() {
+function createFactCollector$1() {
 	const facts = {
 		bindings: [],
 		callEdges: [],
@@ -5719,7 +5719,7 @@ var refs_default = createRule({
 function create$6(context) {
 	const hooks = core.getHookCollector(context);
 	const comps = core.getFunctionComponentCollector(context);
-	const facts = createFactCollector();
+	const facts = createFactCollector$1();
 	return merge(hooks.visitor, comps.visitor, facts.visitor, { "Program:exit"(program) {
 		const boundaries = /* @__PURE__ */ new Set([...comps.api.getAllComponents(program).map((component) => component.node), ...hooks.api.getAllHooks(program).map((hook) => hook.node)]);
 		const resolver = createBindingResolver(context, facts.facts);
@@ -8389,36 +8389,67 @@ function create$4(context) {
 }
 
 //#endregion
-//#region src/rules/static-components/lib.ts
+//#region src/rules/static-components/collect.ts
+function createFactCollector() {
+	const facts = { componentUsages: [] };
+	return {
+		facts,
+		visitor: { JSXOpeningElement(node) {
+			if (node.name.type !== AST_NODE_TYPES.JSXIdentifier) return;
+			const name = node.name.name;
+			if (!core.isFunctionComponentName(name)) return;
+			facts.componentUsages.push({
+				name,
+				node: node.name
+			});
+		} }
+	};
+}
+
+//#endregion
+//#region src/rules/static-components/helpers.ts
 /**
 * Expression kinds that always produce a brand-new value on every evaluation, and are
 * therefore considered "dynamically created" when used as a component's value.
 */
-const DYNAMIC_EXPRESSION_TYPES = /* @__PURE__ */ new Set([
+const KNOWN_DYNAMIC_EXPRESSION_TYPES = /* @__PURE__ */ new Set([
 	AST_NODE_TYPES.ArrowFunctionExpression,
 	AST_NODE_TYPES.CallExpression,
 	AST_NODE_TYPES.ClassExpression,
 	AST_NODE_TYPES.FunctionExpression,
 	AST_NODE_TYPES.NewExpression
 ]);
-function findVariableForIdentifier(context, identifier) {
-	const scope = context.sourceCode.getScope(identifier);
-	return findVariable(scope, identifier.name);
+/**
+* Builds a predicate that tells whether a given node lies within the body of one of the
+* collected function or class components, i.e. whether it is "created during render".
+*/
+function createRenderBoundaryChecker(componentNodes) {
+	const components = new Set(componentNodes);
+	return (node) => Traverse.findParent(node, (n) => (Check.isFunction(n) || Check.isClass(n)) && components.has(n)) != null;
 }
+
+//#endregion
+//#region src/rules/static-components/origins.ts
 /**
 * Resolves an expression down to the node that dynamically created its value, if any.
-* Recurses through identifier references and both branches of ternaries.
+* Recurses through identifier references, both branches of ternaries and logical
+* expressions, and the final element of sequence expressions.
 */
 function findDynamicCreationSite(context, node, isInsideRender, seen) {
 	const expr = Extract.unwrap(node);
-	if (DYNAMIC_EXPRESSION_TYPES.has(expr.type)) return expr;
+	if (KNOWN_DYNAMIC_EXPRESSION_TYPES.has(expr.type)) return expr;
 	switch (expr.type) {
 		case AST_NODE_TYPES.ConditionalExpression: return findDynamicCreationSite(context, expr.consequent, isInsideRender, seen) ?? findDynamicCreationSite(context, expr.alternate, isInsideRender, seen);
+		case AST_NODE_TYPES.LogicalExpression: return findDynamicCreationSite(context, expr.left, isInsideRender, seen) ?? findDynamicCreationSite(context, expr.right, isInsideRender, seen);
+		case AST_NODE_TYPES.SequenceExpression: {
+			const last = expr.expressions.at(-1);
+			return last == null ? null : findDynamicCreationSite(context, last, isInsideRender, seen);
+		}
 		case AST_NODE_TYPES.Identifier:
 		case AST_NODE_TYPES.JSXIdentifier: {
-			const variable = findVariableForIdentifier(context, expr);
+			const variable = findVariable(context.sourceCode.getScope(expr), expr.name);
 			if (variable == null) return null;
-			return getDynamicComponentSource(context, variable, isInsideRender, seen).creationNode;
+			return resolveDynamicComponentOrigin(context, variable, isInsideRender, seen).creationNode;
 		}
 		default: return null;
 	}
@@ -8437,7 +8468,11 @@ function findReassignmentCreationSite(context, variable, isInsideRender, seen) {
 	}
 	return null;
 }
-function getDynamicComponentSource(context, variable, isInsideRender, seen = /* @__PURE__ */ new Set()) {
+/**
+* Resolves a component binding to the node that dynamically created its value, if the
+* value is created during render (a fresh function/class/call result on every render).
+*/
+function resolveDynamicComponentOrigin(context, variable, isInsideRender, seen = /* @__PURE__ */ new Set()) {
 	if (seen.has(variable)) return {
 		creationNode: null,
 		isDynamic: false
@@ -8446,7 +8481,7 @@ function getDynamicComponentSource(context, variable, isInsideRender, seen = /*
 	for (const def of variable.defs) {
 		const defNode = def.node;
 		if (!isInsideRender(defNode)) continue;
-		if (defNode.type === AST_NODE_TYPES.FunctionDeclaration || defNode.type === AST_NODE_TYPES.ClassDeclaration) return {
+		if (def.type === DefinitionType.FunctionName || def.type === DefinitionType.ClassName) return {
 			creationNode: defNode,
 			isDynamic: true
 		};
@@ -8468,6 +8503,32 @@ function getDynamicComponentSource(context, variable, isInsideRender, seen = /*
 	};
 }
 
+//#endregion
+//#region src/rules/static-components/effects.ts
+/**
+* Turn collected JSX component usages into effects: a usage is an effect when the
+* binding it refers to is declared inside a component's render body and its value is
+* dynamically created, i.e. the component is recreated on every render.
+*/
+function inferCreatedComponents(context, componentUsages, isInsideRender) {
+	const effects = [];
+	for (const usage of componentUsages) {
+		const variable = findVariable(context.sourceCode.getScope(usage.node), usage.name);
+		if (variable == null) continue;
+		const def = variable.defs.at(0);
+		if (def == null) continue;
+		if (!isInsideRender(def.node)) continue;
+		const { creationNode, isDynamic } = resolveDynamicComponentOrigin(context, variable, isInsideRender);
+		if (!isDynamic) continue;
+		effects.push({
+			name: usage.name,
+			creationNode,
+			node: usage.node
+		});
+	}
+	return effects;
+}
+
 //#endregion
 //#region src/rules/static-components/static-components.ts
 const RULE_NAME$3 = "static-components";
@@ -8489,51 +8550,27 @@ function create$3(context) {
 	const hint = core.FunctionComponentDetectionHint.DoNotIncludeJsxWithNumberValue | core.FunctionComponentDetectionHint.DoNotIncludeJsxWithBooleanValue | core.FunctionComponentDetectionHint.DoNotIncludeJsxWithNullValue | core.FunctionComponentDetectionHint.DoNotIncludeJsxWithStringValue | core.FunctionComponentDetectionHint.DoNotIncludeJsxWithUndefinedValue | core.FunctionComponentDetectionHint.RequireBothSidesOfLogicalExpressionToBeJsx | core.FunctionComponentDetectionHint.RequireBothBranchesOfConditionalExpressionToBeJsx | core.FunctionComponentDetectionHint.DoNotIncludeFunctionDefinedAsArrayPatternElement | core.FunctionComponentDetectionHint.DoNotIncludeFunctionDefinedAsArrayExpressionElement | core.FunctionComponentDetectionHint.DoNotIncludeFunctionDefinedAsArrayMapCallback;
 	const fc = core.getFunctionComponentCollector(context, { hint });
 	const cc = core.getClassComponentCollector(context);
-	const candidates = [];
-	return merge(fc.visitor, cc.visitor, {
-		JSXOpeningElement(node) {
-			if (node.name.type !== AST_NODE_TYPES.JSXIdentifier) return;
-			const name = node.name.name;
-			if (!core.isFunctionComponentName(name)) return;
-			candidates.push({
-				name,
-				identifier: node.name
+	const facts = createFactCollector();
+	return merge(fc.visitor, cc.visitor, facts.visitor, { "Program:exit"(program) {
+		const componentNodes = [...fc.api.getAllComponents(program), ...cc.api.getAllComponents(program)].map((component) => component.node);
+		const isInsideRender = createRenderBoundaryChecker(componentNodes);
+		const reportedCreations = /* @__PURE__ */ new Set();
+		for (const effect of inferCreatedComponents(context, facts.facts.componentUsages, isInsideRender)) {
+			context.report({
+				data: { name: effect.name },
+				messageId: "default",
+				node: effect.node
 			});
-		},
-		"Program:exit"(program) {
-			const isInsideRender = createRenderBoundaryChecker(fc, cc, program);
-			for (const candidate of candidates) reportIfCreatedDuringRender(context, candidate, isInsideRender);
+			if (effect.creationNode != null && !reportedCreations.has(effect.creationNode)) {
+				reportedCreations.add(effect.creationNode);
+				context.report({
+					data: { name: effect.name },
+					messageId: "createdHere",
+					node: effect.creationNode
+				});
+			}
 		}
-	});
-}
-/**
-* Builds a predicate that tells whether a given node lies within the body of a
-* previously-collected function or class component, i.e. whether it is "created during render".
-*/
-function createRenderBoundaryChecker(fc, cc, program) {
-	const componentNodes = new Set([...fc.api.getAllComponents(program), ...cc.api.getAllComponents(program)].map((component) => component.node));
-	const getEnclosingComponent = (node) => Traverse.findParent(node, (n) => (Check.isFunction(n) || Check.isClass(n)) && componentNodes.has(n));
-	return (node) => getEnclosingComponent(node) != null;
-}
-function reportIfCreatedDuringRender(context, candidate, isInsideRender) {
-	const { name, identifier } = candidate;
-	const variable = findVariableForIdentifier(context, identifier);
-	if (variable == null) return;
-	const def = variable.defs.at(0);
-	if (def == null) return;
-	if (!isInsideRender(def.node)) return;
-	const { creationNode, isDynamic } = getDynamicComponentSource(context, variable, isInsideRender);
-	if (!isDynamic) return;
-	context.report({
-		data: { name },
-		messageId: "default",
-		node: identifier
-	});
-	if (creationNode != null) context.report({
-		data: { name },
-		messageId: "createdHere",
-		node: creationNode
-	});
+	} });
 }
 
 //#endregion
@@ -8904,6 +8941,8 @@ function create(context) {
 		}
 		let parent = node.parent;
 		while (Check.isTypeExpression(parent)) parent = parent.parent;
+		if (parent.type === AST_NODE_TYPES.ReturnStatement) return;
+		if (parent.type === AST_NODE_TYPES.ArrowFunctionExpression) return;
 		if (parent.type !== AST_NODE_TYPES.VariableDeclarator) {
 			if (!enforceAssignment) return;
 			context.report({

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "eslint-plugin-react-x",
-  "version": "5.22.0",
+  "version": "5.23.0",
   "description": "A set of composable ESLint rules for libraries and frameworks that use React as a UI runtime.",
   "keywords": [
     "react",
@@ -36,12 +36,12 @@
     "dist"
   ],
   "dependencies": {
-    "@eslint-react/ast": "5.22.0",
-    "@eslint-react/core": "5.22.0",
-    "@eslint-react/eslint": "5.22.0",
-    "@eslint-react/jsx": "5.22.0",
-    "@eslint-react/shared": "5.22.0",
-    "@eslint-react/var": "5.22.0",
+    "@eslint-react/ast": "5.23.0",
+    "@eslint-react/core": "5.23.0",
+    "@eslint-react/eslint": "5.23.0",
+    "@eslint-react/jsx": "5.23.0",
+    "@eslint-react/shared": "5.23.0",
+    "@eslint-react/var": "5.23.0",
     "@typescript-eslint/scope-manager": "^8.70.1",
     "@typescript-eslint/types": "^8.70.1",
     "@typescript-eslint/typescript-estree": "^8.70.1",