Refactor tsl-rules-of-react rules

Author: Rel1cx

package.json

@@ -38,10 +38,16 @@
     "@tsconfig/node24": "^24.0.4",
     "@tsconfig/strictest": "^2.0.8",
     "@types/node": "^25.2.3",
+    "@types/react": "^19.2.14",
+    "@types/react-dom": "^19.2.3",
     "ansis": "^4.2.0",
+    "dedent": "^1.7.1",
     "dprint": "^0.51.1",
-    "effect": "^3.19.17",
+    "effect": "^3.19.18",
+    "preact": "^10.28.3",
     "publint": "^0.3.17",
+    "react": "^19.2.4",
+    "react-dom": "^19.2.4",
     "sort-package-json": "^3.6.1",
     "tinyglobby": "^0.2.15",
     "ts-pattern": "^5.9.0",
@@ -55,7 +61,7 @@
     "typescript": "^5.9.3",
     "vitest": "^4.0.18"
   },
-  "packageManager": "pnpm@10.29.3",
+  "packageManager": "pnpm@10.30.0",
   "engines": {
     "node": ">=24.0.0"
   }

packages/eslint-plugin-function/package.json

@@ -36,14 +36,14 @@
   "dependencies": {
     "@eslint-react/ast": "^2.13.0",
     "@eslint-react/shared": "^2.13.0",
-    "@typescript-eslint/scope-manager": "^8.55.0",
-    "@typescript-eslint/type-utils": "^8.55.0",
-    "@typescript-eslint/types": "^8.55.0",
-    "@typescript-eslint/utils": "^8.55.0",
+    "@typescript-eslint/scope-manager": "^8.56.0",
+    "@typescript-eslint/type-utils": "^8.56.0",
+    "@typescript-eslint/types": "^8.56.0",
+    "@typescript-eslint/utils": "^8.56.0",
     "string-ts": "^2.3.1",
     "ts-api-utils": "^2.4.0",
     "ts-pattern": "^5.9.0",
-    "typescript-eslint": "^8.55.0"
+    "typescript-eslint": "^8.56.0"
   },
   "devDependencies": {
     "@local/eff": "workspace:*",

packages/tsl-rules-of-react/docs/README.md

@@ -4,7 +4,6 @@
 
 | Variable | Description |
 | ------ | ------ |
-| [rulesOfComponentHookFactories](variables/rulesOfComponentHookFactories.md) | - |
 | [rulesOfEffect](variables/rulesOfEffect.md) | - |
 | [rulesOfJsx](variables/rulesOfJsx.md) | TS checks for most of the issues described at https://react.dev/learn/writing-markup-with-jsx#the-rules-of-jsx by default, so there isn't much for us to implement. |
 | [rulesOfKeys](variables/rulesOfKeys.md) | - |

packages/tsl-rules-of-react/docs/variables/rulesOfComponentHookFactories.md

@@ -15,7 +15,3 @@ const rulesOfProps: (options?: "off") => Rule<unknown>;
 ## Returns
 
 `Rule`\<`unknown`\>
-
-## Todo
-
-implement this

packages/tsl-rules-of-react/docs/variables/rulesOfProps.md

@@ -1,4 +1,3 @@
-export { rulesOfComponentHookFactories } from "./rules/rules-of-component-hook-factories";
 export { rulesOfEffect } from "./rules/rules-of-effect";
 export { rulesOfJsx } from "./rules/rules-of-jsx";
 export { rulesOfKeys } from "./rules/rules-of-keys";

packages/tsl-rules-of-react/src/index.ts

@@ -1,224 +1,14 @@
-import tsx from "dedent";
 import { ruleTester } from "tsl/ruleTester";
-import ts from "typescript";
 import { expect, test } from "vitest";
 
-import { messages, rulesOfKeys } from "./rules-of-keys";
+import { rulesOfKeys } from "./rules-of-keys";
 
 test("rules-of-keys", () => {
   const ret = ruleTester({
     tsx: true,
     ruleFn: rulesOfKeys,
-    invalid: [
-      {
-        code: tsx`
-          function Component({ data }: { data: { key: string; name: string } }) {
-            return <div {...data} />;
-          }
-        `,
-        compilerOptions: {
-          jsx: ts.JsxEmit.ReactJSX,
-        },
-        errors: [
-          { message: messages[4] },
-        ],
-      },
-      {
-        code: tsx`
-          interface Props { key: string; value: number }
-          function Component({ props }: { props: Props }) {
-            return <div {...props} />;
-          }
-        `,
-        compilerOptions: {
-          jsx: ts.JsxEmit.ReactJSX,
-        },
-        errors: [
-          { message: messages[4] },
-        ],
-      },
-      {
-        code: tsx`
-          function Component({ item }: { item: { key: number; id: string } }) {
-            return <div {...item} {...item} />;
-          }
-        `,
-        compilerOptions: {
-          jsx: ts.JsxEmit.ReactJSX,
-        },
-        errors: [
-          { message: messages[4] },
-          { message: messages[4] },
-        ],
-      },
-      {
-        code: tsx`
-          function Component({ props }) {
-            return <div {...props} key="id" />;
-          }
-        `,
-        compilerOptions: {
-          jsx: ts.JsxEmit.ReactJSX,
-        },
-        errors: [
-          { message: messages[3] },
-        ],
-      },
-      {
-        code: tsx`
-          function Component({ props1, props2 }) {
-            return <div {...props1} {...props2} key="id" />;
-          }
-        `,
-        compilerOptions: {
-          jsx: ts.JsxEmit.ReactJSX,
-        },
-        errors: [
-          { message: messages[3] },
-          { message: messages[3] },
-        ],
-      },
-      {
-        code: tsx`
-          function Component({ props }) {
-            return <div className="test" {...props} key="id" />;
-          }
-        `,
-        compilerOptions: {
-          jsx: ts.JsxEmit.ReactJSX,
-        },
-        errors: [
-          { message: messages[3] },
-        ],
-      },
-      {
-        code: tsx`
-          function Component({ props }) {
-            return <div {...props} key="id" className="test" />;
-          }
-        `,
-        compilerOptions: {
-          jsx: ts.JsxEmit.ReactJSX,
-        },
-        errors: [
-          { message: messages[3] },
-        ],
-      },
-    ],
-    valid: [
-      {
-        code: tsx`
-          function Component({ props }) {
-            return <div key="id" {...props} />;
-          }
-        `,
-        compilerOptions: {
-          jsx: ts.JsxEmit.ReactJSX,
-        },
-      },
-      {
-        code: tsx`
-          function Component() {
-            return <div key="id" />;
-          }
-        `,
-        compilerOptions: {
-          jsx: ts.JsxEmit.ReactJSX,
-        },
-      },
-      {
-        code: tsx`
-          function Component({ props }) {
-            return <div {...props} />;
-          }
-        `,
-        compilerOptions: {
-          jsx: ts.JsxEmit.ReactJSX,
-        },
-      },
-      {
-        code: tsx`
-          function Component({ props }) {
-            return <div key="id" key="id2" {...props} />;
-          }
-        `,
-        compilerOptions: {
-          jsx: ts.JsxEmit.ReactJSX,
-        },
-      },
-      {
-        code: tsx`
-          function Component({ props }) {
-            return <div className="test" {...props} />;
-          }
-        `,
-        compilerOptions: {
-          jsx: ts.JsxEmit.ReactJSX,
-        },
-      },
-      {
-        code: tsx`
-          function Component({ props }) {
-            return <div {...props} key="id" />;
-          }
-        `,
-        compilerOptions: {
-          jsx: ts.JsxEmit.None,
-        },
-      },
-      {
-        code: tsx`
-          function Component({ props }) {
-            return <div {...props} key="id" />;
-          }
-        `,
-        compilerOptions: {
-          jsx: ts.JsxEmit.Preserve,
-        },
-      },
-      {
-        code: tsx`
-          function Component({ props }) {
-            return <div {...props} key="id" />;
-          }
-        `,
-        compilerOptions: {
-          jsx: ts.JsxEmit.ReactNative,
-        },
-      },
-      {
-        code: tsx`
-          import React from "react";
-          function Component({ attrs }: { attrs: React.Attributes }) {
-            return <div {...attrs} />;
-          }
-        `,
-        compilerOptions: {
-          jsx: ts.JsxEmit.ReactJSX,
-        },
-      },
-      {
-        code: tsx`
-          function Component({ data }: { data: { id: string; name: string } }) {
-            return <div {...data} />;
-          }
-        `,
-        compilerOptions: {
-          jsx: ts.JsxEmit.ReactJSX,
-        },
-      },
-      {
-        code: tsx`
-          interface Props { id: number; value: string }
-          function Component({ props }: { props: Props }) {
-            return <div {...props} />;
-          }
-        `,
-        compilerOptions: {
-          jsx: ts.JsxEmit.ReactJSX,
-        },
-      },
-    ],
+    invalid: [],
+    valid: [],
   });
   expect(ret).toBe(false);
 });