@atlaskit/eslint-plugin-design-system 8.29.1 → 8.31.0

package/dist/cjs/rules/use-primitives-text/transformers/paragraph-elements.js

@@ -0,0 +1,196 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ParagraphElements = void 0;
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _eslintCodemodUtils = require("eslint-codemod-utils");
+var ast = _interopRequireWildcard(require("../../../ast-nodes"));
+var _upsertImportDeclaration = require("../../use-primitives/transformers/emotion-css/upsert-import-declaration");
+var _common = require("./common");
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+/* eslint-disable @repo/internal/react/require-jsdoc */
+
+var ParagraphElements = exports.ParagraphElements = {
+  lint: function lint(node, _ref) {
+    var context = _ref.context,
+      config = _ref.config;
+    if (!(0, _eslintCodemodUtils.isNodeOfType)(node, 'JSXElement')) {
+      return;
+    }
+
+    // Check whether all criteria needed to make a transformation are met
+    var _ParagraphElements$_c = ParagraphElements._check(node, {
+        context: context,
+        config: config
+      }),
+      success = _ParagraphElements$_c.success,
+      refs = _ParagraphElements$_c.refs;
+    if (!success) {
+      return;
+    }
+    if (refs.siblings.length > 1) {
+      var _refs$siblings$0$loc, _refs$siblings$loc;
+      /**
+       * Highlighting from first opening element to last closing element
+       * to indicate fix will change all p elements and wrap them in a Stack,
+       * falls back to first opening element.
+       */
+      var startLoc = (_refs$siblings$0$loc = refs.siblings[0].loc) === null || _refs$siblings$0$loc === void 0 ? void 0 : _refs$siblings$0$loc.start;
+      var endLoc = (_refs$siblings$loc = refs.siblings[refs.siblings.length - 1].loc) === null || _refs$siblings$loc === void 0 ? void 0 : _refs$siblings$loc.end;
+      context.report({
+        loc: startLoc && endLoc && {
+          start: startLoc,
+          end: endLoc
+        },
+        node: node.openingElement,
+        messageId: 'preferPrimitivesStackedText',
+        suggest: [{
+          desc: 'Convert to Text and Stack',
+          fix: ParagraphElements._fixMultiple(node, {
+            context: context,
+            refs: refs
+          })
+        }]
+      });
+    } else {
+      context.report({
+        node: node,
+        messageId: 'preferPrimitivesText',
+        suggest: [{
+          desc: 'Convert to Text',
+          fix: ParagraphElements._fixSingle(node, {
+            context: context
+          })
+        }]
+      });
+    }
+  },
+  _check: function _check(node, _ref2) {
+    var context = _ref2.context,
+      config = _ref2.config;
+    if (!config.patterns.includes('paragraph-elements')) {
+      return {
+        success: false,
+        refs: {
+          siblings: []
+        }
+      };
+    }
+    var elementName = ast.JSXElement.getName(node);
+    if (elementName !== 'p') {
+      return {
+        success: false,
+        refs: {
+          siblings: []
+        }
+      };
+    }
+
+    // All siblings have to be paragraph elements with no unallowed props
+    if (!(0, _eslintCodemodUtils.isNodeOfType)(node.parent, 'JSXElement')) {
+      return {
+        success: false,
+        refs: {
+          siblings: []
+        }
+      };
+    }
+    var siblings = ast.JSXElement.getChildren(node.parent);
+    if (siblings.length > 1) {
+      var _siblings$0$range, _node$range, _siblings$0$range2, _node$range2;
+      // Only report for the first p element by comparing node location
+      if (((_siblings$0$range = siblings[0].range) === null || _siblings$0$range === void 0 ? void 0 : _siblings$0$range[0]) !== ((_node$range = node.range) === null || _node$range === void 0 ? void 0 : _node$range[0]) || ((_siblings$0$range2 = siblings[0].range) === null || _siblings$0$range2 === void 0 ? void 0 : _siblings$0$range2[1]) !== ((_node$range2 = node.range) === null || _node$range2 === void 0 ? void 0 : _node$range2[1])) {
+        return {
+          success: false,
+          refs: {
+            siblings: siblings
+          }
+        };
+      }
+      // Only report when every sibling is a p element
+      var siblingsMatch = siblings.every(function (child) {
+        if (!(0, _eslintCodemodUtils.isNodeOfType)(child, 'JSXElement')) {
+          return false;
+        }
+        if (ast.JSXElement.getName(child) !== 'p') {
+          return false;
+        }
+        return ast.JSXElement.hasAllowedAttrsOnly(child, _common.allowedAttrs);
+      });
+      if (!siblingsMatch) {
+        return {
+          success: false,
+          refs: {
+            siblings: siblings
+          }
+        };
+      }
+    }
+    var importDeclaration = ast.Root.findImportsByModule(context.getSourceCode().ast.body, '@atlaskit/primitives');
+
+    // If there is more than one `@atlaskit/primitives` import, then it becomes difficult to determine which import to transform
+    if (importDeclaration.length > 1) {
+      return {
+        success: false,
+        refs: {
+          siblings: siblings
+        }
+      };
+    }
+    return {
+      success: true,
+      refs: {
+        siblings: siblings
+      }
+    };
+  },
+  _fixSingle: function _fixSingle(node, _ref3) {
+    var context = _ref3.context;
+    return function (fixer) {
+      var importFix = (0, _upsertImportDeclaration.upsertImportDeclaration)({
+        module: '@atlaskit/primitives',
+        specifiers: ['Text']
+      }, context, fixer);
+      var elementNameFixes = ast.JSXElement.updateName(node, 'Text', fixer);
+      var testAttributeFix = (0, _common.updateTestIdAttributeFix)(node, fixer);
+      return [importFix].concat((0, _toConsumableArray2.default)(elementNameFixes), [testAttributeFix]).filter(function (fix) {
+        return Boolean(fix);
+      }); // Some of the transformers can return arrays with undefined, so filter them out
+    };
+  },
+  _fixMultiple: function _fixMultiple(node, _ref4) {
+    var context = _ref4.context,
+      refs = _ref4.refs;
+    return function (fixer) {
+      if (!(0, _eslintCodemodUtils.isNodeOfType)(node.parent, 'JSXElement') || !node.parent.closingElement) {
+        return [];
+      }
+      var importFix = (0, _upsertImportDeclaration.upsertImportDeclaration)({
+        module: '@atlaskit/primitives',
+        specifiers: ['Text', 'Stack']
+      }, context, fixer);
+
+      // Update all siblings elements and their attributes
+      var siblingFixes = refs.siblings.map(function (sibling) {
+        if ((0, _eslintCodemodUtils.isNodeOfType)(sibling, 'JSXElement')) {
+          var elementNameFixes = ast.JSXElement.updateName(sibling, 'Text', fixer);
+          var testAttributeFix = (0, _common.updateTestIdAttributeFix)(sibling, fixer);
+          return [].concat((0, _toConsumableArray2.default)(elementNameFixes), [testAttributeFix]);
+        }
+        return undefined;
+      }).flat();
+
+      // Wrap in <Stack /> when more than 1 sibling
+      var wrapperOpenElementFix = fixer.insertTextAfter(node.parent.openingElement, "<Stack space='space.150'>");
+      var wrapperCloseElementFix = fixer.insertTextBefore(node.parent.closingElement, '</Stack>');
+      return [importFix].concat((0, _toConsumableArray2.default)(siblingFixes), [wrapperOpenElementFix, wrapperCloseElementFix]).filter(function (fix) {
+        return Boolean(fix);
+      }); // Some of the transformers can return arrays with undefined, so filter them out
+    };
+  }
+};

