@atlaskit/eslint-plugin-design-system 4.19.1 → 5.0.0

package/CHANGELOG.md

@@ -1,5 +1,30 @@
 # @atlaskit/eslint-plugin-design-system
 
+## 5.0.0
+
+### Major Changes
+
+- [`b910bbe6130`](https://bitbucket.org/atlassian/atlassian-frontend/commits/b910bbe6130) - The following rules are now included in the recommended preset as errors:
+
+  - ensure-design-token-usage
+  - no-deprecated-apis
+  - no-deprecated-imports
+  - no-unsafe-design-token-usage
+
+  The following rules are now included in the recommended preset as warnings:
+
+  - no-deprecated-design-token-usage
+
+### Minor Changes
+
+- [`b689e24847d`](https://bitbucket.org/atlassian/atlassian-frontend/commits/b689e24847d) - All lint rule violations in IDEs now point to their corresponding documentation on https://atlassian.design.
+
+## 4.20.0
+
+### Minor Changes
+
+- [`fa50be73bfe`](https://bitbucket.org/atlassian/atlassian-frontend/commits/fa50be73bfe) - [ux] Spacing rule now also looks at and attempts to parse additional properties.
+
 ## 4.19.1
 
 ### Patch Changes

package/README.md

@@ -49,15 +49,15 @@ module.exports = {
 
 | Rule                                                                                                    | Description                                                                                     | Recommended | Fixable | Suggestions |
 | ------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------- | ----------- | ------- | ----------- |
-| <a href="./src/rules/ensure-design-token-usage/README.md">ensure-design-token-usage</a>                 | Enforces usage of design tokens.                                                                |             | Yes     | Yes         |
+| <a href="./src/rules/ensure-design-token-usage/README.md">ensure-design-token-usage</a>                 | Enforces usage of design tokens.                                                                | Yes         | Yes     | Yes         |
 | <a href="./src/rules/ensure-design-token-usage-spacing/README.md">ensure-design-token-usage-spacing</a> | Enforces usage of spacing design tokens rather than hard-coded values.                          |             | Yes     |             |
 | <a href="./src/rules/icon-label/README.md">icon-label</a>                                               | Enforces accessible usage of icon labels when composed with Atlassian Design System components. | Yes         | Yes     |             |
 | <a href="./src/rules/no-banned-imports/README.md">no-banned-imports</a>                                 | Disallow importing banned modules.                                                              | Yes         |         |             |
 | <a href="./src/rules/no-deprecated-apis/README.md">no-deprecated-apis</a>                               | Disallow using deprecated APIs.                                                                 | Yes         |         |             |
-| <a href="./src/rules/no-deprecated-design-token-usage/README.md">no-deprecated-design-token-usage</a>   | Disallow using deprecated design tokens.                                                        |             | Yes     |             |
+| <a href="./src/rules/no-deprecated-design-token-usage/README.md">no-deprecated-design-token-usage</a>   | Disallow using deprecated design tokens.                                                        | Yes         | Yes     |             |
 | <a href="./src/rules/no-deprecated-imports/README.md">no-deprecated-imports</a>                         | Disallow importing deprecated modules.                                                          | Yes         |         |             |
 | <a href="./src/rules/no-margin/README.md">no-margin</a>                                                 | Disallow using the margin CSS property.                                                         |             |         |             |
-| <a href="./src/rules/no-unsafe-design-token-usage/README.md">no-unsafe-design-token-usage</a>           | Enforces design token usage is statically and locally analyzable.                               |             | Yes     |             |
+| <a href="./src/rules/no-unsafe-design-token-usage/README.md">no-unsafe-design-token-usage</a>           | Enforces design token usage is statically and locally analyzable.                               | Yes         | Yes     |             |
 | <a href="./src/rules/use-primitives/README.md">use-primitives</a>                                       | Encourage the usage of primitives components.                                                   |             | Yes     |             |
 | <a href="./src/rules/use-visually-hidden/README.md">use-visually-hidden</a>                             | Enforce usage of the visually hidden component.                                                 | Yes         | Yes     |             |
 

package/constellation/index/usage.mdx

@@ -13,15 +13,15 @@ This plugin contains rules that should be used when working with the [Atlassian
 
 | Rule                                                                               | Description                                                                                     | Recommended | Fixable | Suggestions |
 | ---------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------- | ----------- | ------- | ----------- |
-| <a href="#ensure-design-token-usage">ensure-design-token-usage</a>                 | Enforces usage of design tokens.                                                                |             | Yes     | Yes         |
+| <a href="#ensure-design-token-usage">ensure-design-token-usage</a>                 | Enforces usage of design tokens.                                                                | Yes         | Yes     | Yes         |
 | <a href="#ensure-design-token-usage-spacing">ensure-design-token-usage-spacing</a> | Enforces usage of spacing design tokens rather than hard-coded values.                          |             | Yes     |             |
 | <a href="#icon-label">icon-label</a>                                               | Enforces accessible usage of icon labels when composed with Atlassian Design System components. | Yes         | Yes     |             |
 | <a href="#no-banned-imports">no-banned-imports</a>                                 | Disallow importing banned modules.                                                              | Yes         |         |             |
 | <a href="#no-deprecated-apis">no-deprecated-apis</a>                               | Disallow using deprecated APIs.                                                                 | Yes         |         |             |
-| <a href="#no-deprecated-design-token-usage">no-deprecated-design-token-usage</a>   | Disallow using deprecated design tokens.                                                        |             | Yes     |             |
+| <a href="#no-deprecated-design-token-usage">no-deprecated-design-token-usage</a>   | Disallow using deprecated design tokens.                                                        | Yes         | Yes     |             |
 | <a href="#no-deprecated-imports">no-deprecated-imports</a>                         | Disallow importing deprecated modules.                                                          | Yes         |         |             |
 | <a href="#no-margin">no-margin</a>                                                 | Disallow using the margin CSS property.                                                         |             |         |             |
-| <a href="#no-unsafe-design-token-usage">no-unsafe-design-token-usage</a>           | Enforces design token usage is statically and locally analyzable.                               |             | Yes     |             |
+| <a href="#no-unsafe-design-token-usage">no-unsafe-design-token-usage</a>           | Enforces design token usage is statically and locally analyzable.                               | Yes         | Yes     |             |
 | <a href="#use-primitives">use-primitives</a>                                       | Encourage the usage of primitives components.                                                   |             | Yes     |             |
 | <a href="#use-visually-hidden">use-visually-hidden</a>                             | Enforce usage of the visually hidden component.                                                 | Yes         | Yes     |             |
 
@@ -48,7 +48,7 @@ import { B100 } from '@atlaskit/theme/colors';
 css({ color: 'red' });
               ^^^
 css({ boxShadow: '0px 1px 1px #161A1D32' });
-                          ^^^^^^^^^
+                              ^^^^^^^^^
 css`${e100};`;
       ^^^^
 css({ color: B100 });
@@ -60,6 +60,8 @@ css({ color: B100 });
 ```js
 import { token } from '@atlaskit/tokens';
 
+css({ color: token('color.text.danger') });
+
 css({ boxShadow: token('elevation.shadow.card') });
 ```
 

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

@@ -6,16 +6,19 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::bd61b874ee0323855e0ad920b54e84cc>>
+ * @codegen <<SignedSource::b3d2f24d8d37a87fc2bbd964dfdcb87c>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 var _default = {
   plugins: ['@atlaskit/design-system'],
   rules: {
+    '@atlaskit/design-system/ensure-design-token-usage': 'error',
     '@atlaskit/design-system/icon-label': 'warn',
     '@atlaskit/design-system/no-banned-imports': 'error',
-    '@atlaskit/design-system/no-deprecated-apis': 'warn',
-    '@atlaskit/design-system/no-deprecated-imports': 'warn',
+    '@atlaskit/design-system/no-deprecated-apis': 'error',
+    '@atlaskit/design-system/no-deprecated-design-token-usage': 'warn',
+    '@atlaskit/design-system/no-deprecated-imports': 'error',
+    '@atlaskit/design-system/no-unsafe-design-token-usage': 'error',
     '@atlaskit/design-system/use-visually-hidden': 'error'
   }
 };

package/dist/cjs/rules/ensure-design-token-usage/index.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _eslintCodemodUtils = require("eslint-codemod-utils");
+var _createRule = require("../utils/create-rule");
 var _getIsException = require("../utils/get-is-exception");
 var _isColor = require("../utils/is-color");
 var _isElevation = require("../utils/is-elevation");
@@ -34,19 +35,19 @@ var filterSuggestion = function filterSuggestion(_ref) {
   var shouldReturnSuggestion = _ref.shouldReturnSuggestion;
   return shouldReturnSuggestion;
 };
-var rule = {
+var rule = (0, _createRule.createLintRule)({
   meta: {
-    // We need to upgrade the version of ESLint.
+    name: 'ensure-design-token-usage',
     hasSuggestions: true,
     docs: {
       description: 'Enforces usage of design tokens.',
-      recommended: false
+      recommended: 'error'
     },
     fixable: 'code',
     type: 'problem',
     messages: {
-      legacyElevation: "Elevations can be sourced from the global theme using the token function made of both a background and shadow. Use \"card\" for card elevations, and \"overlay\" for anything else that should appear elevated.\n\n{{example}}\n",
-      hardCodedColor: "Colors can be sourced from the global theme using the token function.\n\n```\nimport { token } from '@atlaskit/tokens';\n\ntoken('color.background.blanket');\n```\n"
+      legacyElevation: "Elevations can be sourced from the global theme using the token function made of both a background and shadow. Use \"card\" for card elevations, and \"overlay\" for anything else that should appear elevated.",
+      hardCodedColor: "Colors can be sourced from the global theme using the token function."
     }
   },
   create: function create(context) {
@@ -192,6 +193,6 @@ var rule = {
       }
     };
   }
-};
+});
 var _default = rule;
 exports.default = _default;

package/dist/cjs/rules/ensure-design-token-usage-spacing/utils.js

@@ -28,7 +28,7 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
 var _eslintCodemodUtils = require("eslint-codemod-utils");
 var _tokensRaw = require("@atlaskit/tokens/tokens-raw");
 var typographyProperties = ['fontSize', 'fontWeight', 'fontFamily', 'lineHeight'];
-var properties = ['padding', 'paddingBlock', 'paddingInline', 'paddingLeft', 'paddingTop', 'paddingRight', 'paddingBottom', 'paddingInline', 'paddingInlineStart', 'paddingInlineEnd', 'paddingBlock', 'paddingBlockStart', 'paddingBlockEnd', 'marginLeft', 'marginTop', 'marginRight', 'marginBottom', 'marginInline', 'marginInlineStart', 'marginInlineEnd', 'marginBlock', 'marginBlockStart', 'marginBlockEnd', 'margin', 'gap', 'rowGap', 'gridRowGap', 'columnGap', 'gridColumnGap'];
+var properties = ['padding', 'paddingBlock', 'paddingInline', 'paddingLeft', 'paddingTop', 'paddingRight', 'paddingBottom', 'paddingInline', 'paddingInlineStart', 'paddingInlineEnd', 'paddingBlock', 'paddingBlockStart', 'paddingBlockEnd', 'marginLeft', 'marginTop', 'marginRight', 'marginBottom', 'marginInline', 'marginInlineStart', 'marginInlineEnd', 'marginBlock', 'marginBlockStart', 'marginBlockEnd', 'margin', 'gap', 'rowGap', 'gridRowGap', 'columnGap', 'gridColumnGap', 'top', 'left', 'right', 'bottom', 'inlineStart', 'inlineEnd', 'blockStart', 'blockEnd', 'outline-offset'];
 /**
  * Currently we have a wide range of experimental spacing tokens that we are testing.
  * We only want transforms to apply to the stable scale values, not the rest.

package/dist/cjs/rules/icon-label/index.js

@@ -5,18 +5,17 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _eslintCodemodUtils = require("eslint-codemod-utils");
+var _createRule = require("../utils/create-rule");
 var _jsx = require("../utils/jsx");
 var elements = ['AkButton', 'AKButton', 'Button', 'MenuItem', 'ButtonItem', 'CustomItem', 'CustomThemeButton', 'LoadingButton', 'BreadcrumbsItem'];
 var elementsIconProps = ['iconBefore', 'iconAfter', 'icon'];
-var rule = {
+var rule = (0, _createRule.createLintRule)({
   meta: {
+    name: 'icon-label',
     fixable: 'code',
     type: 'suggestion',
     docs: {
-      url: 'http://go/adsc/icon/usage#accessibility-guidelines',
       description: 'Enforces accessible usage of icon labels when composed with Atlassian Design System components.',
-      // TODO: Move to createRule() api
-      // @ts-expect-error
       recommended: 'warn'
     },
     messages: {
@@ -117,6 +116,6 @@ var rule = {
       })
     };
   }
-};
+});
 var _default = rule;
 exports.default = _default;

package/dist/cjs/rules/no-banned-imports/index.js

@@ -5,13 +5,15 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _eslintCodemodUtils = require("eslint-codemod-utils");
+var _createRule = require("../utils/create-rule");
 var _paths = require("./paths");
-var rule = {
+var rule = (0, _createRule.createLintRule)({
   meta: {
+    name: 'no-banned-imports',
     type: 'problem',
     docs: {
       description: 'Disallow importing banned modules.',
-      recommended: true
+      recommended: 'error'
     },
     messages: {
       path: "The '{{importSource}}' import is restricted from being used. {{customMessage}}"
@@ -45,6 +47,6 @@ var rule = {
       ExportDefaultDeclaration: checkNode
     };
   }
-};
+});
 var _default = rule;
 exports.default = _default;

package/dist/cjs/rules/no-deprecated-apis/index.js

@@ -39,7 +39,7 @@ var rule = (0, _createRule.createRule)({
     type: 'suggestion',
     docs: {
       description: 'Disallow using deprecated APIs.',
-      recommended: 'warn'
+      recommended: 'error'
     },
     messages: {
       noDeprecatedJSXAttributes: 'The JSX attribute {{propName}} has been deprecated.'

package/dist/cjs/rules/no-deprecated-design-token-usage/index.js

@@ -7,11 +7,13 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _renameMapping = _interopRequireDefault(require("@atlaskit/tokens/rename-mapping"));
 var _tokenIds = require("@atlaskit/tokens/token-ids");
-var rule = {
+var _createRule = require("../utils/create-rule");
+var rule = (0, _createRule.createLintRule)({
   meta: {
+    name: 'no-deprecated-design-token-usage',
     docs: {
       description: 'Disallow using deprecated design tokens.',
-      recommended: false
+      recommended: 'warn'
     },
     fixable: 'code',
     type: 'problem',
@@ -58,6 +60,6 @@ var rule = {
       }
     };
   }
-};
+});
 var _default = rule;
 exports.default = _default;

package/dist/cjs/rules/no-deprecated-imports/index.js

@@ -52,7 +52,7 @@ var rule = (0, _createRule.createRule)({
     type: 'suggestion',
     docs: {
       description: 'Disallow importing deprecated modules.',
-      recommended: 'warn'
+      recommended: 'error'
     },
     messages: {
       pathWithCustomMessage: "'{{importSource}}' import is restricted from being used. {{customMessage}}",

package/dist/cjs/rules/no-margin/index.js

@@ -5,10 +5,13 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _eslintCodemodUtils = require("eslint-codemod-utils");
-var rule = {
+var _createRule = require("../utils/create-rule");
+var rule = (0, _createRule.createLintRule)({
   meta: {
+    name: 'no-margin',
     type: 'problem',
     docs: {
+      recommended: false,
       description: 'Disallow using the margin CSS property.'
     },
     messages: {
@@ -78,6 +81,6 @@ var rule = {
       }
     };
   }
-};
+});
 var _default = rule;
 exports.default = _default;

package/dist/cjs/rules/no-unsafe-design-token-usage/index.js

@@ -9,16 +9,18 @@ var _eslintCodemodUtils = require("eslint-codemod-utils");
 var _renameMapping = _interopRequireDefault(require("@atlaskit/tokens/rename-mapping"));
 var _tokenIds = require("@atlaskit/tokens/token-ids");
 var _tokenNames = _interopRequireDefault(require("@atlaskit/tokens/token-names"));
+var _createRule = require("../utils/create-rule");
 var _isNode = require("../utils/is-node");
 var _isToken = require("../utils/is-token");
 var defaultConfig = {
   shouldEnforceFallbacks: false
 };
-var rule = {
+var rule = (0, _createRule.createLintRule)({
   meta: {
+    name: 'no-unsafe-design-token-usage',
     docs: {
       description: 'Enforces design token usage is statically and locally analyzable.',
-      recommended: false
+      recommended: 'error'
     },
     fixable: 'code',
     type: 'problem',
@@ -173,6 +175,6 @@ var rule = {
       }
     };
   }
-};
+});
 var _default = rule;
 exports.default = _default;

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

@@ -5,12 +5,14 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _eslintCodemodUtils = require("eslint-codemod-utils");
+var _createRule = require("../utils/create-rule");
 var _utils = require("./utils");
 var boxDocsUrl = 'https://atlassian.design/components/primitves/box/examples';
 var inlineDocsUrl = 'https://atlassian.design/components/primitves/inline/examples';
 var stackDocsUrl = 'https://atlassian.design/components/primitves/stack/examples';
-var rule = {
+var rule = (0, _createRule.createLintRule)({
   meta: {
+    name: 'use-primitives',
     type: 'suggestion',
     fixable: 'code',
     docs: {
@@ -104,6 +106,6 @@ var rule = {
       }
     };
   }
-};
+});
 var _default = rule;
 exports.default = _default;

package/dist/cjs/rules/use-visually-hidden/index.js

@@ -7,20 +7,20 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _eslintCodemodUtils = require("eslint-codemod-utils");
+var _createRule = require("../utils/create-rule");
 var _isNode = require("../utils/is-node");
 var _fixJsx = _interopRequireDefault(require("./fix-jsx"));
 var _fixVanilla = _interopRequireDefault(require("./fix-vanilla"));
 var _utils = require("./utils");
-/* eslint-disable @atlaskit/design-system/use-visually-hidden */
-
 var THEME_IMPORT_NAMES = ['visuallyHidden', 'assistive'];
-var rule = {
+var rule = (0, _createRule.createLintRule)({
   meta: {
+    name: 'use-visually-hidden',
     type: 'suggestion',
     fixable: 'code',
     docs: {
       description: 'Enforce usage of the visually hidden component.',
-      recommended: true
+      recommended: 'error'
     },
     messages: {
       noDeprecatedUsage: 'Using the export `{{local}}` from `{{import}}` as a mixin is discouraged. Please use `@atlaskit/visually-hidden` instead.',
@@ -166,6 +166,6 @@ var rule = {
       }
     };
   }
-};
+});
 var _default = rule;
 exports.default = _default;

package/dist/cjs/rules/utils/create-rule.js

@@ -3,9 +3,29 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.createRule = void 0;
+exports.createRule = exports.createLintRule = void 0;
 var _utils = require("@typescript-eslint/utils");
+/**
+ * We are moving to our own small abstraction to create a lint rule that we have the power
+ * to change and mold to our own needs.
+ *
+ * @see createLintRule
+ *
+ * @private
+ * @deprecated
+ */
 var createRule = _utils.ESLintUtils.RuleCreator(function (name) {
-  return "https://atlassian.design/components/eslint-plugin-design-system/examples#".concat(name);
+  return "https://atlassian.design/components/eslint-plugin-design-system/usage#".concat(name);
 });
-exports.createRule = createRule;
+exports.createRule = createRule;
+/**
+ * Tiny wrapped over the ESLint rule module type that ensures
+ * there is a docs link to our ESLint plugin documentation page,
+ * as well as improving type support.
+ */
+var createLintRule = function createLintRule(rule) {
+  var url = "https://atlassian.design/components/eslint-plugin-design-system/usage#".concat(rule.meta.name);
+  rule.meta.docs.url = url;
+  return rule;
+};
+exports.createLintRule = createLintRule;

package/dist/cjs/version.json

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

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

@@ -1,15 +1,18 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::bd61b874ee0323855e0ad920b54e84cc>>
+ * @codegen <<SignedSource::b3d2f24d8d37a87fc2bbd964dfdcb87c>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 export default {
   plugins: ['@atlaskit/design-system'],
   rules: {
+    '@atlaskit/design-system/ensure-design-token-usage': 'error',
     '@atlaskit/design-system/icon-label': 'warn',
     '@atlaskit/design-system/no-banned-imports': 'error',
-    '@atlaskit/design-system/no-deprecated-apis': 'warn',
-    '@atlaskit/design-system/no-deprecated-imports': 'warn',
+    '@atlaskit/design-system/no-deprecated-apis': 'error',
+    '@atlaskit/design-system/no-deprecated-design-token-usage': 'warn',
+    '@atlaskit/design-system/no-deprecated-imports': 'error',
+    '@atlaskit/design-system/no-unsafe-design-token-usage': 'error',
     '@atlaskit/design-system/use-visually-hidden': 'error'
   }
 };

package/dist/es2019/rules/ensure-design-token-usage/index.js

@@ -1,4 +1,5 @@
 import { isNodeOfType } from 'eslint-codemod-utils';
+import { createLintRule } from '../utils/create-rule';
 import { getIsException } from '../utils/get-is-exception';
 import { includesHardCodedColor, isHardCodedColor, isLegacyColor, isLegacyNamedColor } from '../utils/is-color';
 import { isLegacyElevation } from '../utils/is-elevation';
@@ -19,29 +20,19 @@ const getTokenSuggestion = (node, reference, config) => [{
 const filterSuggestion = ({
   shouldReturnSuggestion
 }) => shouldReturnSuggestion;
-const rule = {
+const rule = createLintRule({
   meta: {
-    // We need to upgrade the version of ESLint.
+    name: 'ensure-design-token-usage',
     hasSuggestions: true,
     docs: {
       description: 'Enforces usage of design tokens.',
-      recommended: false
+      recommended: 'error'
     },
     fixable: 'code',
     type: 'problem',
     messages: {
-      legacyElevation: `Elevations can be sourced from the global theme using the token function made of both a background and shadow. Use "card" for card elevations, and "overlay" for anything else that should appear elevated.
-
-{{example}}
-`,
-      hardCodedColor: `Colors can be sourced from the global theme using the token function.
-
-\`\`\`
-import { token } from '@atlaskit/tokens';
-
-token('color.background.blanket');
-\`\`\`
-`
+      legacyElevation: `Elevations can be sourced from the global theme using the token function made of both a background and shadow. Use "card" for card elevations, and "overlay" for anything else that should appear elevated.`,
+      hardCodedColor: `Colors can be sourced from the global theme using the token function.`
     }
   },
   create(context) {
@@ -191,5 +182,5 @@ ${' '.repeat(getNodeColumn(node) - 2)}box-shadow: \${token('${elevation.shadow}'
       }
     };
   }
-};
+});
 export default rule;

package/dist/es2019/rules/ensure-design-token-usage-spacing/utils.js

@@ -1,7 +1,7 @@
 import { callExpression, identifier, insertAtStartOfFile, insertImportDeclaration, isNodeOfType, literal } from 'eslint-codemod-utils';
 import { spacing as spacingScale, typography as typographyTokens } from '@atlaskit/tokens/tokens-raw';
 const typographyProperties = ['fontSize', 'fontWeight', 'fontFamily', 'lineHeight'];
-const properties = ['padding', 'paddingBlock', 'paddingInline', 'paddingLeft', 'paddingTop', 'paddingRight', 'paddingBottom', 'paddingInline', 'paddingInlineStart', 'paddingInlineEnd', 'paddingBlock', 'paddingBlockStart', 'paddingBlockEnd', 'marginLeft', 'marginTop', 'marginRight', 'marginBottom', 'marginInline', 'marginInlineStart', 'marginInlineEnd', 'marginBlock', 'marginBlockStart', 'marginBlockEnd', 'margin', 'gap', 'rowGap', 'gridRowGap', 'columnGap', 'gridColumnGap'];
+const properties = ['padding', 'paddingBlock', 'paddingInline', 'paddingLeft', 'paddingTop', 'paddingRight', 'paddingBottom', 'paddingInline', 'paddingInlineStart', 'paddingInlineEnd', 'paddingBlock', 'paddingBlockStart', 'paddingBlockEnd', 'marginLeft', 'marginTop', 'marginRight', 'marginBottom', 'marginInline', 'marginInlineStart', 'marginInlineEnd', 'marginBlock', 'marginBlockStart', 'marginBlockEnd', 'margin', 'gap', 'rowGap', 'gridRowGap', 'columnGap', 'gridColumnGap', 'top', 'left', 'right', 'bottom', 'inlineStart', 'inlineEnd', 'blockStart', 'blockEnd', 'outline-offset'];
 /**
  * Currently we have a wide range of experimental spacing tokens that we are testing.
  * We only want transforms to apply to the stable scale values, not the rest.

package/dist/es2019/rules/icon-label/index.js

@@ -1,16 +1,15 @@
 import { isNodeOfType } from 'eslint-codemod-utils';
+import { createLintRule } from '../utils/create-rule';
 import { findProp } from '../utils/jsx';
 const elements = ['AkButton', 'AKButton', 'Button', 'MenuItem', 'ButtonItem', 'CustomItem', 'CustomThemeButton', 'LoadingButton', 'BreadcrumbsItem'];
 const elementsIconProps = ['iconBefore', 'iconAfter', 'icon'];
-const rule = {
+const rule = createLintRule({
   meta: {
+    name: 'icon-label',
     fixable: 'code',
     type: 'suggestion',
     docs: {
-      url: 'http://go/adsc/icon/usage#accessibility-guidelines',
       description: 'Enforces accessible usage of icon labels when composed with Atlassian Design System components.',
-      // TODO: Move to createRule() api
-      // @ts-expect-error
       recommended: 'warn'
     },
     messages: {
@@ -97,5 +96,5 @@ const rule = {
       }
     };
   }
-};
+});
 export default rule;

package/dist/es2019/rules/no-banned-imports/index.js

@@ -1,11 +1,13 @@
 import { isNodeOfType } from 'eslint-codemod-utils';
+import { createLintRule } from '../utils/create-rule';
 import { restrictedPaths } from './paths';
-const rule = {
+const rule = createLintRule({
   meta: {
+    name: 'no-banned-imports',
     type: 'problem',
     docs: {
       description: 'Disallow importing banned modules.',
-      recommended: true
+      recommended: 'error'
     },
     messages: {
       path: "The '{{importSource}}' import is restricted from being used. {{customMessage}}"
@@ -40,5 +42,5 @@ const rule = {
       ExportDefaultDeclaration: checkNode
     };
   }
-};
+});
 export default rule;

package/dist/es2019/rules/no-deprecated-apis/index.js

@@ -27,7 +27,7 @@ const rule = createRule({
     type: 'suggestion',
     docs: {
       description: 'Disallow using deprecated APIs.',
-      recommended: 'warn'
+      recommended: 'error'
     },
     messages: {
       noDeprecatedJSXAttributes: 'The JSX attribute {{propName}} has been deprecated.'

package/dist/es2019/rules/no-deprecated-design-token-usage/index.js

@@ -1,10 +1,12 @@
 import renameMapping from '@atlaskit/tokens/rename-mapping';
 import { getTokenId } from '@atlaskit/tokens/token-ids';
-const rule = {
+import { createLintRule } from '../utils/create-rule';
+const rule = createLintRule({
   meta: {
+    name: 'no-deprecated-design-token-usage',
     docs: {
       description: 'Disallow using deprecated design tokens.',
-      recommended: false
+      recommended: 'warn'
     },
     fixable: 'code',
     type: 'problem',
@@ -45,5 +47,5 @@ const rule = {
       }
     };
   }
-};
+});
 export default rule;

package/dist/es2019/rules/no-deprecated-imports/index.js

@@ -40,7 +40,7 @@ const rule = createRule({
     type: 'suggestion',
     docs: {
       description: 'Disallow importing deprecated modules.',
-      recommended: 'warn'
+      recommended: 'error'
     },
     messages: {
       pathWithCustomMessage: "'{{importSource}}' import is restricted from being used. {{customMessage}}",

package/dist/es2019/rules/no-margin/index.js

@@ -1,8 +1,11 @@
 import { isNodeOfType } from 'eslint-codemod-utils';
-const rule = {
+import { createLintRule } from '../utils/create-rule';
+const rule = createLintRule({
   meta: {
+    name: 'no-margin',
     type: 'problem',
     docs: {
+      recommended: false,
       description: 'Disallow using the margin CSS property.'
     },
     messages: {
@@ -66,5 +69,5 @@ const rule = {
       }
     };
   }
-};
+});
 export default rule;

package/dist/es2019/rules/no-unsafe-design-token-usage/index.js

@@ -2,16 +2,18 @@ import { isNodeOfType } from 'eslint-codemod-utils';
 import renameMapping from '@atlaskit/tokens/rename-mapping';
 import { getTokenId } from '@atlaskit/tokens/token-ids';
 import tokens from '@atlaskit/tokens/token-names';
+import { createLintRule } from '../utils/create-rule';
 import { isDecendantOfStyleBlock, isDecendantOfStyleJsxAttribute } from '../utils/is-node';
 import { isToken } from '../utils/is-token';
 const defaultConfig = {
   shouldEnforceFallbacks: false
 };
-const rule = {
+const rule = createLintRule({
   meta: {
+    name: 'no-unsafe-design-token-usage',
     docs: {
       description: 'Enforces design token usage is statically and locally analyzable.',
-      recommended: false
+      recommended: 'error'
     },
     fixable: 'code',
     type: 'problem',
@@ -172,5 +174,5 @@ token('color.background.blanket');
       }
     };
   }
-};
+});
 export default rule;

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

@@ -1,10 +1,12 @@
 import { isNodeOfType } from 'eslint-codemod-utils';
+import { createLintRule } from '../utils/create-rule';
 import { primitiveFixer, shouldSuggestBox, shouldSuggestInline, shouldSuggestStack } from './utils';
 const boxDocsUrl = 'https://atlassian.design/components/primitves/box/examples';
 const inlineDocsUrl = 'https://atlassian.design/components/primitves/inline/examples';
 const stackDocsUrl = 'https://atlassian.design/components/primitves/stack/examples';
-const rule = {
+const rule = createLintRule({
   meta: {
+    name: 'use-primitives',
     type: 'suggestion',
     fixable: 'code',
     docs: {
@@ -98,5 +100,5 @@ const rule = {
       }
     };
   }
-};
+});
 export default rule;

package/dist/es2019/rules/use-visually-hidden/index.js

@@ -1,18 +1,18 @@
-/* eslint-disable @atlaskit/design-system/use-visually-hidden */
-
 import { closestOfType, hasImportDeclaration, isNodeOfType } from 'eslint-codemod-utils';
+import { createLintRule } from '../utils/create-rule';
 import { isStyledObjectNode, isStyledTemplateNode } from '../utils/is-node';
 import fixJsx from './fix-jsx';
 import fixVanilla from './fix-vanilla';
 import { countMatchingKeyValues, getObjectLikeness, makeTemplateLiteralIntoEntries } from './utils';
 const THEME_IMPORT_NAMES = ['visuallyHidden', 'assistive'];
-const rule = {
+const rule = createLintRule({
   meta: {
+    name: 'use-visually-hidden',
     type: 'suggestion',
     fixable: 'code',
     docs: {
       description: 'Enforce usage of the visually hidden component.',
-      recommended: true
+      recommended: 'error'
     },
     messages: {
       noDeprecatedUsage: 'Using the export `{{local}}` from `{{import}}` as a mixin is discouraged. Please use `@atlaskit/visually-hidden` instead.',
@@ -145,5 +145,5 @@ const rule = {
       }
     };
   }
-};
+});
 export default rule;

package/dist/es2019/rules/utils/create-rule.js

@@ -1,2 +1,21 @@
 import { ESLintUtils } from '@typescript-eslint/utils';
-export const createRule = ESLintUtils.RuleCreator(name => `https://atlassian.design/components/eslint-plugin-design-system/examples#${name}`);
+/**
+ * We are moving to our own small abstraction to create a lint rule that we have the power
+ * to change and mold to our own needs.
+ *
+ * @see createLintRule
+ *
+ * @private
+ * @deprecated
+ */
+export const createRule = ESLintUtils.RuleCreator(name => `https://atlassian.design/components/eslint-plugin-design-system/usage#${name}`);
+/**
+ * Tiny wrapped over the ESLint rule module type that ensures
+ * there is a docs link to our ESLint plugin documentation page,
+ * as well as improving type support.
+ */
+export const createLintRule = rule => {
+  const url = `https://atlassian.design/components/eslint-plugin-design-system/usage#${rule.meta.name}`;
+  rule.meta.docs.url = url;
+  return rule;
+};

package/dist/es2019/version.json

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

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

@@ -1,15 +1,18 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::bd61b874ee0323855e0ad920b54e84cc>>
+ * @codegen <<SignedSource::b3d2f24d8d37a87fc2bbd964dfdcb87c>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 export default {
   plugins: ['@atlaskit/design-system'],
   rules: {
+    '@atlaskit/design-system/ensure-design-token-usage': 'error',
     '@atlaskit/design-system/icon-label': 'warn',
     '@atlaskit/design-system/no-banned-imports': 'error',
-    '@atlaskit/design-system/no-deprecated-apis': 'warn',
-    '@atlaskit/design-system/no-deprecated-imports': 'warn',
+    '@atlaskit/design-system/no-deprecated-apis': 'error',
+    '@atlaskit/design-system/no-deprecated-design-token-usage': 'warn',
+    '@atlaskit/design-system/no-deprecated-imports': 'error',
+    '@atlaskit/design-system/no-unsafe-design-token-usage': 'error',
     '@atlaskit/design-system/use-visually-hidden': 'error'
   }
 };

package/dist/esm/rules/ensure-design-token-usage/index.js

@@ -1,4 +1,5 @@
 import { isNodeOfType } from 'eslint-codemod-utils';
+import { createLintRule } from '../utils/create-rule';
 import { getIsException } from '../utils/get-is-exception';
 import { includesHardCodedColor, isHardCodedColor, isLegacyColor, isLegacyNamedColor } from '../utils/is-color';
 import { isLegacyElevation } from '../utils/is-elevation';
@@ -28,19 +29,19 @@ var filterSuggestion = function filterSuggestion(_ref) {
   var shouldReturnSuggestion = _ref.shouldReturnSuggestion;
   return shouldReturnSuggestion;
 };
-var rule = {
+var rule = createLintRule({
   meta: {
-    // We need to upgrade the version of ESLint.
+    name: 'ensure-design-token-usage',
     hasSuggestions: true,
     docs: {
       description: 'Enforces usage of design tokens.',
-      recommended: false
+      recommended: 'error'
     },
     fixable: 'code',
     type: 'problem',
     messages: {
-      legacyElevation: "Elevations can be sourced from the global theme using the token function made of both a background and shadow. Use \"card\" for card elevations, and \"overlay\" for anything else that should appear elevated.\n\n{{example}}\n",
-      hardCodedColor: "Colors can be sourced from the global theme using the token function.\n\n```\nimport { token } from '@atlaskit/tokens';\n\ntoken('color.background.blanket');\n```\n"
+      legacyElevation: "Elevations can be sourced from the global theme using the token function made of both a background and shadow. Use \"card\" for card elevations, and \"overlay\" for anything else that should appear elevated.",
+      hardCodedColor: "Colors can be sourced from the global theme using the token function."
     }
   },
   create: function create(context) {
@@ -186,5 +187,5 @@ var rule = {
       }
     };
   }
-};
+});
 export default rule;

package/dist/esm/rules/ensure-design-token-usage-spacing/utils.js

@@ -2,7 +2,7 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import { callExpression, identifier, insertAtStartOfFile, insertImportDeclaration, isNodeOfType, literal } from 'eslint-codemod-utils';
 import { spacing as spacingScale, typography as typographyTokens } from '@atlaskit/tokens/tokens-raw';
 var typographyProperties = ['fontSize', 'fontWeight', 'fontFamily', 'lineHeight'];
-var properties = ['padding', 'paddingBlock', 'paddingInline', 'paddingLeft', 'paddingTop', 'paddingRight', 'paddingBottom', 'paddingInline', 'paddingInlineStart', 'paddingInlineEnd', 'paddingBlock', 'paddingBlockStart', 'paddingBlockEnd', 'marginLeft', 'marginTop', 'marginRight', 'marginBottom', 'marginInline', 'marginInlineStart', 'marginInlineEnd', 'marginBlock', 'marginBlockStart', 'marginBlockEnd', 'margin', 'gap', 'rowGap', 'gridRowGap', 'columnGap', 'gridColumnGap'];
+var properties = ['padding', 'paddingBlock', 'paddingInline', 'paddingLeft', 'paddingTop', 'paddingRight', 'paddingBottom', 'paddingInline', 'paddingInlineStart', 'paddingInlineEnd', 'paddingBlock', 'paddingBlockStart', 'paddingBlockEnd', 'marginLeft', 'marginTop', 'marginRight', 'marginBottom', 'marginInline', 'marginInlineStart', 'marginInlineEnd', 'marginBlock', 'marginBlockStart', 'marginBlockEnd', 'margin', 'gap', 'rowGap', 'gridRowGap', 'columnGap', 'gridColumnGap', 'top', 'left', 'right', 'bottom', 'inlineStart', 'inlineEnd', 'blockStart', 'blockEnd', 'outline-offset'];
 /**
  * Currently we have a wide range of experimental spacing tokens that we are testing.
  * We only want transforms to apply to the stable scale values, not the rest.

package/dist/esm/rules/icon-label/index.js

@@ -1,16 +1,15 @@
 import { isNodeOfType } from 'eslint-codemod-utils';
+import { createLintRule } from '../utils/create-rule';
 import { findProp } from '../utils/jsx';
 var elements = ['AkButton', 'AKButton', 'Button', 'MenuItem', 'ButtonItem', 'CustomItem', 'CustomThemeButton', 'LoadingButton', 'BreadcrumbsItem'];
 var elementsIconProps = ['iconBefore', 'iconAfter', 'icon'];
-var rule = {
+var rule = createLintRule({
   meta: {
+    name: 'icon-label',
     fixable: 'code',
     type: 'suggestion',
     docs: {
-      url: 'http://go/adsc/icon/usage#accessibility-guidelines',
       description: 'Enforces accessible usage of icon labels when composed with Atlassian Design System components.',
-      // TODO: Move to createRule() api
-      // @ts-expect-error
       recommended: 'warn'
     },
     messages: {
@@ -111,5 +110,5 @@ var rule = {
       })
     };
   }
-};
+});
 export default rule;

package/dist/esm/rules/no-banned-imports/index.js

@@ -1,11 +1,13 @@
 import { isNodeOfType } from 'eslint-codemod-utils';
+import { createLintRule } from '../utils/create-rule';
 import { restrictedPaths } from './paths';
-var rule = {
+var rule = createLintRule({
   meta: {
+    name: 'no-banned-imports',
     type: 'problem',
     docs: {
       description: 'Disallow importing banned modules.',
-      recommended: true
+      recommended: 'error'
     },
     messages: {
       path: "The '{{importSource}}' import is restricted from being used. {{customMessage}}"
@@ -39,5 +41,5 @@ var rule = {
       ExportDefaultDeclaration: checkNode
     };
   }
-};
+});
 export default rule;

package/dist/esm/rules/no-deprecated-apis/index.js

@@ -30,7 +30,7 @@ var rule = createRule({
     type: 'suggestion',
     docs: {
       description: 'Disallow using deprecated APIs.',
-      recommended: 'warn'
+      recommended: 'error'
     },
     messages: {
       noDeprecatedJSXAttributes: 'The JSX attribute {{propName}} has been deprecated.'

package/dist/esm/rules/no-deprecated-design-token-usage/index.js

@@ -1,10 +1,12 @@
 import renameMapping from '@atlaskit/tokens/rename-mapping';
 import { getTokenId } from '@atlaskit/tokens/token-ids';
-var rule = {
+import { createLintRule } from '../utils/create-rule';
+var rule = createLintRule({
   meta: {
+    name: 'no-deprecated-design-token-usage',
     docs: {
       description: 'Disallow using deprecated design tokens.',
-      recommended: false
+      recommended: 'warn'
     },
     fixable: 'code',
     type: 'problem',
@@ -51,5 +53,5 @@ var rule = {
       }
     };
   }
-};
+});
 export default rule;

package/dist/esm/rules/no-deprecated-imports/index.js

@@ -44,7 +44,7 @@ var rule = createRule({
     type: 'suggestion',
     docs: {
       description: 'Disallow importing deprecated modules.',
-      recommended: 'warn'
+      recommended: 'error'
     },
     messages: {
       pathWithCustomMessage: "'{{importSource}}' import is restricted from being used. {{customMessage}}",

package/dist/esm/rules/no-margin/index.js

@@ -1,8 +1,11 @@
 import { isNodeOfType } from 'eslint-codemod-utils';
-var rule = {
+import { createLintRule } from '../utils/create-rule';
+var rule = createLintRule({
   meta: {
+    name: 'no-margin',
     type: 'problem',
     docs: {
+      recommended: false,
       description: 'Disallow using the margin CSS property.'
     },
     messages: {
@@ -72,5 +75,5 @@ var rule = {
       }
     };
   }
-};
+});
 export default rule;

package/dist/esm/rules/no-unsafe-design-token-usage/index.js

@@ -2,16 +2,18 @@ import { isNodeOfType } from 'eslint-codemod-utils';
 import renameMapping from '@atlaskit/tokens/rename-mapping';
 import { getTokenId } from '@atlaskit/tokens/token-ids';
 import tokens from '@atlaskit/tokens/token-names';
+import { createLintRule } from '../utils/create-rule';
 import { isDecendantOfStyleBlock, isDecendantOfStyleJsxAttribute } from '../utils/is-node';
 import { isToken } from '../utils/is-token';
 var defaultConfig = {
   shouldEnforceFallbacks: false
 };
-var rule = {
+var rule = createLintRule({
   meta: {
+    name: 'no-unsafe-design-token-usage',
     docs: {
       description: 'Enforces design token usage is statically and locally analyzable.',
-      recommended: false
+      recommended: 'error'
     },
     fixable: 'code',
     type: 'problem',
@@ -166,5 +168,5 @@ var rule = {
       }
     };
   }
-};
+});
 export default rule;

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

@@ -1,10 +1,12 @@
 import { isNodeOfType } from 'eslint-codemod-utils';
+import { createLintRule } from '../utils/create-rule';
 import { primitiveFixer, shouldSuggestBox, shouldSuggestInline, shouldSuggestStack } from './utils';
 var boxDocsUrl = 'https://atlassian.design/components/primitves/box/examples';
 var inlineDocsUrl = 'https://atlassian.design/components/primitves/inline/examples';
 var stackDocsUrl = 'https://atlassian.design/components/primitves/stack/examples';
-var rule = {
+var rule = createLintRule({
   meta: {
+    name: 'use-primitives',
     type: 'suggestion',
     fixable: 'code',
     docs: {
@@ -98,5 +100,5 @@ var rule = {
       }
     };
   }
-};
+});
 export default rule;

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

@@ -1,19 +1,19 @@
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-/* eslint-disable @atlaskit/design-system/use-visually-hidden */
-
 import { closestOfType, hasImportDeclaration, isNodeOfType } from 'eslint-codemod-utils';
+import { createLintRule } from '../utils/create-rule';
 import { isStyledObjectNode, isStyledTemplateNode } from '../utils/is-node';
 import fixJsx from './fix-jsx';
 import fixVanilla from './fix-vanilla';
 import { countMatchingKeyValues, getObjectLikeness, makeTemplateLiteralIntoEntries } from './utils';
 var THEME_IMPORT_NAMES = ['visuallyHidden', 'assistive'];
-var rule = {
+var rule = createLintRule({
   meta: {
+    name: 'use-visually-hidden',
     type: 'suggestion',
     fixable: 'code',
     docs: {
       description: 'Enforce usage of the visually hidden component.',
-      recommended: true
+      recommended: 'error'
     },
     messages: {
       noDeprecatedUsage: 'Using the export `{{local}}` from `{{import}}` as a mixin is discouraged. Please use `@atlaskit/visually-hidden` instead.',
@@ -159,5 +159,5 @@ var rule = {
       }
     };
   }
-};
+});
 export default rule;

package/dist/esm/rules/utils/create-rule.js

@@ -1,4 +1,23 @@
 import { ESLintUtils } from '@typescript-eslint/utils';
+/**
+ * We are moving to our own small abstraction to create a lint rule that we have the power
+ * to change and mold to our own needs.
+ *
+ * @see createLintRule
+ *
+ * @private
+ * @deprecated
+ */
 export var createRule = ESLintUtils.RuleCreator(function (name) {
-  return "https://atlassian.design/components/eslint-plugin-design-system/examples#".concat(name);
-});
+  return "https://atlassian.design/components/eslint-plugin-design-system/usage#".concat(name);
+});
+/**
+ * Tiny wrapped over the ESLint rule module type that ensures
+ * there is a docs link to our ESLint plugin documentation page,
+ * as well as improving type support.
+ */
+export var createLintRule = function createLintRule(rule) {
+  var url = "https://atlassian.design/components/eslint-plugin-design-system/usage#".concat(rule.meta.name);
+  rule.meta.docs.url = url;
+  return rule;
+};

package/dist/esm/version.json

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

package/dist/types/index.codegen.d.ts

@@ -19,10 +19,13 @@ export declare const configs: {
     recommended: {
         plugins: string[];
         rules: {
+            '@atlaskit/design-system/ensure-design-token-usage': string;
             '@atlaskit/design-system/icon-label': string;
             '@atlaskit/design-system/no-banned-imports': string;
             '@atlaskit/design-system/no-deprecated-apis': string;
+            '@atlaskit/design-system/no-deprecated-design-token-usage': string;
             '@atlaskit/design-system/no-deprecated-imports': string;
+            '@atlaskit/design-system/no-unsafe-design-token-usage': string;
             '@atlaskit/design-system/use-visually-hidden': string;
         };
     };

package/dist/types/presets/recommended.codegen.d.ts

@@ -1,16 +1,19 @@
 declare const _default: {
     plugins: string[];
     rules: {
+        '@atlaskit/design-system/ensure-design-token-usage': string;
         '@atlaskit/design-system/icon-label': string;
         '@atlaskit/design-system/no-banned-imports': string;
         '@atlaskit/design-system/no-deprecated-apis': string;
+        '@atlaskit/design-system/no-deprecated-design-token-usage': string;
         '@atlaskit/design-system/no-deprecated-imports': string;
+        '@atlaskit/design-system/no-unsafe-design-token-usage': string;
         '@atlaskit/design-system/use-visually-hidden': string;
     };
 };
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::bd61b874ee0323855e0ad920b54e84cc>>
+ * @codegen <<SignedSource::b3d2f24d8d37a87fc2bbd964dfdcb87c>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 export default _default;

package/dist/types/rules/icon-label/index.d.ts

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

package/dist/types/rules/no-banned-imports/index.d.ts

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

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

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

package/dist/types/rules/utils/create-rule.d.ts

@@ -1,2 +1,45 @@
 import { ESLintUtils } from '@typescript-eslint/utils';
+import type { Rule } from 'eslint';
+/**
+ * We are moving to our own small abstraction to create a lint rule that we have the power
+ * to change and mold to our own needs.
+ *
+ * @see createLintRule
+ *
+ * @private
+ * @deprecated
+ */
 export declare const createRule: <TOptions extends readonly unknown[], TMessageIds extends string, TRuleListener extends import("@typescript-eslint/utils/dist/ts-eslint/Rule").RuleListener = import("@typescript-eslint/utils/dist/ts-eslint/Rule").RuleListener>({ name, meta, ...rule }: Readonly<ESLintUtils.RuleWithMetaAndName<TOptions, TMessageIds, TRuleListener>>) => import("@typescript-eslint/utils/dist/ts-eslint/Rule").RuleModule<TMessageIds, TOptions, TRuleListener>;
+export interface LintRule extends Omit<Rule.RuleModule, 'meta'> {
+    /**
+     * Including this for backwards compat moving from the typescript-eslint util.
+     */
+    name?: never;
+    meta: LintRuleMeta;
+}
+export interface LintRuleMeta extends Omit<Rule.RuleMetaData, 'docs'> {
+    /**
+     * Name of the rule.
+     * Must match the folder it is in exactly else build will throw.
+     */
+    name: string;
+    docs: {
+        /**
+         * Short description of what this rule does.
+         */
+        description: string;
+        /**
+         * If this rule should be in the recommended preset or not.
+         * When setting to `"error"` it will mean releasing a breaking change.
+         *
+         * Set to `false` to exclude it from the recommended preset.
+         */
+        recommended: 'warn' | 'error' | false;
+    };
+}
+/**
+ * Tiny wrapped over the ESLint rule module type that ensures
+ * there is a docs link to our ESLint plugin documentation page,
+ * as well as improving type support.
+ */
+export declare const createLintRule: (rule: LintRule) => Rule.RuleModule;

package/package.json

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