eslint-plugin-primer-react 8.5.1-rc.585f4b0 → 8.5.1-rc.7865cb9

package/CHANGELOG.md

@@ -4,8 +4,6 @@
 
 ### Patch Changes
 
-- [#474](https://github.com/primer/eslint-plugin-primer-react/pull/474) [`1e0f943`](https://github.com/primer/eslint-plugin-primer-react/commit/1e0f943a264aaac2581b95916bd0cb8a66a41a17) Thanks [@liuliu-dev](https://github.com/liuliu-dev)! - Fix `no-unnecessary-components` rule to support `@primer/styled-react` imports.
-
 - [#461](https://github.com/primer/eslint-plugin-primer-react/pull/461) [`75ae0a5`](https://github.com/primer/eslint-plugin-primer-react/commit/75ae0a5cb1d4587b5481c8a459033206aae8e5c3) Thanks [@joshfarrant](https://github.com/joshfarrant)! - Export `enforce-button-for-link-with-no-href` rule, which flags `Link` components which don't have a `href`.
 
 ## 8.5.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "eslint-plugin-primer-react",
-  "version": "8.5.1-rc.585f4b0",
+  "version": "8.5.1-rc.7865cb9",
   "description": "ESLint rules for Primer React",
   "main": "src/index.js",
   "engines": {

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

@@ -7,7 +7,6 @@ const rule = require('../no-unnecessary-components')
 const {components} = require('../no-unnecessary-components')
 
 const prcImport = 'import React from "react"; import {Box, Text} from "@primer/react";'
-const styledReactImport = 'import React from "react"; import {Box, Text} from "@primer/styled-react";'
 const brandImport = 'import React from "react"; import {Box, Text} from "@primer/react-brand";'
 
 /** @param {string} content */
@@ -67,26 +66,6 @@ ruleTester.run('unnecessary-components', rule, {
         code: `${prcImport}${stringRecordDeclaration}${jsx(`<${component} {...props}>Hello World</${component}>`)}`,
         filename,
       },
-      {
-        name: `${component} from @primer/styled-react with sx prop`,
-        code: `${styledReactImport}${jsx(`<${component} sx={{color: "red"}}>Hello World</${component}>`)}`,
-        filename,
-      },
-      {
-        name: `${component} from @primer/styled-react with any styled-system prop`,
-        code: `${styledReactImport}${jsx(`<${component} flex="row">Hello World</${component}>`)}`,
-        filename,
-      },
-      {
-        name: `${component} from @primer/styled-react with spread sx prop`,
-        code: `${styledReactImport}${sxObjectDeclaration}${jsx(`<${component} {...props}>Hello World</${component}>`)}`,
-        filename,
-      },
-      {
-        name: `${component} from @primer/styled-react with string index spread props`,
-        code: `${styledReactImport}${stringRecordDeclaration}${jsx(`<${component} {...props}>Hello World</${component}>`)}`,
-        filename,
-      },
     ]),
     {
       name: `Text with weight prop`,
@@ -172,69 +151,5 @@ ruleTester.run('unnecessary-components', rule, {
       errors: [{messageId}],
       options: [{skipImportCheck: true}],
     },
-    {
-      name: `${component} from @primer/styled-react without any styled-system props`,
-      code: `${styledReactImport}${jsx(`<${component}>Hello World</${component}>`)}`,
-      output: `${styledReactImport}${jsx(`<${replacement}>Hello World</${replacement}>`)}`,
-      errors: [{messageId}],
-      filename,
-    },
-    {
-      name: `Self-closing ${component} from @primer/styled-react without any styled-system props`,
-      code: `${styledReactImport}${jsx(`<${component} />`)}`,
-      output: `${styledReactImport}${jsx(`<${replacement} />`)}`,
-      errors: [{messageId}],
-      filename,
-    },
-    {
-      name: `${component} from @primer/styled-react with spread props without sx`,
-      code: `${styledReactImport}${testIdObjectDeclaration}${jsx(`<${component} {...props}>Hello World</${component}>`)}`,
-      output: `${styledReactImport}${testIdObjectDeclaration}${jsx(`<${replacement} {...props}>Hello World</${replacement}>`)}`,
-      errors: [{messageId}],
-      filename,
-    },
-    {
-      name: `${component} from @primer/styled-react with string element 'as' prop`,
-      code: `${styledReactImport}${jsx(`<${component} as="code">Hello world</${component}>`)}`,
-      // There is extra whitespace here we don't worry about since formatters would get rid of it
-      output: `${styledReactImport}${jsx(`<code >Hello world</code>`)}`,
-      errors: [{messageId}],
-      filename,
-    },
-    {
-      name: `${component} from @primer/styled-react with single-character 'as' prop`,
-      code: `${styledReactImport}${jsx(`<${component} as="p">Hello world</${component}>`)}`,
-      output: `${styledReactImport}${jsx(`<p >Hello world</p>`)}`,
-      errors: [{messageId}],
-      filename,
-    },
-    {
-      name: `${component} from @primer/styled-react with string element 'as' prop surrounded by unnecessary braces`,
-      code: `${styledReactImport}${jsx(`<${component} as={"code"}>Hello world</${component}>`)}`,
-      output: `${styledReactImport}${jsx(`<code >Hello world</code>`)}`,
-      errors: [{messageId}],
-      filename,
-    },
-    {
-      name: `${component} from @primer/styled-react with component reference 'as' prop`,
-      code: `${styledReactImport}${componentDeclaration}${jsx(`<${component} as={OtherComponent}>Hello world</${component}>`)}`,
-      output: `${styledReactImport}${componentDeclaration}${jsx(`<OtherComponent >Hello world</OtherComponent>`)}`,
-      errors: [{messageId}],
-      filename,
-    },
-    {
-      name: `${component} from @primer/styled-react with spread 'as' prop`,
-      code: `${styledReactImport}${asObjectDeclaration}${jsx(`<${component} {...props}>Hello world</${component}>`)}`,
-      output: null,
-      errors: [{messageId}],
-      filename,
-    },
-    {
-      name: `${component} from @primer/styled-react with unusable lowercase reference 'as' prop`,
-      code: `${styledReactImport}${asConstDeclaration}${jsx(`<${component} as={as}>Hello world</${component}>`)}`,
-      output: null,
-      errors: [{messageId}],
-      filename,
-    },
   ]),
 })

package/src/utils/is-primer-component.js

@@ -1,8 +1,8 @@
 const {isImportedFrom} = require('./is-imported-from')
 
 /**
- * Check if `name` is a JSX component that is imported from `@primer/react`,
- * `@primer/styled-react`, or a subpath of either.
+ * Check if `name` is a JSX component that is imported from `@primer/react` or
+ * a subpath `@primer/react/*`.
  * @returns {boolean}
  */
 function isPrimerComponent(name, scope) {
@@ -18,6 +18,6 @@ function isPrimerComponent(name, scope) {
     default:
       return false
   }
-  return isImportedFrom(/^@primer\/(?:styled-)?react(?:$|\/)/, identifier, scope)
+  return isImportedFrom(/^@primer\/react(?:$|\/)/, identifier, scope)
 }
 exports.isPrimerComponent = isPrimerComponent