@singlepixellab/eslint-config 2.0.1 → 2.2.0

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.0.1",
+  "version": "2.2.0",
   "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 .",
@@ -79,6 +83,7 @@
     "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

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",
@@ -169,7 +169,7 @@ export default [
         "error",
         {
           "elements": ["img", "object", "area", 'input[type="image"]'],
-          "img": [],
+          "img": ["Image"],
           "object": [],
           "area": [],
           'input[type="image"]': [],
@@ -273,7 +273,7 @@ export default [
           labelComponents: [],
           labelAttributes: [],
           controlComponents: [],
-          assert: "both",
+          assert: "either",
           depth: 25,
         },
       ],
@@ -382,6 +382,8 @@ export default [
         "error",
         {
           nav: ["navigation"],
+          ul: ["list"],
+          ol: ["list"],
         },
       ],
 

package/rules/styles.js

@@ -175,9 +175,6 @@ export default [
       // Enforce PascalCase for user-defined JSX components
       "@stylistic/jsx-pascal-case": "warn",
 
-      // Disallow multiple spaces between inline JSX props
-      "@stylistic/jsx-props-no-multi-spaces": "warn",
-
       // Enforce the consistent use of either double or single quotes in JSX
       // attributes
       "@stylistic/jsx-quotes": ["warn", "prefer-double"],

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
+        },
+      ],
+    },
+  },
+];