@atlaskit/eslint-plugin-design-system 8.15.4 → 8.16.0

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

@@ -1,359 +0,0 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-// eslint-disable-next-line import/no-extraneous-dependencies
-
-import { getIdentifierInParentScope, hasImportDeclaration, insertImportDeclaration, insertImportSpecifier, isNodeOfType, jsxAttribute, jsxIdentifier, jsxOpeningElement, literal } from 'eslint-codemod-utils';
-export var shouldSuggestBox = function shouldSuggestBox(node
-// scope: Scope.Scope,
-) {
-  if (!node) {
-    return false;
-  }
-  if (!isValidPrimitiveElement(node)) {
-    return false;
-  }
-
-  /**
-   * Check for empty elements: `<div></div>` || `<span></span>`
-   */
-  if (node.children.length === 0) {
-    return true;
-  }
-
-  /**
-   * Check for elements containing only whitespace. e.g. `<div> </div>` || `<span> </span>`
-   */
-  if (containsOnlyWhitespace(node)) {
-    return true;
-  }
-
-  /**
-   * If an element contains more than one JSX child, then we don't want to convert it.
-   */
-  var JSXChildren = getChildrenByType(node, ['JSXElement']);
-  if (JSXChildren.length > 1) {
-    return false;
-  }
-
-  /**
-   * Check for things like:
-   * ```
-   * <div>
-   *   <h2>heading</h2>
-   *   subheading <= rejected because of standalone piece of text
-   * </div>
-   * ```
-   */
-  var nonWhiteSpaceTextChildren = getChildrenByType(node, ['JSXText']).filter(function (child) {
-    return !isWhiteSpace(child.value);
-  });
-  if (nonWhiteSpaceTextChildren.length > 0) {
-    return false;
-  }
-
-  // Possible since we now know the div only has one child
-  // const singleChild = node.children[0];
-
-  // // let's narrow down the type inside of the expression
-  // if (isNodeOfType(singleChild, 'JSXExpressionContainer')) {
-  //   const expression = singleChild.expression;
-
-  //   // If an Identifier that is just a string then should be a <Text>, not <Box>
-  //   const identifier =
-  //     isNodeOfType(expression, 'Identifier') &&
-  //     getIdentifierInParentScope(scope, expression.name);
-
-  //   if (
-  //     identifier &&
-  //     (isVariableAnnotatedWithType(identifier, 'StringTypeAnnotation') ||
-  //       isVariableAnnotatedWithType(identifier, 'TSStringKeyword'))
-  //   ) {
-  //     return false;
-  //   }
-  // }
-
-  return true;
-};
-export var shouldSuggestInline = function shouldSuggestInline(node, context) {
-  if (!node) {
-    return false;
-  }
-  if (!isValidPrimitiveElement(node)) {
-    return false;
-  }
-  var cssStyleObject = getCSSPropStyleObject(node, context);
-  if (!cssStyleObject) {
-    return false;
-  }
-  if (!hasInlineCompatibleStyles(cssStyleObject)) {
-    return false;
-  }
-  var JSXChildren = getChildrenByType(node, ['JSXElement']);
-  if (JSXChildren.length < 2) {
-    return false;
-  }
-  return true;
-};
-export var shouldSuggestStack = function shouldSuggestStack(node, context) {
-  if (!node) {
-    return false;
-  }
-  if (!isValidPrimitiveElement(node)) {
-    return false;
-  }
-  var cssStyleObject = getCSSPropStyleObject(node, context);
-  if (!cssStyleObject) {
-    return false;
-  }
-  if (!hasStackCompatibleStyles(cssStyleObject)) {
-    return false;
-  }
-  var JSXChildren = getChildrenByType(node, ['JSXElement']);
-  if (JSXChildren.length < 2) {
-    return false;
-  }
-  return true;
-};
-export var shouldSuggestText = function shouldSuggestText(node, scope) {
-  if (!node) {
-    return true;
-  }
-
-  // node doesn't have children then it should be a <Box>
-  if (!node.children || node.children.length === 0) {
-    return false;
-  }
-  var containsOnlyText = node.children.filter(function (child) {
-    return isNodeOfType(child, 'Literal') || isNodeOfType(child, 'JSXText');
-  });
-  if (containsOnlyText) {
-    return true;
-  }
-
-  // if the element contains strictly a single child... let's see what we can discover
-  if (node.children.length === 1) {
-    var singleChild = node.children[0];
-
-    // let's narrow down the type inside of the expression
-    if (isNodeOfType(singleChild, 'JSXExpressionContainer')) {
-      var expression = singleChild.expression;
-
-      // A direct Literal is another case for only <Text>
-      if (isNodeOfType(expression, 'Literal')) {
-        return true;
-      }
-
-      // If an Identifier then we want to confirm it's just string to suggest only <Text>
-      var identifier = isNodeOfType(expression, 'Identifier') && getIdentifierInParentScope(scope, expression.name);
-      if (identifier && (isVariableAnnotatedWithType(identifier, 'StringTypeAnnotation') || isVariableAnnotatedWithType(identifier, 'TSStringKeyword'))) {
-        return true;
-      }
-    }
-  }
-  return true;
-};
-export var primitiveFixer = function primitiveFixer(node, nodeName, context) {
-  return function (fixer) {
-    if (!isNodeOfType(node, 'JSXOpeningElement')) {
-      return [];
-    }
-    var parent = node.parent;
-    if (!isNodeOfType(parent, 'JSXElement')) {
-      return [];
-    }
-    var fixes = [];
-    var body = context.getSourceCode().ast.body;
-    var imports = body.filter(function (node) {
-      return isNodeOfType(node, 'ImportDeclaration');
-    });
-    var primitivesNode = imports.find(function (node) {
-      return hasImportDeclaration(node, '@atlaskit/primitives');
-    });
-    if (!primitivesNode) {
-      fixes.push(fixer.insertTextBefore(body[0], "".concat(insertImportDeclaration('@atlaskit/primitives', [nodeName]), ";\n")));
-    } else {
-      fixes.push(fixer.replaceText(primitivesNode, "".concat(insertImportSpecifier(primitivesNode, nodeName), ";\n")));
-    }
-    var closingElement = parent.closingElement;
-    var jsxId = jsxIdentifier(nodeName);
-    var attributes = [];
-
-    // Box defaults to div. We only need to add an as prop if it's not a div
-    if (node.name.name !== 'div' && nodeName === 'Box') {
-      var asProp = jsxAttribute({
-        name: jsxIdentifier('as'),
-        value: literal({
-          value: "".concat(node.name.name),
-          raw: "\"".concat(node.name.name, "\"")
-        })
-      });
-      attributes.push(asProp);
-    }
-    var hasStylingProps = getJSXAttributeByName(node, 'style') || getJSXAttributeByName(node, 'css') || getJSXAttributeByName(node, 'class') || getJSXAttributeByName(node, 'className');
-    if (hasStylingProps) {
-      fixes.push(fixer.insertTextBefore(node, '// TODO: Manually convert styling into props\n'));
-    }
-    var candidateAttributes = node.attributes.map(function (attr) {
-      // pull out any named attributes we can re-map
-      if (isNodeOfType(attr, 'JSXAttribute')) {
-        if (attr.name.name === 'data-testid') {
-          return jsxAttribute(_objectSpread(_objectSpread({}, attr), {}, {
-            name: jsxIdentifier('testId')
-          }));
-        }
-      }
-      return attr;
-    }).filter(Boolean);
-    fixes.push(fixer.replaceText(node, jsxOpeningElement(_objectSpread(_objectSpread({}, node), {}, {
-      name: jsxId,
-      attributes: candidateAttributes.concat(attributes)
-    })).toString()));
-    if (closingElement && closingElement.name) {
-      fixes.push(fixer.replaceText(closingElement.name, "".concat(jsxId)));
-    }
-    return fixes;
-  };
-};
-var isVariableAnnotatedWithType = function isVariableAnnotatedWithType(identifier, typeAnnotation) {
-  var _identifiers$;
-  if (!identifier || identifier.identifiers.length === 0) {
-    return false;
-  }
-  var typeAnnotationObject = (_identifiers$ = identifier.identifiers[0]) === null || _identifiers$ === void 0 || (_identifiers$ = _identifiers$.typeAnnotation) === null || _identifiers$ === void 0 ? void 0 : _identifiers$.typeAnnotation;
-
-  // variable declaration lacks type definitions
-  if (!typeAnnotationObject) {
-    return false;
-  }
-
-  // single type annotation
-  if (typeAnnotationObject.type === typeAnnotation) {
-    return true;
-  }
-  return false;
-};
-var getJSXAttributeByName = function getJSXAttributeByName(node, attrName) {
-  return node.attributes.find(function (attr) {
-    // Ignore JSXSpreadAttributes
-    if (!isNodeOfType(attr, 'JSXAttribute')) {
-      return false;
-    }
-    return attr.name.name === attrName;
-  });
-};
-export var isWhiteSpace = function isWhiteSpace(value) {
-  return value.trim() === '';
-};
-function containsOnlyWhitespace(node) {
-  return node.children.every(function (child) {
-    if (!isNodeOfType(child, 'JSXText')) {
-      return false;
-    }
-    return isWhiteSpace(child.value);
-  });
-}
-export var getChildrenByType = function getChildrenByType(node, types) {
-  return node.children.filter(function (child) {
-    return types.find(function (type) {
-      return isNodeOfType(child, type);
-    });
-  });
-};
-
-// FIXME: This not correctly typed
-
-var getCSSPropStyleObject = function getCSSPropStyleObject(node, context) {
-  var cssAttr = getJSXAttributeByName(node.openingElement, 'css');
-  var styleObj = {};
-  if (cssAttr && cssAttr.value) {
-    var scope = context.getScope();
-    var _ref = cssAttr.value,
-      expression = _ref.expression;
-    var variableDeclarator = getIdentifierInParentScope(scope, expression.name);
-    var defNode = variableDeclarator === null || variableDeclarator === void 0 ? void 0 : variableDeclarator.defs[0];
-    if (!defNode) {
-      return undefined;
-    }
-
-    // check if the variable declaration has a call expression init
-    // eg we're looking for css() type inits
-    if (!isNodeOfType(defNode.node, 'VariableDeclarator') && !isNodeOfType(defNode.node.init, 'CallExpression')) {
-      return undefined;
-    }
-    var init = defNode.node.init;
-
-    // make the sure the init is called 'css'
-    if (!(isNodeOfType(init.callee, 'Identifier') && init.callee.name === 'css')) {
-      return undefined;
-    }
-    var styles = init.arguments[0];
-    if (!styles) {
-      return undefined;
-    }
-
-    // make sure the styles are object styles (they should be but let's just double check)
-    if (!isNodeOfType(styles, 'ObjectExpression')) {
-      return undefined;
-    }
-    styles.properties.forEach(function (prop) {
-      if (!isNodeOfType(prop, 'Property')) {
-        return;
-      }
-      if (!isNodeOfType(prop.key, 'Identifier')) {
-        return;
-      }
-      if (!isNodeOfType(prop.value, 'Literal')) {
-        return;
-      }
-      styleObj[prop.key.name] = prop.value.value;
-    });
-  }
-  return styleObj;
-};
-export var validPrimitiveElements = new Set(['div', 'span', 'article', 'aside', 'dialog', 'footer', 'header', 'li', 'main', 'nav', 'ol', 'section', 'ul']);
-export var isValidPrimitiveElement = function isValidPrimitiveElement(node) {
-  return validPrimitiveElements.has(node.openingElement.name.name);
-};
-var hasInlineCompatibleStyles = function hasInlineCompatibleStyles(cssStyleObject) {
-  if (!['flex', 'inline-flex'].includes(cssStyleObject['display'])) {
-    return false;
-  }
-
-  /**
-   * Default `flexDirection` is `'row'`, so we can recommend an Inline if
-   * it's `undefined`, or if it's explicitly `'row'` or `'row-reverse'`.
-   *
-   * Note: Currently we are including `'row-reverse'` even though Inline doesn't support it
-   * as an attempt to educate makers about accessibility concerns.   *
-   */
-  var flexDirection = cssStyleObject['flex-direction'] || cssStyleObject['flexDirection'];
-  var validFlexDirectionValue = ['row', 'row-reverse', undefined].includes(flexDirection);
-
-  /**
-   * Note: Currently we are including `'wrap-reverse'` even though Inline doesn't support it
-   * as an attempt to educate makers about accessibility concerns.
-   */
-  var flexWrap = cssStyleObject['flex-wrap'] || cssStyleObject['flexWrap'];
-  var validFlexWrapValue = ['wrap', 'wrap-reverse'].includes(flexWrap);
-  if (validFlexDirectionValue || validFlexWrapValue) {
-    return true;
-  }
-  return false;
-};
-var hasStackCompatibleStyles = function hasStackCompatibleStyles(cssStyleObject) {
-  if (!['flex', 'inline-flex'].includes(cssStyleObject['display'])) {
-    return false;
-  }
-
-  /**
-   * Note: Currently we are including `'column-reverse'` even though Stack doesn't support it
-   * as an attempt to educate makers about accessibility concerns.
-   */
-  var flexDirection = cssStyleObject['flex-direction'] || cssStyleObject['flexDirection'];
-  var validFlexDirectionValue = ['column', 'column-reverse'].includes(flexDirection);
-  if (!validFlexDirectionValue) {
-    return false;
-  }
-  return true;
-};

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

