@atlaskit/eslint-plugin-design-system 8.23.2 → 8.23.4

package/dist/cjs/rules/use-primitives/transformers/compiled-styled/index.js

@@ -0,0 +1,117 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.CompiledStyled = void 0;
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _eslintCodemodUtils = require("eslint-codemod-utils");
+var ast = _interopRequireWildcard(require("../../../../ast-nodes"));
+var _utils = require("../../utils");
+var _convertJsxCallSite = require("./convert-jsx-call-site");
+var _convertStyledComponentCallToJsx = require("./convert-styled-component-call-to-jsx");
+var _findValidJsxUsageToTransform = require("./find-valid-jsx-usage-to-transform");
+var _findValidStyledComponentCall = require("./find-valid-styled-component-call");
+var _upsertImportDeclaration = require("./upsert-import-declaration");
+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 CompiledStyled = exports.CompiledStyled = {
+  lint: function lint(node, _ref) {
+    var context = _ref.context,
+      config = _ref.config;
+    if (!(0, _eslintCodemodUtils.isNodeOfType)(node, 'CallExpression')) {
+      return;
+    }
+
+    // Check whether all criteria needed to make a transformation are met
+    var _CompiledStyled$_chec = CompiledStyled._check(node, {
+        context: context,
+        config: config
+      }),
+      success = _CompiledStyled$_chec.success,
+      refs = _CompiledStyled$_chec.refs;
+    if (!success || !refs) {
+      return;
+    }
+    context.report({
+      node: refs.styles,
+      messageId: 'preferPrimitivesBox',
+      suggest: [{
+        desc: "Convert ".concat(ast.JSXElement.getName(refs.jsxElement), " to Box"),
+        fix: CompiledStyled._fix(refs, context)
+      }]
+    });
+  },
+  _check: function _check(node, _ref2) {
+    var context = _ref2.context,
+      config = _ref2.config;
+    if (!config.patterns.includes('compiled-styled-object')) {
+      return {
+        success: false
+      };
+    }
+    if (!(0, _eslintCodemodUtils.isNodeOfType)(node, 'CallExpression')) {
+      return {
+        success: false
+      };
+    }
+    var styledComponentVariableRef = (0, _findValidStyledComponentCall.findValidStyledComponentCall)(node);
+    if (!styledComponentVariableRef || !(0, _eslintCodemodUtils.isNodeOfType)(styledComponentVariableRef.id, 'Identifier') || !(0, _utils.isValidCssPropertiesToTransform)(node, config)) {
+      return {
+        success: false
+      };
+    }
+    var styledComponentJsxRef = (0, _findValidJsxUsageToTransform.findValidJsxUsageToTransform)(styledComponentVariableRef.id.name, context.getScope());
+    if (!styledComponentJsxRef) {
+      return {
+        success: false
+      };
+    }
+    if (!(0, _eslintCodemodUtils.isNodeOfType)(styledComponentJsxRef.parent, 'JSXElement')) {
+      return {
+        success: 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 {
+        success: false
+      };
+    }
+    return {
+      success: true,
+      refs: {
+        styles: styledComponentVariableRef,
+        jsxElement: styledComponentJsxRef.parent
+      }
+    };
+  },
+  /**
+   * All required validation steps have been taken care of before this
+   * transformer is called, so it just goes ahead providing all necessary fixes
+   */
+  _fix: function _fix(refs, context) {
+    return function (fixer) {
+      // generates the new variable name: MyComponent -> myComponentStyles
+      var calculatedStylesVariableName = (0, _eslintCodemodUtils.isNodeOfType)(refs.styles.id, 'Identifier') && "".concat(refs.styles.id.name.replace(refs.styles.id.name[0], refs.styles.id.name[0].toLowerCase()), "Styles");
+      if (!calculatedStylesVariableName) {
+        return [];
+      }
+      var importFixes = (0, _upsertImportDeclaration.upsertImportDeclaration)({
+        module: '@atlaskit/primitives',
+        specifiers: ['Box', 'xcss']
+      }, context, fixer);
+      var stylesFixes = (0, _convertStyledComponentCallToJsx.convertStyledComponentToXcss)(refs.styles, calculatedStylesVariableName, fixer);
+      var jsxFixes = (0, _convertJsxCallSite.convertJsxCallSite)(refs.jsxElement, calculatedStylesVariableName, fixer);
+      return [importFixes].concat((0, _toConsumableArray2.default)(stylesFixes), (0, _toConsumableArray2.default)(jsxFixes)).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/transformers/compiled-styled/supported.js

@@ -0,0 +1,10 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.elements = exports.attributes = void 0;
+var elements = exports.elements = ['div'];
+var attributes = exports.attributes = ['css'
+// 'data-testid'
+];

package/dist/cjs/rules/use-primitives/transformers/compiled-styled/upsert-import-declaration.js

@@ -0,0 +1,37 @@
+"use strict";
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.upsertImportDeclaration = void 0;
+var ast = _interopRequireWildcard(require("../../../../ast-nodes"));
+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; }
+/**
+ * Currently this is defined here because it's not very general purpose.
+ * If we were to move this to `ast-nodes`, half the implementation would be in `Root`,
+ * and the other half would be in `Import`.
+ *
+ * TODO: Refactor and move to `ast-nodes`
+ *
+ * Note: It does not handle default imports, namespace imports, or aliased imports.
+ */
+var upsertImportDeclaration = exports.upsertImportDeclaration = function upsertImportDeclaration(_ref, context, fixer) {
+  var module = _ref.module,
+    specifiers = _ref.specifiers;
+  // Find any imports that match the packageName
+  var root = context.getSourceCode().ast.body;
+  var importDeclarations = ast.Root.findImportsByModule(root, module);
+
+  // The import doesn't exist yet, we can just insert a whole new one
+  if (importDeclarations.length === 0) {
+    return ast.Root.insertImport(root, {
+      module: module,
+      specifiers: specifiers
+    }, fixer);
+  }
+
+  // The import exists so, modify the existing one
+  return ast.Import.insertNamedSpecifiers(importDeclarations[0], specifiers, fixer);
+};

package/dist/cjs/rules/use-primitives/transformers/emotion-css/contains-only-supported-attrs.js

@@ -0,0 +1,27 @@
+"use strict";
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.containsOnlySupportedAttrs = void 0;
+var _eslintCodemodUtils = require("eslint-codemod-utils");
+var ast = _interopRequireWildcard(require("../../../../ast-nodes"));
+var supported = _interopRequireWildcard(require("./supported"));
+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; }
+/**
+ * Check that every attribute in the JSXElement is something we support.
+ * We do this via a whitelist in `this.attributes`. The result is we exclude
+ * dangerous attrs like `id` and `style`.
+ */
+var containsOnlySupportedAttrs = exports.containsOnlySupportedAttrs = function containsOnlySupportedAttrs(node) {
+  var attrs = ast.JSXElement.getAttributes(node);
+  return attrs.every(function (attr) {
+    if (!(0, _eslintCodemodUtils.isNodeOfType)(attr, 'JSXAttribute')) {
+      return false;
+    }
+    var name = ast.JSXAttribute.getName(attr);
+    return supported.attributes.includes(name);
+  });
+};

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

@@ -11,7 +11,9 @@ var _eslintCodemodUtils = require("eslint-codemod-utils");
 var ast = _interopRequireWildcard(require("../../../../ast-nodes"));
 var _utils = require("../../utils");
 var _cssToXcss = require("../css-to-xcss");
+var _containsOnlySupportedAttrs = require("./contains-only-supported-attrs");
 var supported = _interopRequireWildcard(require("./supported"));
+var _upsertImportDeclaration = require("./upsert-import-declaration");
 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 */
@@ -63,7 +65,7 @@ var EmotionCSS = exports.EmotionCSS = {
     }
 
     // Ignore elements that contain dangerous attributes like `id`.
-    if (!this._containsOnlySupportedAttributes(node)) {
+    if (!(0, _containsOnlySupportedAttrs.containsOnlySupportedAttrs)(node)) {
       return false;
     }
 
@@ -105,10 +107,9 @@ var EmotionCSS = exports.EmotionCSS = {
     return true;
   },
   _fix: function _fix(node, _ref3) {
-    var _this = this;
     var context = _ref3.context;
     return function (fixer) {
-      var importFix = _this._upsertImportDeclaration({
+      var importFix = (0, _upsertImportDeclaration.upsertImportDeclaration)({
         module: '@atlaskit/primitives',
         specifiers: ['Box', 'xcss']
       }, context, fixer);
@@ -120,49 +121,5 @@ var EmotionCSS = exports.EmotionCSS = {
         return Boolean(fix);
       }); // Some of the transformers can return arrays with undefined, so filter them out
     };
-  },
-  /**
-   * Check that every attribute in the JSXElement is something we support.
-   * We do this via a whitelist in `this.attributes`. The result is we exclude
-   * dangerous attrs like `id` and `style`.
-   */
-  _containsOnlySupportedAttributes: function _containsOnlySupportedAttributes(node) {
-    var attrs = ast.JSXElement.getAttributes(node);
-    return attrs.every(function (attr) {
-      if (!(0, _eslintCodemodUtils.isNodeOfType)(attr, 'JSXAttribute')) {
-        return false;
-      }
-      if (!(0, _eslintCodemodUtils.isNodeOfType)(attr.name, 'JSXIdentifier')) {
-        return false;
-      }
-      return supported.attributes.includes(attr.name.name);
-    });
-  },
-  /**
-   * Currently this is defined here because it's not very general purpose.
-   * If we were to move this to `ast-nodes`, half the implementation would be in `Root`,
-   * and the other half would be in `Import`.
-   *
-   * TODO: Refactor and move to `ast-nodes`
-   *
-   * Note: It does not handle default imports, namespace imports, or aliased imports.
-   */
-  _upsertImportDeclaration: function _upsertImportDeclaration(_ref4, context, fixer) {
-    var module = _ref4.module,
-      specifiers = _ref4.specifiers;
-    // Find any imports that match the packageName
-    var root = context.getSourceCode().ast.body;
-    var importDeclarations = ast.Root.findImportsByModule(root, module);
-
-    // The import doesn't exist yet, we can just insert a whole new one
-    if (importDeclarations.length === 0) {
-      return ast.Root.insertImport(root, {
-        module: module,
-        specifiers: specifiers
-      }, fixer);
-    }
-
-    // The import exists so, modify the existing one
-    return ast.Import.insertNamedSpecifiers(importDeclarations[0], specifiers, fixer);
   }
 };

package/dist/cjs/rules/use-primitives/transformers/emotion-css/supported.js

@@ -3,50 +3,8 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.styles = exports.elements = exports.attributes = void 0;
+exports.elements = exports.attributes = void 0;
 var elements = exports.elements = ['div'];
 var attributes = exports.attributes = ['css'
 // 'data-testid'
-];
-
-// TODO: https://product-fabric.atlassian.net/browse/DSP-16054
-var spaceTokenMap = {
-  '0px': 'space.0',
-  '2px': 'space.025',
-  '4px': 'space.050',
-  '6px': 'space.075',
-  '8px': 'space.100',
-  '12px': 'space.150',
-  '16px': 'space.200',
-  '20px': 'space.250',
-  '24px': 'space.300',
-  '32px': 'space.400',
-  '40px': 'space.500',
-  '48px': 'space.600',
-  '64px': 'space.800',
-  '80px': 'space.1000'
-};
-var styles = exports.styles = {
-  padding: spaceTokenMap,
-  paddingBlock: spaceTokenMap,
-  paddingBlockEnd: spaceTokenMap,
-  paddingBlockStart: spaceTokenMap,
-  paddingBottom: spaceTokenMap,
-  paddingInline: spaceTokenMap,
-  paddingInlineEnd: spaceTokenMap,
-  paddingInlineStart: spaceTokenMap,
-  paddingLeft: spaceTokenMap,
-  paddingRight: spaceTokenMap,
-  paddingTop: spaceTokenMap,
-  margin: spaceTokenMap,
-  marginBlock: spaceTokenMap,
-  marginBlockEnd: spaceTokenMap,
-  marginBlockStart: spaceTokenMap,
-  marginBottom: spaceTokenMap,
-  marginInline: spaceTokenMap,
-  marginInlineEnd: spaceTokenMap,
-  marginInlineStart: spaceTokenMap,
-  marginLeft: spaceTokenMap,
-  marginRight: spaceTokenMap,
-  marginTop: spaceTokenMap
-};
+];

package/dist/cjs/rules/use-primitives/transformers/emotion-css/upsert-import-declaration.js

@@ -0,0 +1,37 @@
+"use strict";
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.upsertImportDeclaration = void 0;
+var ast = _interopRequireWildcard(require("../../../../ast-nodes"));
+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; }
+/**
+ * Currently this is defined here because it's not very general purpose.
+ * If we were to move this to `ast-nodes`, half the implementation would be in `Root`,
+ * and the other half would be in `Import`.
+ *
+ * TODO: Refactor and move to `ast-nodes`
+ *
+ * Note: It does not handle default imports, namespace imports, or aliased imports.
+ */
+var upsertImportDeclaration = exports.upsertImportDeclaration = function upsertImportDeclaration(_ref, context, fixer) {
+  var module = _ref.module,
+    specifiers = _ref.specifiers;
+  // Find any imports that match the packageName
+  var root = context.getSourceCode().ast.body;
+  var importDeclarations = ast.Root.findImportsByModule(root, module);
+
+  // The import doesn't exist yet, we can just insert a whole new one
+  if (importDeclarations.length === 0) {
+    return ast.Root.insertImport(root, {
+      module: module,
+      specifiers: specifiers
+    }, fixer);
+  }
+
+  // The import exists so, modify the existing one
+  return ast.Import.insertNamedSpecifiers(importDeclarations[0], specifiers, fixer);
+};

package/dist/cjs/rules/use-primitives/transformers/index.js

@@ -3,28 +3,28 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-Object.defineProperty(exports, "cssToXcssTransformer", {
+Object.defineProperty(exports, "CompiledStyled", {
   enumerable: true,
   get: function get() {
-    return _cssToXcss.cssToXcssTransformer;
+    return _compiledStyled.CompiledStyled;
   }
 });
-Object.defineProperty(exports, "jsxElementToBoxTransformer", {
+Object.defineProperty(exports, "EmotionCSS", {
   enumerable: true,
   get: function get() {
-    return _jsxElementToBox.jsxElementToBoxTransformer;
+    return _emotionCss.EmotionCSS;
   }
 });
-Object.defineProperty(exports, "spaceTokenMap", {
+Object.defineProperty(exports, "cssToXcssTransformer", {
   enumerable: true,
   get: function get() {
-    return _cssToXcss.spaceTokenMap;
+    return _cssToXcss.cssToXcssTransformer;
   }
 });
-Object.defineProperty(exports, "styledComponentToPrimitive", {
+Object.defineProperty(exports, "spaceTokenMap", {
   enumerable: true,
   get: function get() {
-    return _styledComponentToPrimitive.styledComponentToPrimitive;
+    return _cssToXcss.spaceTokenMap;
   }
 });
 Object.defineProperty(exports, "supportedStylesMap", {
@@ -34,5 +34,5 @@ Object.defineProperty(exports, "supportedStylesMap", {
   }
 });
 var _cssToXcss = require("./css-to-xcss");
-var _jsxElementToBox = require("./jsx-element-to-box");
-var _styledComponentToPrimitive = require("./styled-component-to-primitive");
+var _compiledStyled = require("./compiled-styled");
+var _emotionCss = require("./emotion-css");

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

@@ -3,30 +3,12 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-Object.defineProperty(exports, "containsOnlySupportedAttrs", {
-  enumerable: true,
-  get: function get() {
-    return _containsOnlySupportedAttrs.containsOnlySupportedAttrs;
-  }
-});
 Object.defineProperty(exports, "convertASTObjectExpressionToJSObject", {
   enumerable: true,
   get: function get() {
     return _convertAstObjectExpressionToJsObject.convertASTObjectExpressionToJSObject;
   }
 });
-Object.defineProperty(exports, "findValidJsxUsageToTransform", {
-  enumerable: true,
-  get: function get() {
-    return _findValidJsxUsageToTransform.findValidJsxUsageToTransform;
-  }
-});
-Object.defineProperty(exports, "findValidStyledComponentCall", {
-  enumerable: true,
-  get: function get() {
-    return _findValidStyledComponentCall.findValidStyledComponentCall;
-  }
-});
 Object.defineProperty(exports, "getAttributeValueIdentifier", {
   enumerable: true,
   get: function get() {
@@ -69,34 +51,13 @@ Object.defineProperty(exports, "isValidCssPropertiesToTransform", {
     return _isValidCssPropertiesToTransform.isValidCssPropertiesToTransform;
   }
 });
-Object.defineProperty(exports, "isValidTagName", {
-  enumerable: true,
-  get: function get() {
-    return _isValidTagName.isValidTagName;
-  }
-});
 Object.defineProperty(exports, "updateJSXAttributeByName", {
   enumerable: true,
   get: function get() {
     return _updateJsxAttributeByName.updateJSXAttributeByName;
   }
 });
-Object.defineProperty(exports, "updateJSXElementName", {
-  enumerable: true,
-  get: function get() {
-    return _updateJsxElementName.updateJSXElementName;
-  }
-});
-Object.defineProperty(exports, "upsertImportDeclaration", {
-  enumerable: true,
-  get: function get() {
-    return _upsertImportDeclaration.upsertImportDeclaration;
-  }
-});
-var _containsOnlySupportedAttrs = require("./contains-only-supported-attrs");
 var _convertAstObjectExpressionToJsObject = require("./convert-ast-object-expression-to-js-object");
-var _findValidJsxUsageToTransform = require("./find-valid-jsx-usage-to-transform");
-var _findValidStyledComponentCall = require("./find-valid-styled-component-call");
 var _getAttributeValueIdentifier = require("./get-attribute-value-identifier");
 var _getFunctionArgumentAtPos = require("./get-function-argument-at-pos");
 var _getJsxAttributeByName = require("./get-jsx-attribute-by-name");
@@ -104,7 +65,4 @@ var _getVariableDefinitionValue = require("./get-variable-definition-value");
 var _getVariableUsageCount = require("./get-variable-usage-count");
 var _isFunctionNamed = require("./is-function-named");
 var _isValidCssPropertiesToTransform = require("./is-valid-css-properties-to-transform");
-var _isValidTagName = require("./is-valid-tag-name");
-var _updateJsxAttributeByName = require("./update-jsx-attribute-by-name");
-var _updateJsxElementName = require("./update-jsx-element-name");
-var _upsertImportDeclaration = require("./upsert-import-declaration");
+var _updateJsxAttributeByName = require("./update-jsx-attribute-by-name");

package/dist/cjs/rules/utils/is-supported-import.js

@@ -0,0 +1,61 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.isCxFunction = exports.isCss = exports.CSS_IN_JS_IMPORTS = void 0;
+// eslint-disable-next-line import/no-extraneous-dependencies
+
+var CSS_IN_JS_IMPORTS = exports.CSS_IN_JS_IMPORTS = {
+  compiled: '@compiled/react',
+  emotionReact: '@emotion/react',
+  emotionCore: '@emotion/core',
+  styledComponents: 'styled-components',
+  atlaskitCss: '@atlaskit/css'
+};
+
+// List of CSS-in-JS libraries an import of a valid css, cx, cssMap, etc.
+// function might originate from, e.g. @compiled/react, @emotion/core.
+
+var isSupportedImportWrapper = function isSupportedImportWrapper(functionName) {
+  // This will need to be extended to support default imports once we start
+  // checking cases like `import css from '@emotion/css'`
+  var checkDefinitionHasImport = function checkDefinitionHasImport(def, importSources) {
+    var _def$parent, _def$parent2;
+    return def.node.type === 'ImportSpecifier' && def.node.imported.type === 'Identifier' && def.node.imported.name === functionName && ((_def$parent = def.parent) === null || _def$parent === void 0 ? void 0 : _def$parent.type) === 'ImportDeclaration' && importSources.includes((_def$parent2 = def.parent) === null || _def$parent2 === void 0 ? void 0 : _def$parent2.source.value);
+  };
+
+  /**
+   * Checks whether:
+   *
+   * 1. a function name `nodeToCheck` matches the name of the function we
+   *    want to check for (e.g. `cx`, `css`, `cssMap`, or `keyframes`), and
+   * 2. whether `nodeToCheck` originates from one of the libraries listed
+   *     in `importSources`.
+   *
+   * @param nodeToCheck the function callee we are checking (e.g. the `css` in `css()`)
+   * @param referencesInScope list of references that are in scope. We'll use this
+   *                          to check where the function callee is imported from.
+   * @param importSources list of libraries that we want to ensure `nodeToCheck`
+   *                      comes from
+   *
+   * @returns whether the above conditions are true
+   */
+  var isSupportedImport = function isSupportedImport(nodeToCheck, referencesInScope, importSources) {
+    return nodeToCheck.type === 'Identifier' && referencesInScope.some(function (reference) {
+      var _reference$resolved;
+      return reference.identifier === nodeToCheck && ((_reference$resolved = reference.resolved) === null || _reference$resolved === void 0 ? void 0 : _reference$resolved.defs.some(function (def) {
+        return checkDefinitionHasImport(def, importSources);
+      }));
+    });
+  };
+  return isSupportedImport;
+};
+
+// Unused functions have been commented out until we implement corresponding
+// eslint rules which use them
+//
+var isCss = exports.isCss = isSupportedImportWrapper('css');
+var isCxFunction = exports.isCxFunction = isSupportedImportWrapper('cx');
+// export const isCssMap = isLibraryImportWrapper('cssMap');
+// export const isKeyframes = isLibraryImportWrapper('keyframes');

package/dist/es2019/ast-nodes/index.js

@@ -2,4 +2,5 @@ export { FunctionCall } from './function-call';
 export { Import } from './import';
 export { JSXAttribute } from './jsx-attribute';
 export { JSXElement } from './jsx-element';
+export { Object } from './object';
 export { Root } from './root';

package/dist/es2019/ast-nodes/object.js

@@ -0,0 +1,79 @@
+/* eslint-disable @repo/internal/react/require-jsdoc */
+
+import { identifier, isNodeOfType, literal, property } from 'eslint-codemod-utils';
+const ASTObjectExpression = {
+  /**
+   * Returns `true` if an object contains a property with the specified name, `false` otherwise.
+   */
+  hasProperty(node, name) {
+    return !!ASTObjectExpression.getProperty(node, name);
+  },
+  /**
+   * Returns a key-value pair like: `padding: '8px'` from: `{ padding: '8px' }`
+   */
+  getEntryByPropertyName(node, name) {
+    return node.properties.find(property => {
+      if (!isNodeOfType(property, 'Property')) {
+        return false;
+      }
+      if (!isNodeOfType(property.key, 'Identifier')) {
+        return false;
+      }
+      return property.key.name === name;
+    });
+  },
+  deleteEntry(node, name, fixer) {
+    const entry = ASTObjectExpression.getEntryByPropertyName(node, name);
+    if (!entry) {
+      return [];
+    }
+    return [fixer.remove(entry)];
+  },
+  /**
+   * Returns a only the property @type {Property['key']} like: `padding` from: `{ padding: '8px' }`
+   */
+  getProperty(node, name) {
+    var _ASTObjectExpression$;
+    return (_ASTObjectExpression$ = ASTObjectExpression.getEntryByPropertyName(node, name)) === null || _ASTObjectExpression$ === void 0 ? void 0 : _ASTObjectExpression$.key;
+  },
+  /**
+   * Returns a only the property @type {Property['value']} like: `'8px` from: `{ padding: '8px' }`
+   *
+   * Values can be basically anything, so be careful with this
+   */
+  getValueByPropertyName(node, name) {
+    var _ASTObjectExpression$2;
+    return (_ASTObjectExpression$2 = ASTObjectExpression.getEntryByPropertyName(node, name)) === null || _ASTObjectExpression$2 === void 0 ? void 0 : _ASTObjectExpression$2.value;
+  },
+  containsSpreadProps(node) {
+    return node.properties.some(property => {
+      return isNodeOfType(property, 'SpreadElement');
+    });
+  },
+  updateValue(node, propertyName, newValue, fixer) {
+    const value = ASTObjectExpression.getValueByPropertyName(node, propertyName);
+    if (value === undefined) {
+      throw new Error(`Object.updateValue: Could not get value of property ${propertyName}`);
+    }
+    return fixer.replaceText(value, newValue);
+  },
+  /**
+   * Appends a key-value pair to the end of an object. For example:
+   * ```
+   * ast.Object.appendEntry(
+   *   node, // { padding: 'space.100' }
+   *   key, // 'margin',
+   *   value, // 'space.200'
+   *   fixer,
+   * )
+   * ```
+   * Will result in `{ padding: 'space.100', margin: 'space.200'}`
+   */
+  appendEntry(node, key, value, fixer) {
+    return fixer.insertTextAfter(node.properties[node.properties.length - 1], `${property({
+      key: identifier(key),
+      value: literal(value)
+    }).toString()}, `);
+  }
+};
+export { ASTObjectExpression as Object };

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::d1a459e1ea71650f65b2890dc86cc398>>
+ * @codegen <<SignedSource::5026ba2cb55b3c1bcacbfe7fb7728a6c>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 export default {
@@ -10,6 +10,7 @@ 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',