eslint-plugin-code-style 1.3.9 → 1.3.10

package/index.js

@@ -1836,6 +1836,47 @@ const functionNamingConvention = {
 
         const endsWithHandler = (name) => handlerRegex.test(name);
 
+        // Check if a node contains JSX (making it a React component)
+        const containsJsxHandler = (node) => {
+            if (!node) return false;
+
+            if (node.type === "JSXElement" || node.type === "JSXFragment") return true;
+
+            if (node.type === "BlockStatement") {
+                for (const statement of node.body) {
+                    if (statement.type === "ReturnStatement" && statement.argument) {
+                        if (containsJsxHandler(statement.argument)) return true;
+                    }
+
+                    if (statement.type === "IfStatement") {
+                        if (containsJsxHandler(statement.consequent)) return true;
+                        if (statement.alternate && containsJsxHandler(statement.alternate)) return true;
+                    }
+                }
+            }
+
+            if (node.type === "ConditionalExpression") {
+                return containsJsxHandler(node.consequent) || containsJsxHandler(node.alternate);
+            }
+
+            if (node.type === "LogicalExpression") {
+                return containsJsxHandler(node.left) || containsJsxHandler(node.right);
+            }
+
+            if (node.type === "ParenthesizedExpression") {
+                return containsJsxHandler(node.expression);
+            }
+
+            return false;
+        };
+
+        // Check if function is a React component (PascalCase + returns JSX)
+        const isReactComponentHandler = (node, name) => {
+            if (!name || !/^[A-Z]/.test(name)) return false;
+
+            return containsJsxHandler(node.body);
+        };
+
         const checkFunctionHandler = (node) => {
             let name = null;
 
@@ -1852,7 +1893,10 @@ const functionNamingConvention = {
             // Skip hooks
             if (/^use[A-Z]/.test(name)) return;
 
-            // Check PascalCase functions
+            // Skip React components (PascalCase + returns JSX)
+            if (isReactComponentHandler(node, name)) return;
+
+            // Check PascalCase functions that are NOT React components
             if (/^[A-Z]/.test(name)) {
                 // If starts with a verb (case-insensitive), it should be camelCase
                 if (startsWithVerbCaseInsensitiveHandler(name)) {
@@ -13895,32 +13939,27 @@ const reactCodeOrder = {
                 }
             }
 
-            // Filter to only relevant statements (skip comments, empty statements)
-            const relevantStatements = statements.filter((s) => s.type === "VariableDeclaration"
+            // Categorizable statement types for ordering
+            const isCategorizableStatement = (s) => s.type === "VariableDeclaration"
                     || s.type === "FunctionDeclaration"
                     || s.type === "ExpressionStatement"
-                    || s.type === "ReturnStatement");
+                    || s.type === "ReturnStatement";
+
+            // Filter to only categorizable statements for order checking
+            const categorizableStatements = statements.filter(isCategorizableStatement);
 
-            if (relevantStatements.length < 2) return;
+            if (categorizableStatements.length < 2) return;
 
-            // Collect all statements with their categories and original positions
-            const statementsWithCategories = [];
+            // Check order violations using only categorizable statements
             let hasOrderViolation = false;
             let lastCategory = 0;
             let violatingStatement = null;
             let violatingCategory = null;
             let previousCategory = null;
 
-            for (let i = 0; i < relevantStatements.length; i++) {
-                const statement = relevantStatements[i];
+            for (const statement of categorizableStatements) {
                 const category = getStatementCategoryHandler(statement, propNames);
 
-                statementsWithCategories.push({
-                    category,
-                    index: i,
-                    statement,
-                });
-
                 // Skip unknown statements for order checking
                 if (category === ORDER.UNKNOWN) continue;
 
@@ -13937,53 +13976,78 @@ const reactCodeOrder = {
 
             if (!hasOrderViolation) return;
 
-            // Sort statements by category (stable sort - maintains relative order within same category)
-            const sortedStatements = [...statementsWithCategories].sort((a, b) => {
-                if (a.category !== b.category) {
-                    return a.category - b.category;
+            // For auto-fix, process ALL statements and assign sort keys
+            // Non-categorizable statements (if, for, while, etc.) get the category of the NEXT categorizable statement
+            // This keeps them positioned just before whatever comes after them
+            const allStatementsWithSortKeys = [];
+
+            // First pass: assign categories to categorizable statements
+            const categoryMap = new Map();
+
+            for (const stmt of statements) {
+                if (isCategorizableStatement(stmt)) {
+                    categoryMap.set(stmt, getStatementCategoryHandler(stmt, propNames));
                 }
+            }
+
+            // Second pass: assign sort keys to all statements
+            // Non-categorizable statements get the category of the next categorizable statement
+            for (let i = 0; i < statements.length; i++) {
+                const stmt = statements[i];
+                let sortKey;
+
+                if (isCategorizableStatement(stmt)) {
+                    sortKey = categoryMap.get(stmt);
+                } else {
+                    // Find the next categorizable statement's category
+                    sortKey = ORDER.RETURN; // Default to RETURN if none found
+
+                    for (let j = i + 1; j < statements.length; j++) {
+                        if (isCategorizableStatement(statements[j])) {
+                            sortKey = categoryMap.get(statements[j]);
 
-                // Maintain original order within the same category
+                            break;
+                        }
+                    }
+                }
+
+                allStatementsWithSortKeys.push({
+                    index: i,
+                    sortKey,
+                    statement: stmt,
+                });
+            }
+
+            // Sort all statements by sort key (stable sort - maintains relative order within same key)
+            const sortedStatements = [...allStatementsWithSortKeys].sort((a, b) => {
+                if (a.sortKey !== b.sortKey) {
+                    return a.sortKey - b.sortKey;
+                }
+
+                // Maintain original order within the same sort key
                 return a.index - b.index;
             });
 
             // Check if sorting actually changes the order
-            const orderChanged = sortedStatements.some((s, i) => s.index !== statementsWithCategories[i].index);
+            const orderChanged = sortedStatements.some((s, i) => s.index !== i);
 
             if (!orderChanged) return;
 
             // Build the fix
             const fixHandler = (fixer) => {
                 // Get the base indentation from the first statement
-                const firstStatementLine = sourceCode.lines[relevantStatements[0].loc.start.line - 1];
+                const firstStatementLine = sourceCode.lines[statements[0].loc.start.line - 1];
                 const baseIndent = firstStatementLine.match(/^\s*/)[0];
 
-                // Get statement text with its leading comments
-                const getStatementTextWithCommentsHandler = (stmt, stmtIndex) => {
-                    // Find the previous statement to determine comment boundaries
-                    const prevStmtIndex = relevantStatements.findIndex((s) => s === stmt) - 1;
-                    const prevStmt = prevStmtIndex >= 0 ? relevantStatements[prevStmtIndex] : null;
-                    const prevEnd = prevStmt ? prevStmt.range[1] : sourceCode.getFirstToken(body).range[1];
-
-                    // Get text from after previous statement to end of current statement
-                    // This includes leading whitespace and comments
-                    const fullText = sourceCode.text.slice(prevEnd, stmt.range[1]);
-
-                    // Trim leading newlines but keep indentation of the statement
-                    const trimmed = fullText.replace(/^\s*\n/, "");
-
-                    return trimmed;
-                };
-
                 // Build new body content
                 let newBodyContent = "";
-                let lastStatementCategory = null;
+                let lastSortKey = null;
 
                 for (let i = 0; i < sortedStatements.length; i++) {
-                    const { category, statement, index } = sortedStatements[i];
+                    const { sortKey, statement } = sortedStatements[i];
 
                     // Add blank line between different categories (except UNKNOWN)
-                    if (lastStatementCategory !== null && category !== ORDER.UNKNOWN && lastStatementCategory !== ORDER.UNKNOWN && category !== lastStatementCategory) {
+                    if (lastSortKey !== null && sortKey !== ORDER.UNKNOWN && lastSortKey !== ORDER.UNKNOWN && sortKey !== lastSortKey) {
                         newBodyContent += "\n";
                     }
 
@@ -13992,12 +14056,12 @@ const reactCodeOrder = {
 
                     newBodyContent += baseIndent + stmtText.trim() + "\n";
 
-                    lastStatementCategory = category;
+                    lastSortKey = sortKey;
                 }
 
-                // Find the range to replace
-                const firstStmt = relevantStatements[0];
-                const lastStmt = relevantStatements[relevantStatements.length - 1];
+                // Find the range to replace (all statements)
+                const firstStmt = statements[0];
+                const lastStmt = statements[statements.length - 1];
 
                 return fixer.replaceTextRange([firstStmt.range[0], lastStmt.range[1]], newBodyContent.trimEnd());
             };

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "eslint-plugin-code-style",
-    "version": "1.3.9",
+    "version": "1.3.10",
     "description": "A custom ESLint plugin for enforcing consistent code formatting and style rules in React/JSX projects",
     "main": "index.js",
     "types": "index.d.ts",