@atlaskit/eslint-plugin-design-system 4.0.0 → 4.2.0

package/dist/esm/rules/use-visually-hidden/utils.js

@@ -0,0 +1,74 @@
+// eslint-disable-next-line import/no-unresolved
+// eslint-disable-next-line @atlaskit/design-system/use-visually-hidden
+var referenceObject = {
+  width: '1px',
+  height: '1px',
+  padding: '0',
+  position: 'absolute',
+  border: '0',
+  clip: 'rect(1px, 1px, 1px, 1px)',
+  overflow: 'hidden',
+  whiteSpace: 'nowrap'
+};
+
+/**
+ * Returns the first import in the esprima AST.
+ */
+export var getFirstImport = function getFirstImport(source) {
+  return source.ast.body.find(function (node) {
+    return node.type === 'ImportDeclaration';
+  });
+};
+/**
+ * Takes a template literal and returns [key, value] array of the css properties
+ */
+
+export var makeTemplateLiteralIntoEntries = function makeTemplateLiteralIntoEntries(templateString) {
+  return templateString.replace(/\n/g, '').split(/;|{|}/).filter(function (el) {
+    return !el.match(/\@/);
+  }).map(function (el) {
+    return el.trim().split(':').map(function (e) {
+      return e.trim();
+    });
+  });
+};
+/**
+ * Given a node, translate the node into css key-value pairs and
+ * compare the output to the reference styles required to make a
+ * visually hidden element.
+ *
+ * @returns {number} A fraction between 0-1 depending on the object's likeness.
+ */
+
+export var getObjectLikeness = function getObjectLikeness(node) {
+  var styleEntries = node.properties.map(function (_ref) {
+    var type = _ref.type,
+        key = _ref.key,
+        value = _ref.value;
+
+    if (type === 'Property' && key.type === 'Identifier') {
+      return {
+        key: key.name,
+        value: value.type === 'Literal' && value.value
+      };
+    }
+
+    return null;
+  }).filter(function (node) {
+    return Boolean(node);
+  });
+  return countMatchingKeyValues(styleEntries);
+};
+export var countMatchingKeyValues = function countMatchingKeyValues(styleEntries) {
+  var matchingStyleEntries = styleEntries.filter(function (entry) {
+    return entry.key in referenceObject;
+  });
+
+  if (styleEntries.length < 5) {
+    return 0;
+  }
+
+  return matchingStyleEntries.reduce(function (acc, curr) {
+    return acc + (referenceObject[curr === null || curr === void 0 ? void 0 : curr.key] === (curr === null || curr === void 0 ? void 0 : curr.value) ? 1.5 : 0.75);
+  }, 0) / styleEntries.length;
+};

package/dist/esm/rules/utils/get-import-node-by-source.js

@@ -0,0 +1,14 @@
+/* eslint-disable import/no-unresolved */
+
+/**
+ * @param {SourceCode} source The eslint source
+ * @param {string} path The path specified to find
+ * @returns {ImportDeclaration}
+ */
+export var getImportedNodeBySource = function getImportedNodeBySource(source, path) {
+  return source.ast.body.filter(function (node) {
+    return node.type === 'ImportDeclaration';
+  }).find(function (node) {
+    return node.source.value === path;
+  });
+};

package/dist/esm/rules/utils/is-color.js

@@ -41,7 +41,8 @@ export var isHardCodedColor = function isHardCodedColor(value) {
     return true;
   }
 
-  if (value.startsWith('#') && (value.length === 4 || value.length === 7 || value.length === 9)) {
+  if (value.startsWith('#') && ( // short hex, hex, or hex with alpha
+  value.length === 4 || value.length === 7 || value.length === 9)) {
     return true;
   }
 

package/dist/esm/rules/utils/is-node.js

@@ -34,6 +34,12 @@ export var isDecendantOfStyleJsxAttribute = function isDecendantOfStyleJsxAttrib
 
   return false;
 };
