react-doctor 0.0.32 → 0.0.34

package/dist/react-doctor-plugin.js

@@ -251,14 +251,30 @@ const LARGE_BLUR_THRESHOLD_PX = 10;
 const BLUR_VALUE_PATTERN = /blur\((\d+(?:\.\d+)?)px\)/;
 const ANIMATION_CALLBACK_NAMES = new Set(["requestAnimationFrame", "setInterval"]);
 const RAW_TEXT_PREVIEW_MAX_CHARS = 30;
-const REACT_NATIVE_TEXT_COMPONENTS = new Set(["Text", "TextInput"]);
-const REACT_NATIVE_TEXT_COMPONENT_SUFFIXES = new Set([
+const REACT_NATIVE_TEXT_COMPONENTS = new Set([
+	"Text",
+	"TextInput",
+	"Typography",
+	"Paragraph",
+	"Span",
+	"H1",
+	"H2",
+	"H3",
+	"H4",
+	"H5",
+	"H6"
+]);
+const REACT_NATIVE_TEXT_COMPONENT_KEYWORDS = new Set([
 	"Text",
 	"Title",
 	"Label",
 	"Heading",
 	"Caption",
-	"Subtitle"
+	"Subtitle",
+	"Typography",
+	"Paragraph",
+	"Description",
+	"Body"
 ]);
 const DEPRECATED_RN_MODULE_REPLACEMENTS = {
 	AsyncStorage: "@react-native-async-storage/async-storage",
@@ -311,6 +327,7 @@ const walkAst = (node, visitor) => {
 	}
 };
 const isSetterIdentifier = (name) => SETTER_PATTERN.test(name);
+const isSetterCall = (node) => node.type === "CallExpression" && node.callee?.type === "Identifier" && isSetterIdentifier(node.callee.name);
 const isUppercaseName = (name) => UPPERCASE_PATTERN.test(name);
 const isMemberProperty = (node, propertyName) => node.type === "MemberExpression" && node.property?.type === "Identifier" && node.property.name === propertyName;
 const getEffectCallback = (node) => {
@@ -326,7 +343,7 @@ const getCallbackStatements = (callback) => {
 const countSetStateCalls = (node) => {
 	let setStateCallCount = 0;
 	walkAst(node, (child) => {
-		if (child.type === "CallExpression" && child.callee?.type === "Identifier" && isSetterIdentifier(child.callee.name)) setStateCallCount++;
+		if (isSetterCall(child)) setStateCallCount++;
 	});
 	return setStateCallCount;
 };
@@ -345,7 +362,17 @@ const isSimpleExpression = (node) => {
 };
 const isComponentDeclaration = (node) => node.type === "FunctionDeclaration" && Boolean(node.id?.name) && isUppercaseName(node.id.name);
 const isComponentAssignment = (node) => node.type === "VariableDeclarator" && node.id?.type === "Identifier" && isUppercaseName(node.id.name) && Boolean(node.init) && (node.init.type === "ArrowFunctionExpression" || node.init.type === "FunctionExpression");
-const isHookCall = (node, hookName) => node.type === "CallExpression" && node.callee?.type === "Identifier" && (typeof hookName === "string" ? node.callee.name === hookName : hookName.has(node.callee.name));
+const getCalleeName = (node) => {
+	if (node.callee?.type === "Identifier") return node.callee.name;
+	if (node.callee?.type === "MemberExpression" && node.callee.property?.type === "Identifier") return node.callee.property.name;
+	return null;
+};
+const isHookCall = (node, hookName) => {
+	if (node.type !== "CallExpression") return false;
+	const calleeName = getCalleeName(node);
+	if (!calleeName) return false;
+	return typeof hookName === "string" ? calleeName === hookName : hookName.has(calleeName);
+};
 const hasDirective = (programNode, directive) => Boolean(programNode.body?.some((statement) => statement.type === "ExpressionStatement" && statement.expression?.type === "Literal" && statement.expression.value === directive));
 const hasUseServerDirective = (node) => {
 	if (node.body?.type !== "BlockStatement") return false;
@@ -1228,7 +1255,7 @@ const renderingHydrationNoFlicker = { create: (context) => ({ CallExpression(nod
 	const bodyStatements = callback.body?.type === "BlockStatement" ? callback.body.body : [callback.body];
 	if (!bodyStatements || bodyStatements.length !== 1) return;
 	const soleStatement = bodyStatements[0];
-	if (soleStatement?.type === "ExpressionStatement" && soleStatement.expression?.type === "CallExpression" && soleStatement.expression.callee?.type === "Identifier" && SETTER_PATTERN.test(soleStatement.expression.callee.name)) context.report({
+	if (soleStatement?.type === "ExpressionStatement" && isSetterCall(soleStatement.expression)) context.report({
 		node,
 		message: "useEffect(setState, []) on mount causes a flash — consider useSyncExternalStore or suppressHydrationWarning"
 	});
@@ -1262,7 +1289,7 @@ const getRawTextDescription = (child) => {
 };
 const isTextHandlingComponent = (elementName) => {
 	if (REACT_NATIVE_TEXT_COMPONENTS.has(elementName)) return true;
-	return [...REACT_NATIVE_TEXT_COMPONENT_SUFFIXES].some((suffix) => elementName.endsWith(suffix));
+	return [...REACT_NATIVE_TEXT_COMPONENT_KEYWORDS].some((keyword) => elementName.includes(keyword));
 };
 const rnNoRawText = { create: (context) => {
 	let isDomComponentFile = false;
@@ -1507,7 +1534,10 @@ const noDerivedStateEffect = { create: (context) => ({ CallExpression(node) {
 	if (dependencyNames.size === 0) return;
 	const statements = getCallbackStatements(callback);
 	if (statements.length === 0) return;
-	if (!statements.every((statement) => statement.type === "ExpressionStatement" && statement.expression?.type === "CallExpression" && statement.expression.callee?.type === "Identifier" && isSetterIdentifier(statement.expression.callee.name))) return;
+	if (!statements.every((statement) => {
+		if (statement.type !== "ExpressionStatement") return false;
+		return isSetterCall(statement.expression);
+	})) return;
 	let allArgumentsDeriveFromDeps = true;
 	let hasAnyDependencyReference = false;
 	for (const statement of statements) {
@@ -1621,12 +1651,13 @@ const rerenderLazyStateInit = { create: (context) => ({ CallExpression(node) {
 	});
 } }) };
 const rerenderFunctionalSetstate = { create: (context) => ({ CallExpression(node) {
-	if (node.callee?.type !== "Identifier" || !isSetterIdentifier(node.callee.name)) return;
+	if (!isSetterCall(node)) return;
 	if (!node.arguments?.length) return;
+	const calleeName = node.callee.name;
 	const argument = node.arguments[0];
 	if (argument.type === "BinaryExpression" && (argument.operator === "+" || argument.operator === "-") && argument.left?.type === "Identifier") context.report({
 		node,
-		message: `${node.callee.name}(${argument.left.name} ${argument.operator} ...) — use functional update to avoid stale closures`
+		message: `${calleeName}(${argument.left.name} ${argument.operator} ...) — use functional update to avoid stale closures`
 	});
 } }) };
 const rerenderDependencies = { create: (context) => ({ CallExpression(node) {