package/dist/cjs/rules/use-primitives-text/transformers/span-elements.js

@@ -0,0 +1,87 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SpanElements = void 0;
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _eslintCodemodUtils = require("eslint-codemod-utils");
+var ast = _interopRequireWildcard(require("../../../ast-nodes"));
+var _upsertImportDeclaration = require("../../use-primitives/transformers/emotion-css/upsert-import-declaration");
+var _common = require("./common");
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+/* eslint-disable @repo/internal/react/require-jsdoc */
+
+var SpanElements = exports.SpanElements = {
+  lint: function lint(node, _ref) {
+    var context = _ref.context,
+      config = _ref.config;
+    if (!(0, _eslintCodemodUtils.isNodeOfType)(node, 'JSXElement')) {
+      return;
+    }
+
+    // Check whether all criteria needed to make a transformation are met
+    if (!SpanElements._check(node, {
+      context: context,
+      config: config
+    })) {
+      return;
+    }
+    context.report({
+      node: node.openingElement,
+      messageId: 'preferPrimitivesText',
+      suggest: [{
+        desc: "Convert to Text",
+        fix: SpanElements._fix(node, {
+          context: context
+        })
+      }]
+    });
+  },
+  _check: function _check(node, _ref2) {
+    var context = _ref2.context,
+      config = _ref2.config;
+    if (!config.patterns.includes('span-elements')) {
+      return false;
+    }
+    var elementName = ast.JSXElement.getName(node);
+    if (elementName !== 'span') {
+      return false;
+    }
+
+    // Element has no unallowed props
+    if (!ast.JSXElement.hasAllowedAttrsOnly(node, _common.allowedAttrs)) {
+      return false;
+    }
+
+    // Only allow elements with strings as children
+    if (!(0, _common.hasTextChildrenOnly)(node)) {
+      return false;
+    }
+    var importDeclaration = ast.Root.findImportsByModule(context.getSourceCode().ast.body, '@atlaskit/primitives');
+
+    // If there is more than one `@atlaskit/primitives` import, then it becomes difficult to determine which import to transform
+    if (importDeclaration.length > 1) {
+      return false;
+    }
+    return true;
+  },
+  _fix: function _fix(node, _ref3) {
+    var context = _ref3.context;
+    return function (fixer) {
+      var importFix = (0, _upsertImportDeclaration.upsertImportDeclaration)({
+        module: '@atlaskit/primitives',
+        specifiers: ['Text']
+      }, context, fixer);
+      var elementNameFixes = ast.JSXElement.updateName(node, 'Text', fixer);
+      var variantAttributeFix = ast.JSXElement.addAttribute(node, 'variant', 'ui', fixer);
+      var testAttributeFix = (0, _common.updateTestIdAttributeFix)(node, fixer);
+      return [importFix].concat((0, _toConsumableArray2.default)(elementNameFixes), [variantAttributeFix, testAttributeFix]).filter(function (fix) {
+        return Boolean(fix);
+      }); // Some of the transformers can return arrays with undefined, so filter them out
+    };
+  }
+};

