break into new package

Author: joephela

.changeset/ninety-flowers-promise.md

@@ -1,5 +1,5 @@
 ---
-'eslint-config-widen-react': minor
+'eslint-config-widen-emotion': minor
 ---
 
-Add a new rule that detects conditional statements used on a css prop.
+Add a new package for emotion specific rules.

packages/eslint-config-widen-emotion/README.md

@@ -0,0 +1,30 @@
+# eslint-config-widen-emotion
+
+Widen's shared ESLint config.
+
+## Installation
+
+```bash
+yarn add -D eslint eslint-plugin-emotion
+```
+
+## Usage
+
+In your `eslint.config.mjs` file, add the following four entries to your extends
+list. If you don't need a specific configuration, simply remove it from the
+list.
+
+```js
+import emotion from 'eslint-config-widen-emotion'
+
+export default [
+  ...emotion,
+  ...[
+    // you can specify what to ignore by using the `ignores` key before any other rule
+    // this will filter out things we dont want this to run on
+    { ignores: ['*.test.*'] },
+    // you can also override rules by specifying the rule and the new value
+    { files: ['*.spec.js'], rules: { 'no-unused-vars': 'off' } },
+  ],
+]
+```

packages/eslint-config-widen-emotion/package.json

@@ -0,0 +1,29 @@
+{
+  "author": "Widen",
+  "dependencies": {
+    "eslint-config-prettier": "^9.1.0"
+  },
+  "description": "Widen's shared ESLint config for Emotion.",
+  "exports": {
+    ".": "./lib/index.js"
+  },
+  "files": [
+    "lib"
+  ],
+  "type": "module",
+  "homepage": "https://github.com/Widen/eslint-config/tree/master/packages/eslint-config-widen-emotion#readme",
+  "license": "ISC",
+  "name": "eslint-config-widen-emotion",
+  "peerDependencies": {
+    "eslint": ">= 9",
+    "eslint-plugin-jsx-a11y": ">= 6",
+    "eslint-plugin-react": ">= 7",
+    "eslint-plugin-react-hooks": ">= 4"
+  },
+  "repository": {
+    "directory": "packages/eslint-config-widen-emotion",
+    "type": "git",
+    "url": "https://github.com/Widen/eslint-config"
+  },
+  "version": "1.0.0"
+}

packages/eslint-config-widen-emotion/src/index.ts

@@ -0,0 +1,7 @@
+import noConditionalCssProp from './rules/no-conditional-css-prop.js'
+
+export default {
+  rules: {
+    'custom/no-conditional-css-prop': noConditionalCssProp,
+  },
+}

packages/eslint-config-widen-react/src/rules/no-conditional-css-prop.ts packages/eslint-config-widen-emotion/src/rules/no-conditional-css-prop.ts

@@ -0,0 +1,14 @@
+import globals from 'globals'
+
+// delete an invalid global that causes error because of the trailing space
+const browser = globals.browser
+delete browser['AudioWorkletGlobalScope ']
+
+const sharedGlobals = {
+  ...browser,
+  ...globals.es6,
+  ...globals.node,
+  ...globals.jest,
+}
+
+export default sharedGlobals

packages/eslint-config-widen-emotion/src/sharedGlobals.ts

@@ -0,0 +1,2 @@
+declare module 'globals'
+declare module 'no-conditional-css-prop'

packages/eslint-config-widen-emotion/src/types.d.ts

@@ -0,0 +1,13 @@
+{
+  "extends": "../../tsconfig.base.json",
+  "compilerOptions": {
+    "outDir": "lib",
+    "rootDir": "src",
+    "module": "esnext",
+    "esModuleInterop": true,
+    "target": "es2016"
+  },
+  "paths": {
+    "@/*": ["./src/*"]
+  }
+}

packages/eslint-config-widen-react/test/no-conditional-css-prop.test.js packages/eslint-config-widen-emotion/test/no-conditional-css-prop.test.js

@@ -1,7 +1,6 @@
 import jsxA11y from 'eslint-plugin-jsx-a11y'
 import react from 'eslint-plugin-react'
 import reactHooks from 'eslint-plugin-react-hooks'
-import noConditionalCssProp from './rules/no-conditional-css-prop.js'
 import sharedGlobals from './sharedGlobals.js'
 
 const languageOptions = {
@@ -72,7 +71,6 @@ export default [
     files: ['*.tsx', '*.{spec,test}.{js,jsx}'],
     languageOptions,
     rules: {
-      'custom/no-conditional-css-prop': noConditionalCssProp,
       'jsx-a11y/click-events-have-key-events': 'warn',
       'jsx-a11y/label-has-associated-control': [
         'error',

packages/eslint-config-widen-emotion/tsconfig.json

@@ -2,4 +2,3 @@ declare module 'eslint-plugin-jsx-a11y'
 declare module 'eslint-plugin-react'
 declare module 'eslint-plugin-react-hooks'
 declare module 'globals'
-declare module 'no-conditional-css-prop'

packages/eslint-config-widen-react/src/react.ts

@@ -3,6 +3,7 @@
   "references": [
     { "path": "packages/eslint-config-widen" },
     { "path": "packages/eslint-config-widen-base" },
+    { "path": "packages/eslint-config-widen-emotion" },
     { "path": "packages/eslint-config-widen-jest" },
     { "path": "packages/eslint-config-widen-playwright" },
     { "path": "packages/eslint-config-widen-react" },

packages/eslint-config-widen-react/src/types.d.ts

@@ -3704,6 +3704,19 @@ __metadata:
   languageName: unknown
   linkType: soft
 
+"eslint-config-widen-emotion@workspace:packages/eslint-config-widen-emotion":
+  version: 0.0.0-use.local
+  resolution: "eslint-config-widen-emotion@workspace:packages/eslint-config-widen-emotion"
+  dependencies:
+    eslint-config-prettier: ^9.1.0
+  peerDependencies:
+    eslint: ">= 9"
+    eslint-plugin-jsx-a11y: ">= 6"
+    eslint-plugin-react: ">= 7"
+    eslint-plugin-react-hooks: ">= 4"
+  languageName: unknown
+  linkType: soft
+
 "eslint-config-widen-jest@workspace:packages/eslint-config-widen-jest":
   version: 0.0.0-use.local
   resolution: "eslint-config-widen-jest@workspace:packages/eslint-config-widen-jest"