@atlaskit/eslint-plugin-design-system 8.4.2 → 8.4.3

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @atlaskit/eslint-plugin-design-system
 
+## 8.4.3
+
+### Patch Changes
+
+- [`96e35ec4b9d`](https://bitbucket.org/atlassian/atlassian-frontend/commits/96e35ec4b9d) - Tweak `use-primitives` and `prefer-primitives` logic to stop false positives for component names that contain HTML element names.
+
 ## 8.4.2
 
 ### Patch Changes

package/dist/cjs/rules/prefer-primitives/index.js

@@ -53,7 +53,7 @@ var rule = (0, _createRule.createLintRule)({
 
         // styled.div``
         if ((0, _eslintCodemodUtils.isNodeOfType)(node.property, 'Identifier')) {
-          if (_utils.validPrimitiveElements.test(node.property.name)) {
+          if (_utils.validPrimitiveElements.has(node.property.name)) {
             var styledIdentifier = node.object.name;
             var elementName = node.property.name;
 
@@ -80,7 +80,7 @@ var rule = (0, _createRule.createLintRule)({
         if ((0, _eslintCodemodUtils.isNodeOfType)(node.arguments[0], 'Literal')) {
           var argValue = node.arguments[0].raw;
           if (typeof argValue === 'string') {
-            var suggest = _utils.validPrimitiveElements.test(argValue.replaceAll("'", '') // argValue will have '' around the element name, strip it out for this test
+            var suggest = _utils.validPrimitiveElements.has(argValue.replaceAll("'", '') // argValue will have '' around the element name, strip it out for this test
             );
 
             if (suggest) {

package/dist/cjs/rules/use-primitives/utils.js

@@ -322,11 +322,10 @@ var getCSSPropStyleObject = function getCSSPropStyleObject(node, context) {
   }
   return styleObj;
 };
-var validPrimitiveElements = /^div|span|article|aside|dialog|footer|header|li|main|nav|ol|section|ul$/;
+var validPrimitiveElements = new Set(['div', 'span', 'article', 'aside', 'dialog', 'footer', 'header', 'li', 'main', 'nav', 'ol', 'section', 'ul']);
 exports.validPrimitiveElements = validPrimitiveElements;
 var isValidPrimitiveElement = function isValidPrimitiveElement(node) {
-  // For now we are only targeting div and span elements
-  return validPrimitiveElements.test(node.openingElement.name.name);
+  return validPrimitiveElements.has(node.openingElement.name.name.toLowerCase());
 };
 exports.isValidPrimitiveElement = isValidPrimitiveElement;
 var hasInlineCompatibleStyles = function hasInlineCompatibleStyles(cssStyleObject) {

package/dist/es2019/rules/prefer-primitives/index.js

@@ -48,7 +48,7 @@ const rule = createLintRule({
 
         // styled.div``
         if (isNodeOfType(node.property, 'Identifier')) {
-          if (validPrimitiveElements.test(node.property.name)) {
+          if (validPrimitiveElements.has(node.property.name)) {
             const styledIdentifier = node.object.name;
             const elementName = node.property.name;
 
@@ -75,7 +75,7 @@ const rule = createLintRule({
         if (isNodeOfType(node.arguments[0], 'Literal')) {
           const argValue = node.arguments[0].raw;
           if (typeof argValue === 'string') {
-            const suggest = validPrimitiveElements.test(argValue.replaceAll(`'`, '') // argValue will have '' around the element name, strip it out for this test
+            const suggest = validPrimitiveElements.has(argValue.replaceAll(`'`, '') // argValue will have '' around the element name, strip it out for this test
             );
 
             if (suggest) {

package/dist/es2019/rules/use-primitives/utils.js

@@ -303,10 +303,9 @@ const getCSSPropStyleObject = (node, context) => {
   }
   return styleObj;
 };
-export const validPrimitiveElements = /^div|span|article|aside|dialog|footer|header|li|main|nav|ol|section|ul$/;
+export const validPrimitiveElements = new Set(['div', 'span', 'article', 'aside', 'dialog', 'footer', 'header', 'li', 'main', 'nav', 'ol', 'section', 'ul']);
 export const isValidPrimitiveElement = node => {
-  // For now we are only targeting div and span elements
-  return validPrimitiveElements.test(node.openingElement.name.name);
+  return validPrimitiveElements.has(node.openingElement.name.name.toLowerCase());
 };
 const hasInlineCompatibleStyles = cssStyleObject => {
   if (!['flex', 'inline-flex'].includes(cssStyleObject['display'])) {

package/dist/esm/rules/prefer-primitives/index.js

@@ -47,7 +47,7 @@ var rule = createLintRule({
 
         // styled.div``
         if (isNodeOfType(node.property, 'Identifier')) {
-          if (validPrimitiveElements.test(node.property.name)) {
+          if (validPrimitiveElements.has(node.property.name)) {
             var styledIdentifier = node.object.name;
             var elementName = node.property.name;
 
@@ -74,7 +74,7 @@ var rule = createLintRule({
         if (isNodeOfType(node.arguments[0], 'Literal')) {
           var argValue = node.arguments[0].raw;
           if (typeof argValue === 'string') {
-            var suggest = validPrimitiveElements.test(argValue.replaceAll("'", '') // argValue will have '' around the element name, strip it out for this test
+            var suggest = validPrimitiveElements.has(argValue.replaceAll("'", '') // argValue will have '' around the element name, strip it out for this test
             );
 
             if (suggest) {

package/dist/esm/rules/use-primitives/utils.js

@@ -309,10 +309,9 @@ var getCSSPropStyleObject = function getCSSPropStyleObject(node, context) {
   }
   return styleObj;
 };
-export var validPrimitiveElements = /^div|span|article|aside|dialog|footer|header|li|main|nav|ol|section|ul$/;
+export var validPrimitiveElements = new Set(['div', 'span', 'article', 'aside', 'dialog', 'footer', 'header', 'li', 'main', 'nav', 'ol', 'section', 'ul']);
 export var isValidPrimitiveElement = function isValidPrimitiveElement(node) {
-  // For now we are only targeting div and span elements
-  return validPrimitiveElements.test(node.openingElement.name.name);
+  return validPrimitiveElements.has(node.openingElement.name.name.toLowerCase());
 };
 var hasInlineCompatibleStyles = function hasInlineCompatibleStyles(cssStyleObject) {
   if (!['flex', 'inline-flex'].includes(cssStyleObject['display'])) {

package/dist/types/rules/use-primitives/utils.d.ts

@@ -8,6 +8,6 @@ export declare const primitiveFixer: (node: EslintNode, nodeName: string, contex
 export declare const isWhiteSpace: (value: string) => boolean;
 type JSXChild = 'JSXElement' | 'JSXExpressionContainer' | 'JSXFragment' | 'JSXText' | 'JSXSpreadChild'[];
 export declare const getChildrenByType: (node: JSXElement, types: JSXChild[]) => (JSXElement | JSXExpressionContainer | import("estree-jsx").JSXFragment | JSXText | import("estree-jsx").JSXSpreadChild)[];
-export declare const validPrimitiveElements: RegExp;
+export declare const validPrimitiveElements: Set<string>;
 export declare const isValidPrimitiveElement: (node: JSXElement) => boolean;
 export {};

package/dist/types-ts4.5/rules/use-primitives/utils.d.ts

@@ -8,6 +8,6 @@ export declare const primitiveFixer: (node: EslintNode, nodeName: string, contex
 export declare const isWhiteSpace: (value: string) => boolean;
 type JSXChild = 'JSXElement' | 'JSXExpressionContainer' | 'JSXFragment' | 'JSXText' | 'JSXSpreadChild'[];
 export declare const getChildrenByType: (node: JSXElement, types: JSXChild[]) => (JSXElement | JSXExpressionContainer | import("estree-jsx").JSXFragment | JSXText | import("estree-jsx").JSXSpreadChild)[];
-export declare const validPrimitiveElements: RegExp;
+export declare const validPrimitiveElements: Set<string>;
 export declare const isValidPrimitiveElement: (node: JSXElement) => boolean;
 export {};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@atlaskit/eslint-plugin-design-system",
   "description": "The essential plugin for use with the Atlassian Design System.",
-  "version": "8.4.2",
+  "version": "8.4.3",
   "author": "Atlassian Pty Ltd",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"