package/dist/cjs/rules/use-primitives-text/transformers/strong-elements.js

@@ -0,0 +1,82 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.StrongElements = void 0;
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _eslintCodemodUtils = require("eslint-codemod-utils");
+var ast = _interopRequireWildcard(require("../../../ast-nodes"));
+var _upsertImportDeclaration = require("../../use-primitives/transformers/emotion-css/upsert-import-declaration");
+var _common = require("./common");
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+/* eslint-disable @repo/internal/react/require-jsdoc */
+
+var StrongElements = exports.StrongElements = {
+  lint: function lint(node, _ref) {
+    var context = _ref.context,
+      config = _ref.config;
+    if (!(0, _eslintCodemodUtils.isNodeOfType)(node, 'JSXElement')) {
+      return;
+    }
+
+    // Check whether all criteria needed to make a transformation are met
+    if (!StrongElements._check(node, {
+      context: context,
+      config: config
+    })) {
+      return;
+    }
+    context.report({
+      node: node.openingElement,
+      messageId: 'preferPrimitivesText',
+      suggest: [{
+        desc: "Convert to Text",
+        fix: StrongElements._fix(node, {
+          context: context
+        })
+      }]
+    });
+  },
+  _check: function _check(node, _ref2) {
+    var context = _ref2.context,
+      config = _ref2.config;
+    if (!config.patterns.includes('strong-elements')) {
+      return false;
+    }
+    var elementName = ast.JSXElement.getName(node);
+    if (elementName !== 'strong') {
+      return false;
+    }
+
+    // Element has no unallowed props
+    if (!ast.JSXElement.hasAllowedAttrsOnly(node, _common.allowedAttrs)) {
+      return false;
+    }
+
+    // If there is more than one `@atlaskit/primitives` import, then it becomes difficult to determine which import to transform
+    var importDeclaration = ast.Root.findImportsByModule(context.getSourceCode().ast.body, '@atlaskit/primitives');
+    if (importDeclaration.length > 1) {
+      return false;
+    }
+    return true;
+  },
+  _fix: function _fix(node, _ref3) {
+    var context = _ref3.context;
+    return function (fixer) {
+      var importFix = (0, _upsertImportDeclaration.upsertImportDeclaration)({
+        module: '@atlaskit/primitives',
+        specifiers: ['Text']
+      }, context, fixer);
+      var elementNameFixes = ast.JSXElement.updateName(node, 'Text', fixer);
+      var asAttributeFix = ast.JSXElement.addAttribute(node, 'as', 'strong', fixer);
+      var testAttributeFix = (0, _common.updateTestIdAttributeFix)(node, fixer);
+      return [importFix].concat((0, _toConsumableArray2.default)(elementNameFixes), [asAttributeFix, testAttributeFix]).filter(function (fix) {
+        return Boolean(fix);
+      }); // Some of the transformers can return arrays with undefined, so filter them out
+    };
+  }
+};