+export var isStyledTemplateNode = function isStyledTemplateNode(node) {
+  return (node === null || node === void 0 ? void 0 : node.type) === 'TaggedTemplateExpression' && node.tag.type === 'MemberExpression' && node.tag.object.type === 'Identifier' && node.tag.object.name === 'styled';
+};
+export var isStyledObjectNode = function isStyledObjectNode(node) {
+  return (node === null || node === void 0 ? void 0 : node.type) === 'CallExpression' && node.callee.type === 'MemberExpression' && node.callee.object.type === 'Identifier' && node.callee.object.name === 'styled';
+};
 export var isDecendantOfStyleBlock = function isDecendantOfStyleBlock(node) {
   if (node.type === 'VariableDeclarator') {
     if (node.id.type !== 'Identifier') {
@@ -65,7 +71,7 @@ export var isDecendantOfStyleBlock = function isDecendantOfStyleBlock(node) {
     return true;
   }
 
-  if (node.type === 'TaggedTemplateExpression' && node.tag.type === 'MemberExpression' && node.tag.object.type === 'Identifier' && node.tag.object.name === 'styled') {
+  if (isStyledTemplateNode(node)) {
     return true;
   }
 
@@ -81,4 +87,19 @@ export var isDecendantOfStyleBlock = function isDecendantOfStyleBlock(node) {
 };
 export var isChildOfType = function isChildOfType(node, type) {
   return node.parent.type === type;
+};
+/**
+ * Given a node, walk up the tree until there is no parent OR a common ancestor of the correct type is found
+ */
+
+export var getClosestNodeOfType = function getClosestNodeOfType(node, type) {
+  if (!node) {
+    return node;
+  }
+
+  if (node.type === type) {
+    return node;
+  }
+
+  return getClosestNodeOfType(node.parent, type);
 };

package/dist/esm/rules/utils/remove-named-import.js

@@ -0,0 +1,20 @@
+/* eslint-disable import/no-unresolved */
+
+/**
+ * @param {SourceCode} source The eslint source
+ * @param {string} path The path specified to find
+ * @returns FixerObject
+ */
+export var removeNamedImport = function removeNamedImport(fixer, importNode, name) {
+  var filteredSpecifers = importNode.specifiers.filter(function (node) {
+    return node.type === 'ImportSpecifier' && node.imported.name !== name;
+  });
+
+  if (filteredSpecifers.length) {
+    return fixer.remove(importNode.specifiers.find(function (node) {
+      return node.type === 'ImportSpecifier' && node.imported.name === name;
+    }));
+  }
+
+  return fixer.remove(importNode);
+};

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/eslint-plugin-design-system",
-	"version": "4.0.0",
+	"version": "4.2.0",
 	"sideEffects": false
 }

package/dist/types/index.d.ts

@@ -1,13 +1,18 @@
 export declare const rules: {
     'ensure-design-token-usage': import("eslint").Rule.RuleModule;
     'no-unsafe-design-token-usage': import("eslint").Rule.RuleModule;
+    'no-deprecated-design-token-usage': import("eslint").Rule.RuleModule;
     'no-deprecated-imports': import("eslint").Rule.RuleModule;
+    'no-deprecated-apis': import("eslint").Rule.RuleModule;
+    'use-visually-hidden': import("eslint").Rule.RuleModule;
 };
 export declare const configs: {
     recommended: {
         plugins: string[];
         rules: {
             '@atlaskit/design-system/no-deprecated-imports': string;
+            '@atlaskit/design-system/use-visually-hidden': string;
+            '@atlaskit/design-system/no-deprecated-apis': string;
         };
     };
 };

package/dist/types/rules/no-deprecated-apis/index.d.ts

@@ -0,0 +1,3 @@
+import type { Rule } from 'eslint';
+declare const rule: Rule.RuleModule;
+export default rule;

package/dist/types/rules/no-deprecated-design-token-usage/index.d.ts

@@ -0,0 +1,3 @@
+import type { Rule } from 'eslint';
+declare const rule: Rule.RuleModule;
+export default rule;

package/dist/types/rules/no-deprecated-imports/paths.d.ts

@@ -1,43 +1,62 @@
+export declare const namedThemeExports: {
+    importName: string;
+    message: string;
+}[];
 export declare const restrictedPaths: readonly [{
-    readonly name: "@atlaskit/navigation-next";
+    readonly path: "@atlaskit/navigation-next";
     readonly message: "navigation-next is deprecated. Please use '@atlaskit/atlassian-navigation' instead.";
 }, {
-    readonly name: "@atlaskit/field-base";
+    readonly path: "@atlaskit/field-base";
     readonly message: "field-base is deprecated. Please use the '@atlaskit/form' package instead.";
 }, {
-    readonly name: "@atlaskit/field-radio-group";
+    readonly path: "@atlaskit/field-radio-group";
     readonly message: "field-radio-group is deprecated. Please use '@atlaskit/radio' instead, and check the migration guide.";
 }, {
-    readonly name: "@atlaskit/field-range";
+    readonly path: "@atlaskit/field-range";
     readonly message: "field-range is deprecated. Please use '@atlaskit/range' instead.";
 }, {
-    readonly name: "@atlaskit/field-text";
+    readonly path: "@atlaskit/field-text";
     readonly message: "field-text is deprecated. Please use '@atlaskit/textfield' instead.";
 }, {
-    readonly name: "@atlaskit/field-text-area";
+    readonly path: "@atlaskit/field-text-area";
     readonly message: "field-text-area is deprecated. Please use '@atlaskit/textarea' instead.";
 }, {
-    readonly name: "@atlaskit/navigation";
+    readonly path: "@atlaskit/navigation";
     readonly message: "navigation is deprecated. Please use '@atlaskit/atlassian-navigation' instead.";
 }, {
-    readonly name: "@atlaskit/global-navigation";
+    readonly path: "@atlaskit/global-navigation";
     readonly message: "global-navigation is deprecated. Please use '@atlaskit/atlassian-navigation' for the horizontal nav bar, '@atlaskit/side-navigation' for the side nav, and '@atlaskit/page-layout' to layout your application.";
 }, {
-    readonly name: "@atlaskit/input";
+    readonly path: "@atlaskit/input";
     readonly message: "input is deprecated. This was an internal component and should not be used directly.";
 }, {
-    readonly name: "@atlaskit/layer";
+    readonly path: "@atlaskit/layer";
     readonly message: "layer is deprecated. This was an internal component and should not be used directly.";
 }, {
-    readonly name: "@atlaskit/single-select";
+    readonly path: "@atlaskit/single-select";
     readonly message: "single-select is deprecated. Please use '@atlaskit/select' instead.";
 }, {
-    readonly name: "@atlaskit/multi-select";
+    readonly path: "@atlaskit/multi-select";
     readonly message: "multi-select is deprecated. Please use '@atlaskit/select' instead.";
 }, {
-    readonly name: "@atlaskit/droplist";
+    readonly path: "@atlaskit/droplist";
     readonly message: "droplist is deprecated. For the pop-up behaviour please use '@atlaskit/popup' and for common menu components please use '@atlaskit/menu'.";
 }, {
-    readonly name: "@atlaskit/item";
+    readonly path: "@atlaskit/item";
     readonly message: "item is deprecated. Please use '@atlaskit/menu' instead.";
+}, {
+    readonly path: "@atlaskit/theme/constants";
+    readonly imports: {
+        importName: string;
+        message: string;
+    }[];
+}, {
+    readonly path: "@atlaskit/theme";
+    readonly imports: {
+        importName: string;
+        message: string;
+    }[];
+}, {
+    readonly path: "@atlaskit/icon-priority";
+    readonly message: "icon-priority is deprecated due to limited usage in Cloud products. It will be deleted after 21 April 2022.";
 }];

package/dist/types/rules/use-visually-hidden/constants.d.ts

@@ -0,0 +1,3 @@
+export declare const IMPORT_NAME = "AKVisuallyHidden";
+export declare const VISUALLY_HIDDEN_SOURCE = "@atlaskit/visually-hidden";
+export declare const VISUALLY_HIDDEN_IMPORT: string;

package/dist/types/rules/use-visually-hidden/fix-jsx.d.ts

@@ -0,0 +1,3 @@
+import type { Rule, SourceCode } from 'eslint';
+declare const _default: (source: SourceCode, node: Rule.Node) => (fixer: Rule.RuleFixer) => Rule.Fix[];
+export default _default;

package/dist/types/rules/use-visually-hidden/fix-vanilla.d.ts

@@ -0,0 +1,3 @@
+import type { Rule, SourceCode } from 'eslint';
+declare const _default: (source: SourceCode, node: Rule.Node) => (fixer: Rule.RuleFixer) => Rule.Fix[];
+export default _default;

package/dist/types/rules/use-visually-hidden/index.d.ts

@@ -0,0 +1,3 @@
+import type { Rule } from 'eslint';
+declare const rule: Rule.RuleModule;
+export default rule;

package/dist/types/rules/use-visually-hidden/utils.d.ts

@@ -0,0 +1,35 @@
+import type { SourceCode } from 'eslint';
+import type { ObjectExpression } from 'estree';
+declare const referenceObject: {
+    width: string;
+    height: string;
+    padding: string;
+    position: string;
+    border: string;
+    clip: string;
+    overflow: string;
+    whiteSpace: string;
+};
+declare type KeyValue = {
+    key: string;
+    value: string;
+};
+export declare type ReferenceObject = typeof referenceObject;
+/**
+ * Returns the first import in the esprima AST.
+ */
+export declare const getFirstImport: (source: SourceCode) => import("estree").FunctionDeclaration | import("estree").ExpressionStatement | import("estree").BlockStatement | import("estree").EmptyStatement | import("estree").DebuggerStatement | import("estree").WithStatement | import("estree").ReturnStatement | import("estree").LabeledStatement | import("estree").BreakStatement | import("estree").ContinueStatement | import("estree").IfStatement | import("estree").SwitchStatement | import("estree").ThrowStatement | import("estree").TryStatement | import("estree").WhileStatement | import("estree").DoWhileStatement | import("estree").ForStatement | import("estree").ForInStatement | import("estree").ForOfStatement | import("estree").VariableDeclaration | import("estree").ClassDeclaration | import("estree").ImportDeclaration | import("estree").ExportNamedDeclaration | import("estree").ExportDefaultDeclaration | import("estree").ExportAllDeclaration | import("estree").Directive | undefined;
+/**
+ * Takes a template literal and returns [key, value] array of the css properties
+ */
+export declare const makeTemplateLiteralIntoEntries: (templateString: string) => string[][];
+/**
+ * Given a node, translate the node into css key-value pairs and
+ * compare the output to the reference styles required to make a
+ * visually hidden element.
+ *
+ * @returns {number} A fraction between 0-1 depending on the object's likeness.
+ */
+export declare const getObjectLikeness: (node: ObjectExpression) => number;
+export declare const countMatchingKeyValues: (styleEntries: KeyValue[]) => number;
+export {};

package/dist/types/rules/utils/get-import-node-by-source.d.ts

@@ -0,0 +1,8 @@
+import type { SourceCode } from 'eslint';
+import type { ImportDeclaration } from 'estree';
+/**
+ * @param {SourceCode} source The eslint source
+ * @param {string} path The path specified to find
+ * @returns {ImportDeclaration}
+ */
+export declare const getImportedNodeBySource: (source: SourceCode, path: string) => ImportDeclaration | undefined;

package/dist/types/rules/utils/is-node.d.ts

@@ -1,6 +1,13 @@
 import type { Rule } from 'eslint';
+import type { CallExpression, TaggedTemplateExpression } from 'estree';
 export declare const isDecendantOfGlobalToken: (node: Rule.Node) => boolean;
 export declare const isDecendantOfType: (node: Rule.Node, type: Rule.Node['type'], skipNode?: boolean) => boolean;
 export declare const isDecendantOfStyleJsxAttribute: (node: Rule.Node) => boolean;
+export declare const isStyledTemplateNode: (node?: import("estree").Identifier | import("estree").SimpleLiteral | import("estree").RegExpLiteral | import("estree").FunctionExpression | import("estree").ArrowFunctionExpression | import("estree").ThisExpression | import("estree").ArrayExpression | import("estree").ObjectExpression | import("estree").YieldExpression | import("estree").UnaryExpression | import("estree").UpdateExpression | import("estree").BinaryExpression | import("estree").AssignmentExpression | import("estree").LogicalExpression | import("estree").MemberExpression | import("estree").ConditionalExpression | import("estree").SimpleCallExpression | import("estree").NewExpression | import("estree").SequenceExpression | import("estree").TemplateLiteral | TaggedTemplateExpression | import("estree").ClassExpression | import("estree").MetaProperty | import("estree").AwaitExpression | null | undefined) => node is TaggedTemplateExpression;
+export declare const isStyledObjectNode: (node?: import("estree").Identifier | import("estree").SimpleLiteral | import("estree").RegExpLiteral | import("estree").FunctionExpression | import("estree").ArrowFunctionExpression | import("estree").ThisExpression | import("estree").ArrayExpression | import("estree").ObjectExpression | import("estree").YieldExpression | import("estree").UnaryExpression | import("estree").UpdateExpression | import("estree").BinaryExpression | import("estree").AssignmentExpression | import("estree").LogicalExpression | import("estree").MemberExpression | import("estree").ConditionalExpression | import("estree").SimpleCallExpression | import("estree").NewExpression | import("estree").SequenceExpression | import("estree").TemplateLiteral | TaggedTemplateExpression | import("estree").ClassExpression | import("estree").MetaProperty | import("estree").AwaitExpression | null | undefined) => node is CallExpression;
 export declare const isDecendantOfStyleBlock: (node: Rule.Node) => boolean;
 export declare const isChildOfType: (node: Rule.Node, type: Rule.Node['type']) => boolean;
+/**
+ * Given a node, walk up the tree until there is no parent OR a common ancestor of the correct type is found
+ */
+export declare const getClosestNodeOfType: (node: Rule.Node, type: Rule.NodeTypes) => Rule.Node;

package/dist/types/rules/utils/remove-named-import.d.ts

@@ -0,0 +1,8 @@
+import type { Rule } from 'eslint';
+import type { ImportDeclaration } from 'estree';
+/**
+ * @param {SourceCode} source The eslint source
+ * @param {string} path The path specified to find
+ * @returns FixerObject
+ */
+export declare const removeNamedImport: (fixer: Rule.RuleFixer, importNode: ImportDeclaration, name: string) => Rule.Fix;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/eslint-plugin-design-system",
-  "version": "4.0.0",
+  "version": "4.2.0",
   "author": "Atlassian Pty Ltd",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -20,12 +20,16 @@
     ".": "./src/index.tsx"
   },
   "dependencies": {
-    "@atlaskit/tokens": "^0.4.0",
+    "@atlaskit/tokens": "^0.6.0",
     "@babel/runtime": "^7.0.0"
   },
   "devDependencies": {
+    "@atlaskit/theme": "^12.0.2",
     "@atlassian/atlassian-frontend-prettier-config-1.0.1": "npm:@atlassian/atlassian-frontend-prettier-config@1.0.1",
+    "@emotion/core": "^10.0.9",
+    "@emotion/styled": "^10.0.7",
     "eslint": "^7.7.0",
+    "react": "^16.8.0",
     "ts-node": "^10.0.0",
     "tsconfig-paths": "^3.9.0",
     "typescript": "3.9.6"