@@ -1,13 +0,0 @@
-import type { Rule, Scope } from 'eslint';
-import { EslintNode, JSXElement, JSXExpressionContainer, JSXText } from 'eslint-codemod-utils';
-export declare const shouldSuggestBox: (node: JSXElement) => boolean;
-export declare const shouldSuggestInline: (node: JSXElement, context: Rule.RuleContext) => boolean;
-export declare const shouldSuggestStack: (node: JSXElement, context: Rule.RuleContext) => boolean;
-export declare const shouldSuggestText: (node: JSXElement | undefined, scope: Scope.Scope) => boolean;
-export declare const primitiveFixer: (node: EslintNode, nodeName: string, context: Rule.RuleContext) => (fixer: Rule.RuleFixer) => Rule.Fix[];
-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: Set<string>;
-export declare const isValidPrimitiveElement: (node: JSXElement) => boolean;
-export {};

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

@@ -1,13 +0,0 @@
-import type { Rule, Scope } from 'eslint';
-import { EslintNode, JSXElement, JSXExpressionContainer, JSXText } from 'eslint-codemod-utils';
-export declare const shouldSuggestBox: (node: JSXElement) => boolean;
-export declare const shouldSuggestInline: (node: JSXElement, context: Rule.RuleContext) => boolean;
-export declare const shouldSuggestStack: (node: JSXElement, context: Rule.RuleContext) => boolean;
-export declare const shouldSuggestText: (node: JSXElement | undefined, scope: Scope.Scope) => boolean;
-export declare const primitiveFixer: (node: EslintNode, nodeName: string, context: Rule.RuleContext) => (fixer: Rule.RuleFixer) => Rule.Fix[];
-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: Set<string>;
-export declare const isValidPrimitiveElement: (node: JSXElement) => boolean;
-export {};