eslint-plugin-primer-react 8.0.0-rc.d848c88 → 8.1.0-rc.d5a1ac8

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "eslint-plugin-primer-react",
-  "version": "8.0.0-rc.d848c88",
+  "version": "8.1.0-rc.d5a1ac8",
   "description": "ESLint rules for Primer React",
   "main": "src/index.js",
   "engines": {
@@ -28,16 +28,16 @@
   },
   "homepage": "https://github.com/primer/eslint-plugin-primer-react#readme",
   "peerDependencies": {
-    "eslint": "^8.42.0"
+    "eslint": "^9.0.0"
   },
   "dependencies": {
     "@styled-system/props": "^5.1.5",
-    "eslint-plugin-github": "^5.0.1",
+    "@typescript-eslint/utils": "8.39.0",
+    "eslint-plugin-github": "^6.0.0",
     "eslint-plugin-jsx-a11y": "^6.7.1",
     "eslint-traverse": "^1.0.0",
     "lodash": "^4.17.21",
     "styled-system": "^5.1.5",
-    "@typescript-eslint/utils": "8.38.0",
     "typescript": "^5.8.2"
   },
   "devDependencies": {
@@ -45,13 +45,19 @@
     "@changesets/cli": "^2.27.9",
     "@github/markdownlint-github": "^0.6.3",
     "@github/prettier-config": "0.0.6",
-    "eslint": "^8.42.0",
-    "eslint-plugin-prettier": "^5.2.1",
+    "@types/jest": "^30.0.0",
+    "@typescript-eslint/rule-tester": "8.39.0",
+    "eslint": "^9.0.0",
+    "eslint-plugin-eslint-comments": "^3.2.0",
+    "eslint-plugin-filenames": "^1.3.2",
+    "eslint-plugin-i18n-text": "^1.0.1",
+    "eslint-plugin-import": "^2.32.0",
+    "eslint-plugin-no-only-tests": "^3.3.0",
+    "eslint-plugin-prettier": "^5.5.4",
+    "globals": "^16.3.0",
     "jest": "^30.0.5",
     "markdownlint-cli2": "^0.18.1",
-    "markdownlint-cli2-formatter-pretty": "^0.0.7",
-    "@typescript-eslint/rule-tester": "7.16.0",
-    "@types/jest": "^30.0.0"
+    "markdownlint-cli2-formatter-pretty": "^0.0.8"
   },
   "prettier": "@github/prettier-config"
 }

package/src/index.js

