@wistia/eslint-config 0.9.3 → 0.10.0-beta.df1ef34b.0fb50bf

package/configs/eslint/default.js

@@ -3,11 +3,6 @@ require('@rushstack/eslint-patch/modern-module-resolution');
 module.exports = {
   parser: '@babel/eslint-parser',
 
-  env: {
-    es2022: true,
-    node: true,
-  },
-
   parserOptions: {
     sourceType: 'module',
     ecmaFeatures: {
@@ -17,6 +12,11 @@ module.exports = {
     ecmaVersion: 13,
   },
 
+  env: {
+    es2022: true,
+    node: true,
+  },
+
   extends: [
     '../../rules/eslint/best-practices',
     '../../rules/eslint/errors',

package/configs/eslint/react.js

@@ -5,8 +5,6 @@ module.exports = {
     browser: true,
   },
 
-  parser: '@babel/eslint-parser',
-
   extends: [
     '../../rules/eslint/react',
     '../../rules/eslint/react-a11y',

package/configs/eslint/typescript.js

@@ -0,0 +1,27 @@
+require('@rushstack/eslint-patch/modern-module-resolution');
+
+module.exports = {
+  parser: '@typescript-eslint/parser',
+
+  parserOptions: {
+    sourceType: 'module',
+    ecmaVersion: 13,
+  },
+
+  env: {
+    es2022: true,
+    node: true,
+  },
+
+  extends: [
+    '../../rules/eslint/best-practices',
+    '../../rules/eslint/errors',
+    '../../rules/eslint/es6',
+    '../../rules/eslint/node',
+    '../../rules/eslint/imports',
+    '../../rules/eslint/style',
+    '../../rules/eslint/variables',
+    '../../rules/eslint/typescript',
+    '../../rules/eslint/typescript-imports',
+  ].map(require.resolve),
+};

package/configs/stylelint/default.js

@@ -1,6 +1,6 @@
 module.exports = {
   plugins: ['stylelint-prettier'],
-  extends: ['stylelint-config-standard', 'stylelint-config-prettier'].map(require.resolve),
+  extends: ['stylelint-config-standard', 'stylelint-config-prettier'],
   rules: {
     // prettier configuration
     'prettier/prettier': true,

package/configs/stylelint/scss.js

@@ -1,10 +1,7 @@
 // see: https://github.com/stylelint-scss/stylelint-config-standard-scss/blob/main/index.js
 
 module.exports = {
-  plugins: ['stylelint-prettier', 'eslint-plugin-stylelint-scss'],
-  extends: ['stylelint-config-standard-scss', '../../rules/stylelint/scss'].map(require.resolve),
-  rules: {
-    // prettier configuration
-    'prettier/prettier': true,
-  },
+  plugins: ['stylelint-scss'],
+  extends: ['./default.js', 'stylelint-config-standard-scss', '../../rules/stylelint/scss'],
+  customSyntax: 'postcss-scss',
 };

package/configs/stylelint/styled-components.js

@@ -1,14 +1,12 @@
 module.exports = {
-  plugins: ['stylelint-prettier', 'stylelint-declaration-block-no-ignored-properties'],
+  plugins: ['stylelint-declaration-block-no-ignored-properties', 'stylelint-order'],
   extends: [
-    'stylelint-config-standard-scss',
+    './default.js',
+    'stylelint-config-styled-components',
     '../../rules/stylelint/styled-components',
-    'stylelint-config-prettier',
-  ].map(require.resolve),
-  customSyntax: 'postcss-scss',
-  processors: ['stylelint-processor-styled-components'],
+  ],
   rules: {
-    // prettier configuration
-    'prettier/prettier': true,
+    'order/properties-alphabetical-order': true,
   },
+  customSyntax: '@stylelint/postcss-css-in-js',
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wistia/eslint-config",
-  "version": "0.9.3",
+  "version": "0.10.0-beta.df1ef34b.0fb50bf",
   "description": "Wistia's ESLint configurations",
   "main": "react.js",
   "exports": {
@@ -15,7 +15,8 @@
     "./stylelint": "./configs/stylelint/default.js",
     "./stylelint/scss": "./configs/stylelint/scss.js",
     "./stylelint/styled-components": "./configs/stylelint/styled-components.js",
-    "./testing-library": "./configs/eslint/testing-library.js"
+    "./testing-library": "./configs/eslint/testing-library.js",
+    "./typescript": "./configs/eslint/typescript.js"
   },
   "scripts": {
     "lint": "eslint --fix .",
@@ -29,12 +30,13 @@
     "@babel/eslint-parser": "^7.18.9",
     "@babel/preset-react": "^7.18.6",
     "@rushstack/eslint-patch": "^1.1.4",
+    "@stylelint/postcss-css-in-js": "^0.38.0",
     "@typescript-eslint/eslint-plugin": "^5.30.7",
     "@typescript-eslint/parser": "^5.30.7",
     "confusing-browser-globals": "^1.0.11",
     "eslint": "^8.20.0",
     "eslint-config-prettier": "^8.5.0",
-    "eslint-plugin-better-styled-components": "^1.1.2",
+    "eslint-import-resolver-typescript": "^3.3.0",
     "eslint-plugin-cypress": "^2.12.1",
     "eslint-plugin-import": "^2.26.0",
     "eslint-plugin-jest": "^26.6.0",
@@ -49,14 +51,16 @@
     "eslint-plugin-testing-library": "^5.5.1",
     "postcss": "^8.4.14",
     "postcss-scss": "^4.0.4",
+    "postcss-syntax": "^0.36.2",
     "prettier": "^2.7.1",
     "stylelint": "^14.9.1",
     "stylelint-config-prettier": "^9.0.3",
     "stylelint-config-standard": "^26.0.0",
     "stylelint-config-standard-scss": "^5.0.0",
+    "stylelint-config-styled-components": "^0.1.1",
     "stylelint-declaration-block-no-ignored-properties": "^2.5.0",
+    "stylelint-order": "^5.0.0",
     "stylelint-prettier": "^2.0.0",
-    "stylelint-processor-styled-components": "^1.10.0",
     "stylelint-scss": "^4.3.0",
     "typescript": "^4.7.4"
   },

package/rules/eslint/imports.js

@@ -7,7 +7,7 @@ module.exports = {
         extensions: ['.js', '.mjs', '.cjs', '.json'],
       },
     },
-    'import/extensions': ['.js', '.jsx', '.mjs', '.cjs'],
+    'import/extensions': ['.js', '.jsx', '.ts', '.tsx', '.mjs', '.cjs'],
     'import/core-modules': [],
     'import/ignore': ['node_modules', '\\.(coffee|scss|css|less|svg|json)$'],
   },
@@ -128,6 +128,8 @@ module.exports = {
         js: 'never',
         mjs: 'never',
         jsx: 'never',
+        ts: 'never',
+        tsx: 'never',
       },
     ],
 

package/rules/eslint/react.js

@@ -346,7 +346,8 @@ module.exports = {
 
     // only .jsx files may have JSX
     // https://github.com/jsx-eslint/eslint-plugin-react/blob/master/docs/rules/jsx-filename-extension.md
-    'react/jsx-filename-extension': ['error', { extensions: ['.jsx'] }],
+    // decision: include typescript extensions to allow interop
+    'react/jsx-filename-extension': ['error', { extensions: ['.jsx', '.tsx'] }],
 
     // prevent accidental JS comments from being injected into JSX as text
     // https://github.com/jsx-eslint/eslint-plugin-react/blob/master/docs/rules/jsx-no-comment-textnodes.md
@@ -628,7 +629,7 @@ module.exports = {
   settings: {
     'import/resolver': {
       node: {
-        extensions: ['.js', '.jsx', '.json'],
+        extensions: ['.js', '.jsx', '.ts', '.tsx', '.json'],
       },
     },
     react: {

package/rules/eslint/styled-components.js

@@ -1,9 +1,8 @@
 // only add styled-components rules
-// see: https://github.com/tinloof/eslint-plugin-better-styled-components#supported-rules
 // see: https://github.com/brendanmorrell/eslint-plugin-styled-components-a11y
 
 module.exports = {
-  plugins: ['eslint-plugin-better-styled-components', 'eslint-plugin-styled-components-a11y'],
+  plugins: ['eslint-plugin-styled-components-a11y'],
 
   parserOptions: {
     ecmaFeatures: {
@@ -12,9 +11,6 @@ module.exports = {
   },
 
   rules: {
-    // sort styled-component properties alphabetically
-    'better-styled-components/sort-declarations-alphabetically': 'error',
-
     // plugin does not provide definitions
     'styled-components-a11y/accessible-emoji': 'error',
     'styled-components-a11y/alt-text': 'error',

package/rules/eslint/typescript-imports.js

@@ -0,0 +1,21 @@
+module.exports = {
+  plugins: ['import'],
+
+  rules: {
+    // turn on errors for missing imports
+    'import/no-unresolved': 'error',
+  },
+
+  settings: {
+    'import/parsers': {
+      '@typescript-eslint/parser': ['.ts', '.tsx'],
+    },
+
+    'import/resolver': {
+      typescript: {
+        // always try to resolve types under `<root>@types` directory even it doesn't contain any source code, like `@types/unist`
+        alwaysTryTypes: true,
+      },
+    },
+  },
+};

package/rules/eslint/typescript.js

@@ -0,0 +1,8 @@
+// only add typescript rules
+// see: https://typescript-eslint.io/rules/
+
+module.exports = {
+  plugins: ['@typescript-eslint'],
+
+  rules: {},
+};