@blumintinc/eslint-plugin-blumint 1.19.32 → 1.20.0

package/README.md

@@ -196,6 +196,7 @@ full closed loop is documented in agora's `.claude/skills/eslint-autonomy/SKILL.
 | [no-redundant-param-types](docs/rules/no-redundant-param-types.md)                                           | Disallow redundant parameter type annotations                                                                                                                                                                                                                                                                                                                                                    | ✅  |    |    | 🔧 |    |    |
 | [no-redundant-this-params](docs/rules/no-redundant-this-params.md)                                           | Disallow passing class instance members (this.foo) into class instance methods; access the member from this inside the method instead.                                                                                                                                                                                                                                                           | ✅  |    |    |    |    |    |
 | [no-redundant-usecallback-wrapper](docs/rules/no-redundant-usecallback-wrapper.md)                           | Prevent wrapping already memoized/stable callbacks from hooks/contexts in an extra useCallback()                                                                                                                                                                                                                                                                                                 | ✅  |    |    | 🔧 |    |    |
+| [no-render-function-components](docs/rules/no-render-function-components.md)                                 | Disallow declaring a local `render*` function that returns JSX and consuming it as a plain function (direct call or array-iteration callback); author it as a real component rendered with JSX instead                                                                                                                                                                                           | ✅  |    |    |    |    |    |
 | [no-res-error-status-in-onrequest](docs/rules/no-res-error-status-in-onrequest.md)                           | Forbid sending 4xx/5xx Express responses inside onRequest handlers; throw structured HttpsError instances instead so the wrapper can format, log, and map errors consistently.                                                                                                                                                                                                                   | ✅  |    |    |    |    |    |
 | [no-restricted-properties-fix](docs/rules/no-restricted-properties-fix.md)                                   | Disallow certain properties on certain objects, with special handling for Object.keys() and Object.values()                                                                                                                                                                                                                                                                                      |    |    |    | 🔧 |    |    |
 | [no-satisfies-in-frontend-bundle](docs/rules/no-satisfies-in-frontend-bundle.md)                             | Disallow the `satisfies` operator in files that reach the frontend webpack bundle (Next.js 12 SWC cannot parse it)                                                                                                                                                                                                                                                                               | ✅  |    |    |    |    |    |

package/lib/index.js