@@ -19,6 +19,7 @@ module.exports = {
     'prefer-action-list-item-onselect': require('./rules/prefer-action-list-item-onselect'),
     'enforce-css-module-identifier-casing': require('./rules/enforce-css-module-identifier-casing'),
     'enforce-css-module-default-import': require('./rules/enforce-css-module-default-import'),
+    'use-styled-react-import': require('./rules/use-styled-react-import'),
   },
   configs: {
     recommended: require('./configs/recommended'),

package/src/rules/__tests__/a11y-explicit-heading.test.js

@@ -2,11 +2,13 @@ const rule = require('../a11y-explicit-heading')
 const {RuleTester} = require('eslint')
 
 const ruleTester = new RuleTester({
-  parserOptions: {
+  languageOptions: {
     ecmaVersion: 'latest',
     sourceType: 'module',
-    ecmaFeatures: {
-      jsx: true,
+    parserOptions: {
+      ecmaFeatures: {
+        jsx: true,
+      },
     },
   },
 })

package/src/rules/__tests__/a11y-link-in-text-block.test.js

@@ -2,11 +2,13 @@ const rule = require('../a11y-link-in-text-block')
 const {RuleTester} = require('eslint')
 
 const ruleTester = new RuleTester({
-  parserOptions: {
+  languageOptions: {
     ecmaVersion: 'latest',
     sourceType: 'module',
-    ecmaFeatures: {
-      jsx: true,
+    parserOptions: {
+      ecmaFeatures: {
+        jsx: true,
+      },
     },
   },
 })

package/src/rules/__tests__/a11y-no-duplicate-form-labels.test.js

@@ -2,11 +2,13 @@ const rule = require('../a11y-no-duplicate-form-labels')
 const {RuleTester} = require('eslint')
 
 const ruleTester = new RuleTester({
-  parserOptions: {
+  languageOptions: {
     ecmaVersion: 'latest',
     sourceType: 'module',
-    ecmaFeatures: {
-      jsx: true,
+    parserOptions: {
+      ecmaFeatures: {
+        jsx: true,
+      },
     },
   },
 })
@@ -37,12 +39,6 @@ ruleTester.run('a11y-no-duplicate-form-labels', rule, {
       <TextInput />
     </FormControl>`,
 
-    // FormControl without FormControl.Label but with aria-label is valid
-    `import {FormControl, TextInput} from '@primer/react';
-    <FormControl>
-      <TextInput aria-label="Form Input Label" />
-    </FormControl>`,
-
     // Multiple TextInputs with different approaches
     `import {FormControl, TextInput} from '@primer/react';
     <div>

package/src/rules/__tests__/a11y-no-title-usage.test.js

@@ -2,11 +2,13 @@ const rule = require('../a11y-no-title-usage')
 const {RuleTester} = require('eslint')
 
 const ruleTester = new RuleTester({
-  parserOptions: {
+  languageOptions: {
     ecmaVersion: 'latest',
     sourceType: 'module',
-    ecmaFeatures: {
-      jsx: true,
+    parserOptions: {
+      ecmaFeatures: {
+        jsx: true,
+      },
     },
   },
 })

package/src/rules/__tests__/a11y-remove-disable-tooltip.test.js

@@ -4,11 +4,13 @@ const {RuleTester} = require('eslint')
 const rule = require('../a11y-remove-disable-tooltip')
 
 const ruleTester = new RuleTester({
-  parserOptions: {
+  languageOptions: {
     ecmaVersion: 'latest',
     sourceType: 'module',
-    ecmaFeatures: {
-      jsx: true,
+    parserOptions: {
+      ecmaFeatures: {
+        jsx: true,
+      },
     },
   },
 })

package/src/rules/__tests__/a11y-tooltip-interactive-trigger.test.js

@@ -2,11 +2,13 @@ const rule = require('../a11y-tooltip-interactive-trigger')
 const {RuleTester} = require('eslint')
 
 const ruleTester = new RuleTester({
-  parserOptions: {
+  languageOptions: {
     ecmaVersion: 'latest',
     sourceType: 'module',
-    ecmaFeatures: {
-      jsx: true,
+    parserOptions: {
+      ecmaFeatures: {
+        jsx: true,
+      },
     },
   },
 })

package/src/rules/__tests__/a11y-use-accessible-tooltip.test.js

@@ -2,11 +2,13 @@ const rule = require('../a11y-use-accessible-tooltip')
 const {RuleTester} = require('eslint')
 
 const ruleTester = new RuleTester({
-  parserOptions: {
+  languageOptions: {
     ecmaVersion: 'latest',
     sourceType: 'module',
-    ecmaFeatures: {
-      jsx: true,
+    parserOptions: {
+      ecmaFeatures: {
+        jsx: true,
+      },
     },
   },
 })

package/src/rules/__tests__/direct-slot-children.test.js

@@ -2,11 +2,13 @@ const rule = require('../direct-slot-children')
 const {RuleTester} = require('eslint')
 
 const ruleTester = new RuleTester({
-  parserOptions: {
+  languageOptions: {
     ecmaVersion: 'latest',
     sourceType: 'module',
-    ecmaFeatures: {
-      jsx: true,
+    parserOptions: {
+      ecmaFeatures: {
+        jsx: true,
+      },
     },
   },
 })

package/src/rules/__tests__/enforce-button-for-link-with-nohref.test.js

@@ -2,11 +2,13 @@ const rule = require('../enforce-button-for-link-with-nohref')
 const {RuleTester} = require('eslint')
 
 const ruleTester = new RuleTester({
-  parserOptions: {
+  languageOptions: {
     ecmaVersion: 'latest',
     sourceType: 'module',
-    ecmaFeatures: {
-      jsx: true,
+    parserOptions: {
+      ecmaFeatures: {
+        jsx: true,
+      },
     },
   },
 })

package/src/rules/__tests__/enforce-css-module-identifier-casing.test.js

@@ -2,11 +2,13 @@ const rule = require('../enforce-css-module-identifier-casing')
 const {RuleTester} = require('eslint')
 
 const ruleTester = new RuleTester({
-  parserOptions: {
+  languageOptions: {
     ecmaVersion: 'latest',
     sourceType: 'module',
-    ecmaFeatures: {
-      jsx: true,
+    parserOptions: {
+      ecmaFeatures: {
+        jsx: true,
+      },
     },
   },
 })

package/src/rules/__tests__/new-color-css-vars.test.js

@@ -2,11 +2,13 @@ const rule = require('../new-color-css-vars')
 const {RuleTester} = require('eslint')
 
 const ruleTester = new RuleTester({
-  parserOptions: {
+  languageOptions: {
     ecmaVersion: 'latest',
     sourceType: 'module',
-    ecmaFeatures: {
-      jsx: true,
+    parserOptions: {
+      ecmaFeatures: {
+        jsx: true,
+      },
     },
   },
 })

package/src/rules/__tests__/no-deprecated-entrypoints.test.js

@@ -4,11 +4,13 @@ const {RuleTester} = require('eslint')
 const rule = require('../no-deprecated-entrypoints')
 
 const ruleTester = new RuleTester({
-  parserOptions: {
+  languageOptions: {
     ecmaVersion: 'latest',
     sourceType: 'module',
-    ecmaFeatures: {
-      jsx: true,
+    parserOptions: {
+      ecmaFeatures: {
+        jsx: true,
+      },
     },
   },
 })

package/src/rules/__tests__/no-deprecated-experimental-components.test.js

@@ -4,11 +4,13 @@ const {RuleTester} = require('eslint')
 const rule = require('../no-deprecated-experimental-components')
 
 const ruleTester = new RuleTester({
-  parserOptions: {
+  languageOptions: {
     ecmaVersion: 'latest',
     sourceType: 'module',
-    ecmaFeatures: {
-      jsx: true,
+    parserOptions: {
+      ecmaFeatures: {
+        jsx: true,
+      },
     },
   },
 })

package/src/rules/__tests__/no-deprecated-props.test.js

@@ -4,11 +4,13 @@ const {RuleTester} = require('eslint')
 const rule = require('../no-deprecated-props')
 
 const ruleTester = new RuleTester({
-  parserOptions: {
+  languageOptions: {
     ecmaVersion: 'latest',
     sourceType: 'module',
-    ecmaFeatures: {
-      jsx: true,
+    parserOptions: {
+      ecmaFeatures: {
+        jsx: true,
+      },
     },
   },
 })

package/src/rules/__tests__/no-system-props.test.js

@@ -2,11 +2,13 @@ const rule = require('../no-system-props')
 const {RuleTester} = require('eslint')
 
 const ruleTester = new RuleTester({
-  parserOptions: {
+  languageOptions: {
     ecmaVersion: 'latest',
     sourceType: 'module',
-    ecmaFeatures: {
-      jsx: true,
+    parserOptions: {
+      ecmaFeatures: {
+        jsx: true,
+      },
     },
   },
 })
@@ -102,7 +104,6 @@ ruleTester.run('no-system-props', rule, {
     },
     {
       code: `import {Button} from '@primer/react'; <Button width={200} sx={myStylez} />`,
-      output: `import {Button} from '@primer/react'; <Button width={200} sx={myStylez} />`,
       errors: [
         {
           messageId: 'noSystemProps',

package/src/rules/__tests__/no-unnecessary-components.test.js

@@ -20,10 +20,12 @@ const componentDeclaration = `const OtherComponent = ({children}: {children: Rea
 const asConstDeclaration = `const as = "p";`
 
 const ruleTester = new RuleTester({
-  parser: '@typescript-eslint/parser',
-  parserOptions: {
-    tsconfigRootDir: path.resolve(__dirname, 'fixtures'),
-    project: path.resolve(__dirname, 'fixtures', 'tsconfig.json'),
+  languageOptions: {
+    parser: require('@typescript-eslint/parser'),
+    parserOptions: {
+      tsconfigRootDir: path.resolve(__dirname, 'fixtures'),
+      project: path.resolve(__dirname, 'fixtures', 'tsconfig.json'),
+    },
   },
   defaultFilenames: {
     ts: 'file.ts',

package/src/rules/__tests__/no-wildcard-imports.test.js

@@ -4,12 +4,14 @@ const {RuleTester} = require('eslint')
 const rule = require('../no-wildcard-imports')
 
 const ruleTester = new RuleTester({
-  parser: require.resolve('@typescript-eslint/parser'),
-  parserOptions: {
+  languageOptions: {
+    parser: require(require.resolve('@typescript-eslint/parser', {paths: [require.resolve('eslint-plugin-github')]})),
     ecmaVersion: 'latest',
     sourceType: 'module',
-    ecmaFeatures: {
-      jsx: true,
+    parserOptions: {
+      ecmaFeatures: {
+        jsx: true,
+      },
     },
   },
 })
@@ -69,20 +71,6 @@ ruleTester.run('no-wildcard-imports', rule, {
       ],
     },
 
-    // Test default import
-    {
-      code: `import useIsomorphicLayoutEffect from '@primer/react/lib-esm/utils/useIsomorphicLayoutEffect'`,
-      output: `import {useIsomorphicLayoutEffect} from '@primer/react'`,
-      errors: [
-        {
-          messageId: 'wildcardMigration',
-          data: {
-            wildcardEntrypoint: '@primer/react/lib-esm/utils/useIsomorphicLayoutEffect',
-          },
-        },
-      ],
-    },
-
     // Test multiple wildcard imports into single entrypoint
     {
       code: `import {useResizeObserver} from '@primer/react/lib-esm/hooks/useResizeObserver'
@@ -306,18 +294,6 @@ import {type ButtonBaseProps} from '@primer/react/experimental'`,
         },
       ],
     },
-    {
-      code: `import type {ItemProps} from '@primer/react/lib-esm/deprecated/ActionList/Item'`,
-      output: `import {type ActionListItemProps as ItemProps} from '@primer/react/deprecated'`,
-      errors: [
-        {
-          messageId: 'wildcardMigration',
-          data: {
-            wildcardEntrypoint: '@primer/react/lib-esm/deprecated/ActionList/Item',
-          },
-        },
-      ],
-    },
 
     // Hooks -------------------------------------------------------------------
 
@@ -391,19 +367,6 @@ import {type ButtonBaseProps} from '@primer/react/experimental'`,
 
     // Utilities ---------------------------------------------------------------
 
-    // @primer/react/lib-esm/sx
-    {
-      code: `import type {BetterSystemStyleObject, SxProp, BetterCssProperties} from '@primer/react/lib-esm/sx'`,
-      output: `import {type BetterSystemStyleObject, type SxProp, type BetterCssProperties} from '@primer/react'`,
-      errors: [
-        {
-          messageId: 'wildcardMigration',
-          data: {
-            wildcardEntrypoint: '@primer/react/lib-esm/sx',
-          },
-        },
-      ],
-    },
     // @primer/react/lib-esm/FeatureFlags/DefaultFeatureFlags
     {
       code: `import {DefaultFeatureFlags} from '@primer/react/lib-esm/FeatureFlags/DefaultFeatureFlags'`,

package/src/rules/__tests__/prefer-action-list-item-onselect.test.js

@@ -2,12 +2,14 @@ const {RuleTester} = require('@typescript-eslint/rule-tester')
 const rule = require('../prefer-action-list-item-onselect')
 
 const ruleTester = new RuleTester({
-  parser: require.resolve('@typescript-eslint/parser'),
-  parserOptions: {
+  languageOptions: {
+    parser: require(require.resolve('@typescript-eslint/parser', {paths: [require.resolve('eslint-plugin-github')]})),
     ecmaVersion: 2018,
     sourceType: 'module',
-    ecmaFeatures: {
-      jsx: true,
+    parserOptions: {
+      ecmaFeatures: {
+        jsx: true,
+      },
     },
   },
 })

package/src/rules/__tests__/use-deprecated-from-deprecated.test.js

@@ -4,11 +4,13 @@ const {RuleTester} = require('eslint')
 const rule = require('../use-deprecated-from-deprecated')
 
 const ruleTester = new RuleTester({
-  parserOptions: {
+  languageOptions: {
     ecmaVersion: 'latest',
     sourceType: 'module',
-    ecmaFeatures: {
-      jsx: true,
+    parserOptions: {
+      ecmaFeatures: {
+        jsx: true,
+      },
     },
   },
 })