@singlepixellab/eslint-config 2.1.0 → 2.2.1

package/README.md

@@ -6,6 +6,7 @@ The ESLint rules and configs used by Single Pixel Lab.
 
 - Node.js ≥ 18
 - ESLint ≥ 9
+- TypeScript ≥ 3.3.1
 
 ## Usage
 
@@ -40,15 +41,16 @@ export default [...styles, ...react];
 
 Available modules:
 
-| Module   | Import                                   | Description                    |
-| -------- | ---------------------------------------- | ------------------------------ |
-| Core     | `@singlepixellab/eslint-config/core`     | Base ESLint rules              |
-| Ignore   | `@singlepixellab/eslint-config/ignores`  | Default ignore patterns        |
-| Import   | `@singlepixellab/eslint-config/imports`  | Import ordering and validation |
-| JSDoc    | `@singlepixellab/eslint-config/jsdoc`    | JSDoc linting                  |
-| Prettier | `@singlepixellab/eslint-config/prettier` | Prettier integration           |
-| React    | `@singlepixellab/eslint-config/react`    | React and Hooks rules          |
-| Style    | `@singlepixellab/eslint-config/styles`   | Stylistic rules                |
+| Module     | Import                                     | Description                    |
+| ---------- | ------------------------------------------ | ------------------------------ |
+| Core       | `@singlepixellab/eslint-config/core`       | Base ESLint rules              |
+| Ignore     | `@singlepixellab/eslint-config/ignores`    | Default ignore patterns        |
+| Import     | `@singlepixellab/eslint-config/imports`    | Import ordering and validation |
+| JSDoc      | `@singlepixellab/eslint-config/jsdoc`      | JSDoc linting                  |
+| Prettier   | `@singlepixellab/eslint-config/prettier`   | Prettier integration           |
+| React      | `@singlepixellab/eslint-config/react`      | React and Hooks rules          |
+| Style      | `@singlepixellab/eslint-config/styles`     | Stylistic rules                |
+| TypeScript | `@singlepixellab/eslint-config/typescript` | TypeScript linting             |
 
 ### Named exports
 

package/eslint.config.js

@@ -5,12 +5,15 @@ import react from "./rules/react.js";
 import prettier from "./rules/prettier.js";
 import jsdoc from "./rules/jsdoc.js";
 import styles from "./rules/styles.js";
+import typescript from "./rules/typescript.js";
 
 /** @type {import('eslint').Linter.Config[]} */
 export default [
   // Global ignores should always be first
   ...ignores,
 
+  ...core,
+
   // eslint-plugin-import
   ...imports,
 
@@ -20,7 +23,8 @@ export default [
   // eslint-plugin-react, eslint-plugin-react-hooks etc
   ...react,
 
-  ...core,
+  // @typescript-eslint
+  ...typescript,
 
   // styles: @stylistic/eslint-plugin
   ...styles,

package/index.js

@@ -9,3 +9,4 @@ export { default as jsdocConfig } from "./rules/jsdoc.js";
 export { default as prettierConfig } from "./rules/prettier.js";
 export { default as reactConfig } from "./rules/react.js";
 export { default as stylesConfig } from "./rules/styles.js";
+export { default as typescriptConfig } from "./rules/typescript.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@singlepixellab/eslint-config",
-  "version": "2.1.0",
+  "version": "2.2.1",
   "description": "The ESLint rules and configs used by Single Pixel Lab",
   "author": "Single Pixel Lab",
   "keywords": [
@@ -50,13 +50,17 @@
     },
     "./styles": {
       "import": "./rules/styles.js"
+    },
+    "./typescript": {
+      "import": "./rules/typescript.js"
     }
   },
   "engines": {
     "node": ">=18"
   },
   "peerDependencies": {
-    "eslint": ">= 9"
+    "eslint": ">= 9",
+    "typescript": ">=3.3.1"
   },
   "scripts": {
     "format": "prettier --cache --write .",
@@ -73,12 +77,14 @@
     "@eslint/js": "^9.39.4",
     "@stylistic/eslint-plugin": "^5.10.0",
     "eslint-config-prettier": "^10.1.8",
+    "eslint-import-resolver-typescript": "^4.4.4",
     "eslint-plugin-import": "^2.32.0",
     "eslint-plugin-jsdoc": "^62.7.1",
     "eslint-plugin-jsx-a11y": "^6.10.2",
     "eslint-plugin-prettier": "^5.5.5",
     "eslint-plugin-react": "^7.37.5",
     "eslint-plugin-react-hooks": "^7.0.1",
-    "globals": "^17.4.0"
+    "globals": "^17.4.0",
+    "typescript-eslint": "^8.58.2"
   }
 }