@@ -196,6 +196,7 @@ const no_single_dismiss_dialog_button_1 = require("./rules/no-single-dismiss-dia
 const no_portal_inside_tooltip_1 = require("./rules/no-portal-inside-tooltip");
 const no_satisfies_in_frontend_bundle_1 = require("./rules/no-satisfies-in-frontend-bundle");
 const prefer_utility_function_own_file_1 = require("./rules/prefer-utility-function-own-file");
+const no_render_function_components_1 = require("./rules/no-render-function-components");
 const NO_FRONTEND_IMPORTS_FROM_FUNCTIONS_MESSAGE = 'Backend Cloud Functions (.f.ts under functions/) must not import frontend modules from the repo root src/**. Frontend code can depend on browser-only APIs and bundling it into Cloud Functions breaks server execution; move shared logic into functions/src or a shared package.';
 function noFrontendImportsFromFunctionsPatterns(pattern) {
     return [
@@ -222,7 +223,7 @@ function noFrontendImportsFromFunctionsPatterns(pattern) {
 module.exports = {
     meta: {
         name: '@blumintinc/eslint-plugin-blumint',
-        version: '1.19.32',
+        version: '1.20.0',
     },
     parseOptions: {
         ecmaVersion: 2020,
@@ -424,6 +425,7 @@ module.exports = {
                 '@blumintinc/blumint/no-portal-inside-tooltip': 'error',
                 '@blumintinc/blumint/no-satisfies-in-frontend-bundle': 'error',
                 '@blumintinc/blumint/prefer-utility-function-own-file': 'error',
+                '@blumintinc/blumint/no-render-function-components': 'error',
             },
             /**
              * Depth-specific overrides block only import strings that traverse to the
@@ -700,6 +702,7 @@ module.exports = {
         'no-portal-inside-tooltip': no_portal_inside_tooltip_1.noPortalInsideTooltip,
         'no-satisfies-in-frontend-bundle': no_satisfies_in_frontend_bundle_1.noSatisfiesInFrontendBundle,
         'prefer-utility-function-own-file': prefer_utility_function_own_file_1.preferUtilityFunctionOwnFile,
+        'no-render-function-components': no_render_function_components_1.noRenderFunctionComponents,
     },
 };
 //# sourceMappingURL=index.js.map

package/lib/rules/no-render-function-components.d.ts

@@ -0,0 +1,8 @@
+import { TSESLint } from '@typescript-eslint/utils';
+type RuleOptions = {
+    renderPropNames?: string[];
+    allowNames?: string[];
+};
+type Options = [RuleOptions?];
+export declare const noRenderFunctionComponents: TSESLint.RuleModule<"renderFunctionComponent", Options, TSESLint.RuleListener>;
+export {};

package/lib/rules/no-render-function-components.js

@@ -0,0 +1,269 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.noRenderFunctionComponents = void 0;
+const utils_1 = require("@typescript-eslint/utils");
+const createRule_1 = require("../utils/createRule");
+const ASTHelpers_1 = require("../utils/ASTHelpers");
+/**
+ * Slot names that legitimately consume a `render*` callback BY REFERENCE.
+ * These belong to external libraries (MUI DataGrid `renderCell`, Autocomplete
+ * `renderInput`/`renderOption`, Algolia widgets' `render`, etc.) that invoke the
+ * callback themselves. Passing a function into one of these slots is NOT the
+ * anti-pattern this rule targets, so those wirings are exempt. The list is
+ * always applied; user-provided `renderPropNames` are added to (not replaced),
+ * so custom library slots can be exempted without losing the defaults.
+ */
+const DEFAULT_RENDER_PROP_NAMES = [
+    'renderCell',
+    'renderHeader',
+    'renderValue',
+    'renderInput',
+    'renderOption',
+    'renderTags',
+    'renderGroup',
+    'render',
+];
+/**
+ * Array iteration methods that accept a callback. Passing a `render*` function
+ * BY REFERENCE into one of these (e.g. `items.map(renderItem)`) consumes it as a
+ * plain function, which is the anti-pattern: the returned JSX is inlined instead
+ * of mounting as its own component.
+ */
+const ARRAY_ITERATION_METHODS = new Set([
+    'map',
+    'flatMap',
+    'forEach',
+    'reduce',
+    'reduceRight',
+    'filter',
+    'find',
+    'findIndex',
+    'findLast',
+    'findLastIndex',
+    'some',
+    'every',
+]);
+// Literal `render` prefix followed by an uppercase letter. Deliberately excludes
+// bare `render`, `renderer`/`rendered` (lowercase continuation), PascalCase
+// `Render*` (require-memo's domain), and `useRender*` hooks (no-jsx-in-hooks').
+const RENDER_FN_NAME = /^render[A-Z]/;
+function isFunctionLikeInit(node) {
+    return (node.type === utils_1.AST_NODE_TYPES.ArrowFunctionExpression ||
+        node.type === utils_1.AST_NODE_TYPES.FunctionExpression);
+}
+function getJsxAttributeName(name) {
+    if (name.type === utils_1.AST_NODE_TYPES.JSXIdentifier) {
+        return name.name;
+    }
+    return null;
+}
+exports.noRenderFunctionComponents = (0, createRule_1.createRule)({
+    name: 'no-render-function-components',
+    meta: {
+        type: 'problem',
+        docs: {
+            description: 'Disallow declaring a local `render*` function that returns JSX and consuming it as a plain function (direct call or array-iteration callback); author it as a real component rendered with JSX instead',
+            recommended: 'error',
+        },
+        schema: [
+            {
+                type: 'object',
+                properties: {
+                    renderPropNames: {
+                        type: 'array',
+                        items: { type: 'string' },
+                    },
+                    allowNames: {
+                        type: 'array',
+                        items: { type: 'string' },
+                    },
+                },
+                additionalProperties: false,
+            },
+        ],
+        messages: {
+            renderFunctionComponent: 'Local function "{{name}}" returns JSX and is consumed as a plain function (called directly or passed to an array method like .map). ' +
+                'A function that takes inputs and returns JSX IS a React component, so it should be a PascalCase functional component rendered as JSX (e.g. <{{suggestion}} {...props} />), not invoked like a helper. ' +
+                'Calling it directly forfeits React reconciliation and key semantics, isolated hook scope, a memoization boundary, and DevTools visibility — the elements are inlined into the parent instead of mounting as their own component. ' +
+                'Extract "{{name}}" into a real component named "{{suggestion}}" and render it with JSX.',
+        },
+    },
+    defaultOptions: [{}],
+    create(context, [options]) {
+        const userRenderPropNames = options?.renderPropNames ?? [];
+        const renderPropNames = new Set([
+            ...DEFAULT_RENDER_PROP_NAMES,
+            ...userRenderPropNames,
+        ]);
+        const allowNamePatterns = (options?.allowNames ?? []).map((pattern) => new RegExp(pattern));
+        const candidates = [];
+        function isAllowed(name) {
+            return allowNamePatterns.some((pattern) => pattern.test(name));
+        }
+        function findVariable(node, name) {
+            const declared = ASTHelpers_1.ASTHelpers.getDeclaredVariables(context, node);
+            return declared.find((variable) => variable.name === name) ?? null;
+        }
+        // A plain function invocation: renderFoo(...) where the identifier is the callee.
+        function isDirectCall(id) {
+            const parent = id.parent;
+            return (!!parent &&
+                parent.type === utils_1.AST_NODE_TYPES.CallExpression &&
+                parent.callee === id);
+        }
+        // A by-reference pass into an array-iteration method: arr.map(renderFoo).
+        function isArrayIterationPass(id) {
+            const parent = id.parent;
+            if (!parent || parent.type !== utils_1.AST_NODE_TYPES.CallExpression) {
+                return false;
+            }
+            if (!parent.arguments.includes(id)) {
+                return false;
+            }
+            const callee = parent.callee;
+            if (callee.type !== utils_1.AST_NODE_TYPES.MemberExpression ||
+                callee.computed ||
+                callee.property.type !== utils_1.AST_NODE_TYPES.Identifier) {
+                return false;
+            }
+            return ARRAY_ITERATION_METHODS.has(callee.property.name);
+        }
+        // A by-reference pass into a render-prop slot: <X renderCell={renderFoo} />
+        // or { renderCell: renderFoo }. The exemption anchors on the slot name, not
+        // the function's own name.
+        function isRenderPropSlotReference(id) {
+            const parent = id.parent;
+            if (!parent) {
+                return false;
+            }
+            if (parent.type === utils_1.AST_NODE_TYPES.JSXExpressionContainer) {
+                const attribute = parent.parent;
+                if (attribute &&
+                    attribute.type === utils_1.AST_NODE_TYPES.JSXAttribute &&
+                    attribute.value === parent) {
+                    const attrName = getJsxAttributeName(attribute.name);
+                    if (attrName && renderPropNames.has(attrName)) {
+                        return true;
+                    }
+                }
+            }
+            if (parent.type === utils_1.AST_NODE_TYPES.Property && parent.value === id) {
+                const key = parent.key;
+                let keyName = null;
+                if (!parent.computed && key.type === utils_1.AST_NODE_TYPES.Identifier) {
+                    keyName = key.name;
+                }
+                else if (key.type === utils_1.AST_NODE_TYPES.Literal &&
+                    typeof key.value === 'string') {
+                    keyName = key.value;
+                }
+                if (keyName && renderPropNames.has(keyName)) {
+                    return true;
+                }
+            }
+            return false;
+        }
+        function isExportSpecifierReference(id) {
+            const parent = id.parent;
+            return !!parent && parent.type === utils_1.AST_NODE_TYPES.ExportSpecifier;
+        }
+        return {
+            VariableDeclarator(node) {
+                if (node.id.type !== utils_1.AST_NODE_TYPES.Identifier) {
+                    return;
+                }
+                const name = node.id.name;
+                if (!RENDER_FN_NAME.test(name) || isAllowed(name)) {
+                    return;
+                }
+                if (!node.init) {
+                    return;
+                }
+                const init = ASTHelpers_1.ASTHelpers.unwrapTSAssertions(node.init);
+                if (!isFunctionLikeInit(init)) {
+                    return;
+                }
+                if (!ASTHelpers_1.ASTHelpers.returnsJSX(init, context)) {
+                    return;
+                }
+                const declaration = node.parent;
+                const isExported = !!declaration &&
+                    declaration.type === utils_1.AST_NODE_TYPES.VariableDeclaration &&
+                    !!declaration.parent &&
+                    (declaration.parent.type === utils_1.AST_NODE_TYPES.ExportNamedDeclaration ||
+                        declaration.parent.type ===
+                            utils_1.AST_NODE_TYPES.ExportDefaultDeclaration);
+                candidates.push({
+                    name,
+                    reportNode: node.id,
+                    variable: findVariable(node, name),
+                    isExported,
+                });
+            },
+            FunctionDeclaration(node) {
+                if (!node.id) {
+                    return;
+                }
+                const name = node.id.name;
+                if (!RENDER_FN_NAME.test(name) || isAllowed(name)) {
+                    return;
+                }
+                if (!ASTHelpers_1.ASTHelpers.returnsJSX(node, context)) {
+                    return;
+                }
+                const isExported = !!node.parent &&
+                    (node.parent.type === utils_1.AST_NODE_TYPES.ExportNamedDeclaration ||
+                        node.parent.type === utils_1.AST_NODE_TYPES.ExportDefaultDeclaration);
+                candidates.push({
+                    name,
+                    reportNode: node.id,
+                    variable: findVariable(node, name),
+                    isExported,
+                });
+            },
+            'Program:exit'() {
+                for (const candidate of candidates) {
+                    const references = candidate.variable
+                        ? candidate.variable.references
+                        : [];
+                    let hasViolatingConsumption = false;
+                    let isWiredToSlot = false;
+                    let exportedViaSpecifier = false;
+                    for (const reference of references) {
+                        // Skip the declaration write and any reassignments — only reads are
+                        // consumption sites.
+                        if (typeof reference.isRead === 'function' && !reference.isRead()) {
+                            continue;
+                        }
+                        const id = reference.identifier;
+                        if (isDirectCall(id) || isArrayIterationPass(id)) {
+                            hasViolatingConsumption = true;
+                            continue;
+                        }
+                        if (isRenderPropSlotReference(id)) {
+                            isWiredToSlot = true;
+                            continue;
+                        }
+                        if (isExportSpecifierReference(id)) {
+                            exportedViaSpecifier = true;
+                            continue;
+                        }
+                    }
+                    const isExported = candidate.isExported || exportedViaSpecifier;
+                    const shouldFlag = hasViolatingConsumption || (isExported && !isWiredToSlot);
+                    if (shouldFlag) {
+                        context.report({
+                            node: candidate.reportNode,
+                            messageId: 'renderFunctionComponent',
+                            data: {
+                                name: candidate.name,
+                                suggestion: candidate.name.slice('render'.length),
+                            },
+                        });
+                    }
+                }
+            },
+        };
+    },
+});
+//# sourceMappingURL=no-render-function-components.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@blumintinc/eslint-plugin-blumint",
-  "version": "1.19.32",
+  "version": "1.20.0",
   "description": "Custom eslint rules for use within BluMint",
   "author": {
     "name": "Brodie McGuire",

package/release-manifest.json

@@ -1,4 +1,18 @@
 [
+  {
+    "version": "1.20.0",
+    "date": "2026-07-24T15:36:40.953Z",
+    "rules": [
+      {
+        "name": "no-render-function-components",
+        "changeType": "feat",
+        "issues": [
+          1345
+        ],
+        "summary": "flag render* functions returning JSX consumed as plain calls (closes #1345)"
+      }
+    ]
+  },
   {
     "version": "1.19.32",
     "date": "2026-07-24T00:36:05.744Z",