package/dist/configs/deprecated.json

@@ -43,11 +43,6 @@
             {
                 "moduleSpecifier": "@atlaskit/logo"
             }
-        ],
-        "enableRemoteAdminLinks": [
-            {
-                "moduleSpecifier": "@atlassian/switcher"
-            }
         ]
     },
     "imports": {

package/dist/es2019/ast-nodes/jsx-element.js

@@ -1,4 +1,5 @@
 import { isNodeOfType, jsxIdentifier } from 'eslint-codemod-utils';
+import { JSXAttribute as HelperJSXAttribute } from './jsx-attribute';
 export const JSXElementHelper = {
   /**
    * Names of JSXElements can be any of:
@@ -6,8 +7,8 @@ export const JSXElementHelper = {
    * `<MyComponents.Component></MyComponents.Component>` - `MyComponents` is a namespace (JSXNamespacedName)
    * `<MyComponents.Component></MyComponents.Component>` - `MyComponents` is an object (JSXMemberExpression)
    *
-   * Getting the name of a JSXMemberExpression is difficult, because object can contain objects, which is recursively defined in the AST.
-   * e.g. getting the name of `<MyComponents.PresentationLayer.LeftSideBar.Header />` would require `getName` to recursively resolve all parts of the name.
+   * getting the name of a JSXMemberExpression is difficult, because object can contain objects, which is recursively defined in the AST.
+   * e.g. Getting the name of `<MyComponents.PresentationLayer.LeftSideBar.Header />` would require `getName` to recursively resolve all parts of the name.
    * `getName` does not currently have this functionality. Add it if you need it.
    */
   getName(node) {
@@ -45,6 +46,36 @@ export const JSXElementHelper = {
     return node.openingElement.attributes.some(attr => {
       return isNodeOfType(attr, 'JSXSpreadAttribute');
     });
+  },
+  addAttribute(node, name, value, fixer) {
+    const attributeString = ` ${name}='${value}'`;
+    const isSelfClosing = JSXElementHelper.isSelfClosing(node);
+    const start = node.openingElement.range ? node.openingElement.range[0] : 0;
+    const end = node.openingElement.range ? node.openingElement.range[1] - (isSelfClosing ? 3 : 1) : 0;
+    const range = [start, end];
+    const fix = fixer.insertTextAfterRange(range, attributeString);
+    return fix;
+  },
+  getChildren(node) {
+    // Filter out text children with whitespace characters only as JSX removes whitespace used for intendation
+    const filteredChildren = node.children.filter(child => {
+      if (isNodeOfType(child, 'JSXText')) {
+        const whiteSpaceChars = new RegExp('\\s', 'g');
+        return !whiteSpaceChars.test(child.value);
+      }
+      return true;
+    });
+    return filteredChildren;
+  },
+  hasAllowedAttrsOnly(node, allowedProps) {
+    const attrs = JSXElementHelper.getAttributes(node);
+    return attrs.every(attr => {
+      if (!isNodeOfType(attr, 'JSXAttribute')) {
+        return false;
+      }
+      const name = HelperJSXAttribute.getName(attr);
+      return allowedProps.includes(name);
+    });
   }
 };
 export { JSXElementHelper as JSXElement };

package/dist/es2019/presets/all.codegen.js

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::5647ce9c10ba880cffece66b5924fd6e>>
+ * @codegen <<SignedSource::aa64b4343b8763cfa5aa66230faea408>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 export default {
@@ -10,7 +10,6 @@ export default {
     '@atlaskit/design-system/ensure-design-token-usage': 'error',
     '@atlaskit/design-system/ensure-design-token-usage/preview': 'warn',
     '@atlaskit/design-system/icon-label': 'warn',
-    '@atlaskit/design-system/local-cx-xcss': 'error',
     '@atlaskit/design-system/no-banned-imports': 'error',
     '@atlaskit/design-system/no-css-tagged-template-expression': 'error',
     '@atlaskit/design-system/no-deprecated-apis': 'error',
@@ -34,6 +33,7 @@ export default {
     '@atlaskit/design-system/use-heading-level-in-spotlight-card': 'warn',
     '@atlaskit/design-system/use-href-in-link-item': 'warn',
     '@atlaskit/design-system/use-primitives': 'warn',
+    '@atlaskit/design-system/use-primitives-text': 'warn',
     '@atlaskit/design-system/use-visually-hidden': 'error'
   }
 };

package/dist/es2019/presets/recommended.codegen.js

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::577269c832952ce359cde6a50f26f4e0>>
+ * @codegen <<SignedSource::aebc778f0b10032cbb2941b55189d766>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 export default {
@@ -9,7 +9,6 @@ export default {
     '@atlaskit/design-system/consistent-css-prop-usage': 'error',
     '@atlaskit/design-system/ensure-design-token-usage': 'error',
     '@atlaskit/design-system/icon-label': 'warn',
-    '@atlaskit/design-system/local-cx-xcss': 'error',
     '@atlaskit/design-system/no-banned-imports': 'error',
     '@atlaskit/design-system/no-deprecated-apis': 'error',
     '@atlaskit/design-system/no-deprecated-design-token-usage': 'warn',

package/dist/es2019/rules/index.codegen.js

@@ -1,13 +1,12 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::0a2813f0b87e94d23e1f6fc388539c70>>
+ * @codegen <<SignedSource::7d840a5791dae4a9dfc4dda8ec00dcf9>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 import consistentCssPropUsage from './consistent-css-prop-usage';
 import ensureDesignTokenUsage from './ensure-design-token-usage';
 import ensureDesignTokenUsagePreview from './ensure-design-token-usage-preview';
 import iconLabel from './icon-label';
-import localCxXcss from './local-cx-xcss';
 import noBannedImports from './no-banned-imports';
 import noCssTaggedTemplateExpression from './no-css-tagged-template-expression';
 import noDeprecatedApis from './no-deprecated-apis';
@@ -31,13 +30,13 @@ import useDrawerLabel from './use-drawer-label';
 import useHeadingLevelInSpotlightCard from './use-heading-level-in-spotlight-card';
 import useHrefInLinkItem from './use-href-in-link-item';
 import usePrimitives from './use-primitives';
+import usePrimitivesText from './use-primitives-text';
 import useVisuallyHidden from './use-visually-hidden';
 export default {
   'consistent-css-prop-usage': consistentCssPropUsage,
   'ensure-design-token-usage': ensureDesignTokenUsage,
   'ensure-design-token-usage/preview': ensureDesignTokenUsagePreview,
   'icon-label': iconLabel,
-  'local-cx-xcss': localCxXcss,
   'no-banned-imports': noBannedImports,
   'no-css-tagged-template-expression': noCssTaggedTemplateExpression,
   'no-deprecated-apis': noDeprecatedApis,
@@ -61,5 +60,6 @@ export default {
   'use-heading-level-in-spotlight-card': useHeadingLevelInSpotlightCard,
   'use-href-in-link-item': useHrefInLinkItem,
   'use-primitives': usePrimitives,
+  'use-primitives-text': usePrimitivesText,
   'use-visually-hidden': useVisuallyHidden
 };

package/dist/es2019/rules/use-primitives/transformers/emotion-css/index.js

@@ -4,7 +4,6 @@ import { getIdentifierInParentScope, isNodeOfType } from 'eslint-codemod-utils';
 import * as ast from '../../../../ast-nodes';
 import { getVariableDefinitionValue, getVariableUsagesCount, isValidCssPropertiesToTransform } from '../../utils';
 import { cssToXcssTransformer } from '../css-to-xcss';
-import { containsOnlySupportedAttrs } from './contains-only-supported-attrs';
 import * as supported from './supported';
 import { upsertImportDeclaration } from './upsert-import-declaration';
 export const EmotionCSS = {
@@ -56,7 +55,7 @@ export const EmotionCSS = {
     }
 
     // Ignore elements that contain dangerous attributes like `id`.
-    if (!containsOnlySupportedAttrs(node)) {
+    if (!ast.JSXElement.hasAllowedAttrsOnly(node, supported.attributes)) {
       return false;
     }
 

package/dist/es2019/rules/use-primitives-text/config/index.js

@@ -0,0 +1,9 @@
+const defaults = {
+  patterns: ['paragraph-elements', 'span-elements', 'strong-elements', 'emphasis-elements']
+};
+export const getConfig = overrides => {
+  // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign
+  // start with an empty object, then merge in the defaults, then merge in overrides.
+  // The empty object is returned, as well as modified in place
+  return Object.assign({}, defaults, overrides);
+};

package/dist/es2019/rules/use-primitives-text/index.js

@@ -0,0 +1,51 @@
+import { createLintRule } from '../utils/create-rule';
+import { getConfig } from './config';
+import { EmphasisElements, ParagraphElements, SpanElements, StrongElements } from './transformers';
+const textDocsUrl = 'https://atlassian.design/components/primitives/text';
+const rule = createLintRule({
+  meta: {
+    name: 'use-primitives-text',
+    type: 'suggestion',
+    fixable: 'code',
+    hasSuggestions: true,
+    docs: {
+      description: 'Encourage the usage of text components.',
+      recommended: false,
+      severity: 'warn'
+    },
+    messages: {
+      preferPrimitivesText: `This element can be replaced with a "Text" primitive. See ${textDocsUrl} for additional guidance.`,
+      preferPrimitivesStackedText: `These paragraphs can be replaced with a "Text" and "Stack" primitives. See ${textDocsUrl} for additional guidance.`
+    }
+  },
+  create(context) {
+    const config = getConfig(context.options[0]);
+    return {
+      'JSXElement[openingElement.name.name=span]': node => {
+        return SpanElements.lint(node, {
+          context,
+          config
+        });
+      },
+      'JSXElement[openingElement.name.name=p]': node => {
+        return ParagraphElements.lint(node, {
+          context,
+          config
+        });
+      },
+      'JSXElement[openingElement.name.name=strong]': node => {
+        return StrongElements.lint(node, {
+          context,
+          config
+        });
+      },
+      'JSXElement[openingElement.name.name=em]': node => {
+        return EmphasisElements.lint(node, {
+          context,
+          config
+        });
+      }
+    };
+  }
+});
+export default rule;

package/dist/es2019/rules/use-primitives-text/transformers/common.js

@@ -0,0 +1,33 @@
+import { isNodeOfType } from 'eslint-codemod-utils';
+import * as ast from '../../../ast-nodes';
+
+// Rename data-testid prop to testId if present
+export function updateTestIdAttributeFix(node, fixer) {
+  const testIdAttr = ast.JSXElement.getAttributeByName(node, 'data-testid');
+  if (testIdAttr) {
+    return ast.JSXAttribute.updateName(testIdAttr, 'testId', fixer);
+  }
+}
+export const allowedAttrs = ['id', 'data-testid', 'key'];
+
+// Only allow elements with strings as children
+// The use of `FormattedMessage` component and `formatMessage` are allowed as these are used for i18n
+export function hasTextChildrenOnly(node) {
+  var _node$children;
+  return (_node$children = node.children) === null || _node$children === void 0 ? void 0 : _node$children.every(child => {
+    if (isNodeOfType(child, 'JSXText')) {
+      return true;
+    }
+
+    // JSX child element <span><FormattedMessage /></span>
+    if (isNodeOfType(child, 'JSXElement') && ast.JSXElement.getName(child) === 'FormattedMessage') {
+      return true;
+    }
+
+    // JSX expression <span>{formatMessage(...)}</span>
+    if (isNodeOfType(child, 'JSXExpressionContainer') && isNodeOfType(child.expression, 'CallExpression')) {
+      return ast.FunctionCall.getName(child.expression) === 'formatMessage';
+    }
+    return false;
+  });
+}