package/rules/core.js

@@ -8,8 +8,8 @@ export default [
     ...js.configs.recommended,
   },
   {
-    name: "spl/base",
-    files: ["**/*.{js,mjs,cjs}"],
+    name: "spl/core",
+    files: ["**/*.{js,mjs,cjs,ts,tsx,mts,cts}"],
     languageOptions: {
       ecmaVersion: "latest",
       sourceType: "module",

package/rules/ignores.js

@@ -12,6 +12,7 @@ export default [
       "**/public/build/**",
       "**/dist/**",
       "**/coverage/**",
+      "next-env.d.ts",
 
       // Prismic auto-generated files
       "customtypes",

package/rules/imports.js

@@ -5,7 +5,20 @@ export default [
   importPlugin.flatConfigs.recommended,
   {
     name: "spl/imports",
-    files: ["**/*.{js,mjs,cjs}"],
+    files: ["**/*.{js,mjs,cjs,ts,tsx,mts,cts}"],
+    settings: {
+      "import/parsers": {
+        "@typescript-eslint/parser": [".ts", ".mts", ".cts", ".tsx", ".d.ts"],
+      },
+      "import/resolver": {
+        node: {
+          extensions: [".js", ".jsx", ".ts", ".tsx", ".d.ts"],
+        },
+        typescript: {
+          alwaysTryTypes: true,
+        },
+      },
+    },
     rules: {
       // Ensures imports point to a file/module that exists, prevents broken
       // imports
@@ -55,8 +68,34 @@ export default [
       "import/order": [
         "error",
         {
-          groups: [
-            ["builtin", "external", "internal", "parent", "sibling", "index"],
+          "alphabetize": {
+            order: "asc",
+            caseInsensitive: true,
+          },
+          "distinctGroup": false,
+          "newlines-between": "always",
+          "named": {
+            enabled: true,
+            types: "types-last",
+          },
+          "sortTypesGroup": true,
+          "pathGroups": [
+            {
+              pattern: "~*/**",
+              group: "external",
+              position: "after",
+            },
+          ],
+          "groups": [
+            [
+              "builtin",
+              "external",
+              "internal",
+              "parent",
+              "sibling",
+              "index",
+              "type",
+            ],
           ],
         },
       ],

package/rules/react.js

@@ -6,7 +6,7 @@ import reactHooks from "eslint-plugin-react-hooks";
 export default [
   {
     name: "spl/react",
-    files: ["**/*.js"],
+    files: ["**/*.{js,tsx}"],
     settings: {
       react: {
         version: "detect",
@@ -64,9 +64,11 @@ export default [
       // Enforce or disallow spaces around equal sign
       "react/jsx-equals-spacing": "off",
 
-      // No jsx extension
-      // https://github.com/facebook/create-react-app/issues/87#issuecomment-234627904
-      "react/jsx-filename-extension": ["error", { extensions: [".js"] }],
+      // Restrict file extensions that may contain JSX
+      "react/jsx-filename-extension": [
+        "error",
+        { extensions: [".js", ".tsx"] },
+      ],
 
       // Enforce shorthand or standard form for React fragments
       "react/jsx-fragments": ["warn", "syntax"],
@@ -169,7 +171,7 @@ export default [
         "error",
         {
           "elements": ["img", "object", "area", 'input[type="image"]'],
-          "img": [],
+          "img": ["Image"],
           "object": [],
           "area": [],
           'input[type="image"]': [],

package/rules/typescript.js

@@ -0,0 +1,38 @@
+import tsEslint from "typescript-eslint";
+
+/** @type {import('eslint').Linter.Config[]} */
+export default [
+  ...tsEslint.configs.recommended,
+  ...tsEslint.configs.stylistic,
+  {
+    name: "spl/typescript",
+    files: ["**/*.{ts,tsx,mts,cts}"],
+    plugins: {
+      "@typescript-eslint": tsEslint.plugin,
+    },
+    languageOptions: {
+      parser: tsEslint.parser,
+      parserOptions: {
+        ecmaFeatures: {
+          jsx: true,
+        },
+      },
+    },
+    rules: {
+      // Ensure that all explicitly declared properties are actually used
+      "no-unused-vars": "off",
+      "@typescript-eslint/no-unused-vars": [
+        "error",
+        {
+          args: "all",
+          argsIgnorePattern: "^_",
+          caughtErrors: "all",
+          caughtErrorsIgnorePattern: "^_",
+          destructuredArrayIgnorePattern: "^_",
+          varsIgnorePattern: "^_",
+          ignoreRestSiblings: true,
+        },
+      ],
+    },
+  },
+];