@atlaskit/eslint-plugin-design-system 9.6.0 → 10.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (151) hide show
  1. package/CHANGELOG.md +1004 -411
  2. package/README.md +7 -5
  3. package/constellation/consistent-css-prop-usage/usage.mdx +44 -30
  4. package/constellation/ensure-design-token-usage/usage.mdx +12 -7
  5. package/constellation/ensure-design-token-usage-preview/usage.mdx +2 -1
  6. package/constellation/icon-label/usage.mdx +5 -3
  7. package/constellation/index/usage.mdx +5 -2
  8. package/constellation/no-banned-imports/usage.mdx +3 -1
  9. package/constellation/no-css-tagged-template-expression/usage.mdx +22 -17
  10. package/constellation/no-deprecated-apis/usage.mdx +33 -27
  11. package/constellation/no-deprecated-design-token-usage/usage.mdx +7 -4
  12. package/constellation/no-deprecated-imports/usage.mdx +31 -27
  13. package/constellation/no-direct-use-of-web-platform-drag-and-drop/usage.mdx +19 -10
  14. package/constellation/no-empty-styled-expression/usage.mdx +19 -14
  15. package/constellation/no-exported-css/usage.mdx +15 -10
  16. package/constellation/no-exported-keyframes/usage.mdx +15 -10
  17. package/constellation/no-html-anchor/usage.mdx +40 -0
  18. package/constellation/no-html-button/usage.mdx +52 -0
  19. package/constellation/no-invalid-css-map/usage.mdx +69 -58
  20. package/constellation/no-keyframes-tagged-template-expression/usage.mdx +24 -18
  21. package/constellation/no-margin/usage.mdx +3 -2
  22. package/constellation/no-nested-styles/usage.mdx +16 -16
  23. package/constellation/no-physical-properties/usage.mdx +13 -13
  24. package/constellation/no-styled-tagged-template-expression/usage.mdx +39 -34
  25. package/constellation/no-unsafe-design-token-usage/usage.mdx +8 -7
  26. package/constellation/no-unsafe-style-overrides/usage.mdx +10 -7
  27. package/constellation/no-unsupported-drag-and-drop-libraries/usage.mdx +8 -2
  28. package/constellation/prefer-primitives/usage.mdx +3 -2
  29. package/constellation/use-button-group-label/usage.mdx +4 -2
  30. package/constellation/use-drawer-label/usage.mdx +4 -2
  31. package/constellation/use-heading/usage.mdx +7 -4
  32. package/constellation/use-heading-level-in-spotlight-card/usage.mdx +3 -2
  33. package/constellation/use-href-in-link-item/usage.mdx +2 -1
  34. package/constellation/use-popup-label/usage.mdx +56 -0
  35. package/constellation/use-primitives/usage.mdx +40 -39
  36. package/constellation/use-primitives-text/usage.mdx +7 -3
  37. package/constellation/use-tokens-space/usage.mdx +7 -3
  38. package/constellation/use-tokens-typography/usage.mdx +15 -6
  39. package/constellation/use-visually-hidden/usage.mdx +2 -1
  40. package/dist/cjs/common/token-maps.partial.js +49 -0
  41. package/dist/cjs/index.codegen.js +1 -1
  42. package/dist/cjs/presets/all.codegen.js +4 -2
  43. package/dist/cjs/presets/recommended.codegen.js +2 -1
  44. package/dist/cjs/rules/index.codegen.js +7 -3
  45. package/dist/cjs/rules/no-html-anchor/index.js +39 -0
  46. package/dist/cjs/rules/no-html-anchor/node-types/index.js +19 -0
  47. package/dist/cjs/rules/no-html-anchor/node-types/jsx-element/index.js +28 -0
  48. package/dist/cjs/rules/no-html-anchor/node-types/styled-component/get-styled-component-call.js +47 -0
  49. package/dist/cjs/rules/no-html-anchor/node-types/styled-component/index.js +37 -0
  50. package/dist/cjs/rules/no-html-anchor/node-types/supported.js +66 -0
  51. package/dist/cjs/rules/no-html-anchor/utils/get-jsx-element-by-name.js +53 -0
  52. package/dist/cjs/rules/no-html-button/index.js +39 -0
  53. package/dist/cjs/rules/no-html-button/node-types/index.js +19 -0
  54. package/dist/cjs/rules/no-html-button/node-types/jsx-element/index.js +28 -0
  55. package/dist/cjs/rules/no-html-button/node-types/styled-component/get-styled-component-call.js +47 -0
  56. package/dist/cjs/rules/no-html-button/node-types/styled-component/index.js +37 -0
  57. package/dist/cjs/rules/no-html-button/node-types/supported.js +79 -0
  58. package/dist/cjs/rules/no-html-button/utils/get-jsx-element-by-name.js +53 -0
  59. package/dist/cjs/rules/use-popup-label/index.js +90 -0
  60. package/dist/es2019/common/token-maps.partial.js +42 -0
  61. package/dist/es2019/index.codegen.js +1 -1
  62. package/dist/es2019/presets/all.codegen.js +4 -2
  63. package/dist/es2019/presets/recommended.codegen.js +2 -1
  64. package/dist/es2019/rules/index.codegen.js +7 -3
  65. package/dist/es2019/rules/no-html-anchor/index.js +33 -0
  66. package/dist/es2019/rules/no-html-anchor/node-types/index.js +2 -0
  67. package/dist/es2019/rules/no-html-anchor/node-types/jsx-element/index.js +20 -0
  68. package/dist/es2019/rules/no-html-anchor/node-types/styled-component/get-styled-component-call.js +42 -0
  69. package/dist/es2019/rules/no-html-anchor/node-types/styled-component/index.js +32 -0
  70. package/dist/es2019/rules/no-html-anchor/node-types/supported.js +56 -0
  71. package/dist/es2019/rules/no-html-anchor/utils/get-jsx-element-by-name.js +39 -0
  72. package/dist/es2019/rules/no-html-button/index.js +33 -0
  73. package/dist/es2019/rules/no-html-button/node-types/index.js +2 -0
  74. package/dist/es2019/rules/no-html-button/node-types/jsx-element/index.js +20 -0
  75. package/dist/es2019/rules/no-html-button/node-types/styled-component/get-styled-component-call.js +42 -0
  76. package/dist/es2019/rules/no-html-button/node-types/styled-component/index.js +32 -0
  77. package/dist/es2019/rules/no-html-button/node-types/supported.js +69 -0
  78. package/dist/es2019/rules/no-html-button/utils/get-jsx-element-by-name.js +39 -0
  79. package/dist/es2019/rules/use-popup-label/index.js +80 -0
  80. package/dist/esm/common/token-maps.partial.js +42 -0
  81. package/dist/esm/index.codegen.js +1 -1
  82. package/dist/esm/presets/all.codegen.js +4 -2
  83. package/dist/esm/presets/recommended.codegen.js +2 -1
  84. package/dist/esm/rules/index.codegen.js +7 -3
  85. package/dist/esm/rules/no-html-anchor/index.js +33 -0
  86. package/dist/esm/rules/no-html-anchor/node-types/index.js +2 -0
  87. package/dist/esm/rules/no-html-anchor/node-types/jsx-element/index.js +19 -0
  88. package/dist/esm/rules/no-html-anchor/node-types/styled-component/get-styled-component-call.js +42 -0
  89. package/dist/esm/rules/no-html-anchor/node-types/styled-component/index.js +31 -0
  90. package/dist/esm/rules/no-html-anchor/node-types/supported.js +57 -0
  91. package/dist/esm/rules/no-html-anchor/utils/get-jsx-element-by-name.js +47 -0
  92. package/dist/esm/rules/no-html-button/index.js +33 -0
  93. package/dist/esm/rules/no-html-button/node-types/index.js +2 -0
  94. package/dist/esm/rules/no-html-button/node-types/jsx-element/index.js +19 -0
  95. package/dist/esm/rules/no-html-button/node-types/styled-component/get-styled-component-call.js +42 -0
  96. package/dist/esm/rules/no-html-button/node-types/styled-component/index.js +31 -0
  97. package/dist/esm/rules/no-html-button/node-types/supported.js +70 -0
  98. package/dist/esm/rules/no-html-button/utils/get-jsx-element-by-name.js +47 -0
  99. package/dist/esm/rules/use-popup-label/index.js +84 -0
  100. package/dist/types/common/token-maps.partial.d.ts +65 -0
  101. package/dist/types/index.codegen.d.ts +4 -1
  102. package/dist/types/presets/all.codegen.d.ts +4 -2
  103. package/dist/types/presets/recommended.codegen.d.ts +2 -1
  104. package/dist/types/rules/index.codegen.d.ts +3 -1
  105. package/dist/types/rules/no-html-anchor/index.d.ts +3 -0
  106. package/dist/types/rules/no-html-anchor/node-types/index.d.ts +2 -0
  107. package/dist/types/rules/no-html-anchor/node-types/jsx-element/index.d.ts +8 -0
  108. package/dist/types/rules/no-html-anchor/node-types/styled-component/get-styled-component-call.d.ts +6 -0
  109. package/dist/types/rules/no-html-anchor/node-types/styled-component/index.d.ts +8 -0
  110. package/dist/types/rules/no-html-anchor/node-types/supported.d.ts +7 -0
  111. package/dist/types/rules/no-html-anchor/utils/get-jsx-element-by-name.d.ts +6 -0
  112. package/dist/types/rules/no-html-button/index.d.ts +3 -0
  113. package/dist/types/rules/no-html-button/node-types/index.d.ts +2 -0
  114. package/dist/types/rules/no-html-button/node-types/jsx-element/index.d.ts +8 -0
  115. package/dist/types/rules/no-html-button/node-types/styled-component/get-styled-component-call.d.ts +6 -0
  116. package/dist/types/rules/no-html-button/node-types/styled-component/index.d.ts +8 -0
  117. package/dist/types/rules/no-html-button/node-types/supported.d.ts +7 -0
  118. package/dist/types/rules/no-html-button/utils/get-jsx-element-by-name.d.ts +6 -0
  119. package/dist/types/rules/use-popup-label/index.d.ts +3 -0
  120. package/dist/types/rules/use-tokens-typography/utils.d.ts +0 -33
  121. package/dist/types-ts4.5/common/token-maps.partial.d.ts +65 -0
  122. package/dist/types-ts4.5/index.codegen.d.ts +4 -1
  123. package/dist/types-ts4.5/presets/all.codegen.d.ts +4 -2
  124. package/dist/types-ts4.5/presets/recommended.codegen.d.ts +2 -1
  125. package/dist/types-ts4.5/rules/index.codegen.d.ts +3 -1
  126. package/dist/types-ts4.5/rules/no-html-anchor/node-types/index.d.ts +2 -0
  127. package/dist/types-ts4.5/rules/no-html-anchor/node-types/jsx-element/index.d.ts +8 -0
  128. package/dist/types-ts4.5/rules/no-html-anchor/node-types/styled-component/get-styled-component-call.d.ts +6 -0
  129. package/dist/types-ts4.5/rules/no-html-anchor/node-types/styled-component/index.d.ts +8 -0
  130. package/dist/types-ts4.5/rules/no-html-anchor/node-types/supported.d.ts +7 -0
  131. package/dist/types-ts4.5/rules/no-html-anchor/utils/get-jsx-element-by-name.d.ts +6 -0
  132. package/dist/types-ts4.5/rules/no-html-button/node-types/index.d.ts +2 -0
  133. package/dist/types-ts4.5/rules/no-html-button/node-types/jsx-element/index.d.ts +8 -0
  134. package/dist/types-ts4.5/rules/no-html-button/node-types/styled-component/get-styled-component-call.d.ts +6 -0
  135. package/dist/types-ts4.5/rules/no-html-button/node-types/styled-component/index.d.ts +8 -0
  136. package/dist/types-ts4.5/rules/no-html-button/node-types/supported.d.ts +7 -0
  137. package/dist/types-ts4.5/rules/no-html-button/utils/get-jsx-element-by-name.d.ts +6 -0
  138. package/dist/types-ts4.5/rules/use-popup-label/index.d.ts +3 -0
  139. package/dist/types-ts4.5/rules/use-tokens-typography/utils.d.ts +0 -33
  140. package/package.json +4 -3
  141. package/constellation/no-html-button-element/usage.mdx +0 -26
  142. package/dist/cjs/rules/no-html-button-element/index.js +0 -107
  143. package/dist/cjs/rules/no-html-button-element/utils.js +0 -18
  144. package/dist/es2019/rules/no-html-button-element/index.js +0 -101
  145. package/dist/es2019/rules/no-html-button-element/utils.js +0 -12
  146. package/dist/esm/rules/no-html-button-element/index.js +0 -101
  147. package/dist/esm/rules/no-html-button-element/utils.js +0 -12
  148. package/dist/types/rules/no-html-button-element/utils.d.ts +0 -2
  149. package/dist/types-ts4.5/rules/no-html-button-element/utils.d.ts +0 -2
  150. /package/dist/types-ts4.5/rules/{no-html-button-element → no-html-anchor}/index.d.ts +0 -0
  151. /package/dist/{types/rules/no-html-button-element → types-ts4.5/rules/no-html-button}/index.d.ts +0 -0
@@ -0,0 +1,33 @@
1
+ import { createLintRule } from '../utils/create-rule';
2
+ import { JSXElement as _JSXElement, StyledComponent } from './node-types';
3
+ var rule = createLintRule({
4
+ meta: {
5
+ name: 'no-html-button',
6
+ type: 'suggestion',
7
+ docs: {
8
+ description: 'Discourage direct usage of HTML button elements in favor of Atlassian Design System button components.',
9
+ recommended: false,
10
+ severity: 'warn'
11
+ },
12
+ messages: {
13
+ noHtmlButton: "This {{ name }} should be replaced with a button component from the Atlassian Design System, such as the \"Button\" component when suitable. For custom buttons use the \"Pressable\" primitive. ADS buttons include event tracking, ensure accessible implementations, and provide access to ADS styling features like design tokens."
14
+ }
15
+ },
16
+ create: function create(context) {
17
+ return {
18
+ // transforms styled.<button>(...) usages
19
+ CallExpression: function CallExpression(node) {
20
+ StyledComponent.lint(node, {
21
+ context: context
22
+ });
23
+ },
24
+ // transforms <button css={...}> usages
25
+ JSXElement: function JSXElement(node) {
26
+ _JSXElement.lint(node, {
27
+ context: context
28
+ });
29
+ }
30
+ };
31
+ }
32
+ });
33
+ export default rule;
@@ -0,0 +1,2 @@
1
+ export { StyledComponent } from './styled-component';
2
+ export { JSXElement } from './jsx-element';
@@ -0,0 +1,19 @@
1
+ /* eslint-disable @repo/internal/react/require-jsdoc */
2
+
3
+ import * as ast from '../../../../ast-nodes';
4
+ import { isSupportedForLint } from '../supported';
5
+ export var JSXElement = {
6
+ lint: function lint(node, _ref) {
7
+ var context = _ref.context;
8
+ if (!isSupportedForLint(node)) {
9
+ return;
10
+ }
11
+ context.report({
12
+ node: node.openingElement,
13
+ messageId: 'noHtmlButton',
14
+ data: {
15
+ name: ast.JSXElement.getName(node)
16
+ }
17
+ });
18
+ }
19
+ };
@@ -0,0 +1,42 @@
1
+ import { closestOfType, isNodeOfType } from 'eslint-codemod-utils';
2
+
3
+ /**
4
+ * Returns a styled component
5
+ */
6
+
7
+ export var getStyledComponentCall = function getStyledComponentCall(node) {
8
+ // halts unless we are dealing with a styled component
9
+ if (!isStyledCallExpression(node)) {
10
+ return;
11
+ }
12
+ // halts if the component is being exported directly
13
+ if (closestOfType(node, 'ExportNamedDeclaration')) {
14
+ return;
15
+ }
16
+ var styledComponentVariableRef = node.parent;
17
+ // halts if the styled component is not assigned to a variable immediately
18
+ if (!isNodeOfType(styledComponentVariableRef, 'VariableDeclarator')) {
19
+ return;
20
+ }
21
+ return styledComponentVariableRef;
22
+ };
23
+
24
+ /**
25
+ * Some verbose precondition checks but all it does is check
26
+ * a call expression is of form `styled.button` or `styled2.button`
27
+ */
28
+ var isStyledCallExpression = function isStyledCallExpression(call) {
29
+ if (!isNodeOfType(call, 'CallExpression')) {
30
+ return false;
31
+ }
32
+ if (!isNodeOfType(call.callee, 'MemberExpression')) {
33
+ return false;
34
+ }
35
+ if (!isNodeOfType(call.callee.object, 'Identifier') || !isNodeOfType(call.callee.property, 'Identifier')) {
36
+ return false;
37
+ }
38
+ if (/^styled2?$/.test(call.callee.object.name)) {
39
+ return true;
40
+ }
41
+ return false;
42
+ };
@@ -0,0 +1,31 @@
1
+ /* eslint-disable @repo/internal/react/require-jsdoc */
2
+
3
+ import { isNodeOfType } from 'eslint-codemod-utils';
4
+ import { getJsxElementByName } from '../../utils/get-jsx-element-by-name';
5
+ import { isSupportedForLint } from '../supported';
6
+ import { getStyledComponentCall } from './get-styled-component-call';
7
+ export var StyledComponent = {
8
+ lint: function lint(node, _ref) {
9
+ var _getJsxElementByName;
10
+ var context = _ref.context;
11
+ if (!isNodeOfType(node, 'CallExpression') || !isNodeOfType(node.callee, 'MemberExpression') || !isNodeOfType(node.callee.object, 'Identifier') || !isNodeOfType(node.callee.property, 'Identifier')) {
12
+ return;
13
+ }
14
+ var styles = getStyledComponentCall(node);
15
+ var elementName = node.callee.property.name;
16
+ if (!styles || !isNodeOfType(styles.id, 'Identifier')) {
17
+ return;
18
+ }
19
+ var jsxElement = (_getJsxElementByName = getJsxElementByName(styles.id.name, context.getScope())) === null || _getJsxElementByName === void 0 ? void 0 : _getJsxElementByName.parent;
20
+ if (jsxElement && !isSupportedForLint(jsxElement, elementName)) {
21
+ return;
22
+ }
23
+ context.report({
24
+ node: styles,
25
+ messageId: 'noHtmlButton',
26
+ data: {
27
+ name: node.callee.property.name
28
+ }
29
+ });
30
+ }
31
+ };
@@ -0,0 +1,70 @@
1
+ import { isNodeOfType } from 'eslint-codemod-utils';
2
+ import * as ast from '../../../ast-nodes';
3
+ var supportedElements = [{
4
+ name: 'button'
5
+ }, {
6
+ name: 'input',
7
+ attributes: [{
8
+ name: 'type',
9
+ // Values from https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/button_role#best_practices
10
+ values: ['submit', 'reset', 'button', 'image']
11
+ }]
12
+ }, {
13
+ name: '*',
14
+ attributes: [{
15
+ name: 'role',
16
+ values: ['button']
17
+ }]
18
+ }];
19
+
20
+ /**
21
+ * Determines if the given JSX element is a supported element to lint with this rule.
22
+ */
23
+ export function isSupportedForLint(jsxNode, elementName) {
24
+ if (!isNodeOfType(jsxNode, 'JSXElement')) {
25
+ return false;
26
+ }
27
+
28
+ // Allow passing in the element name because the jsxNode doesn't
29
+ // represent the element name with styled components
30
+ var elName = elementName || ast.JSXElement.getName(jsxNode);
31
+ if (!elName) {
32
+ return false;
33
+ }
34
+
35
+ // Only check native HTML elements, not components
36
+ if (elName[0] !== elName[0].toLowerCase()) {
37
+ return false;
38
+ }
39
+ var supportedElement = supportedElements.find(function (_ref) {
40
+ var name = _ref.name;
41
+ return name === elName;
42
+ });
43
+ if (!supportedElement) {
44
+ supportedElement = supportedElements.find(function (_ref2) {
45
+ var name = _ref2.name;
46
+ return name === '*';
47
+ });
48
+ }
49
+ if (!supportedElement) {
50
+ return false;
51
+ }
52
+
53
+ // Check if the element has any attributes that are not supported
54
+ var attributes = ast.JSXElement.getAttributes(jsxNode);
55
+ if (supportedElement.attributes && !supportedElement.attributes.every(function (_ref3) {
56
+ var name = _ref3.name,
57
+ values = _ref3.values;
58
+ return attributes.some(function (attribute) {
59
+ if (attribute.type === 'JSXSpreadAttribute') {
60
+ return false;
61
+ }
62
+ var isMatchingName = attribute.name.name === name;
63
+ var isMatchingValues = values && attribute.value && attribute.value.type === 'Literal' && typeof attribute.value.value === 'string' && (values === null || values === void 0 ? void 0 : values.includes(attribute.value.value));
64
+ return isMatchingName && isMatchingValues;
65
+ });
66
+ })) {
67
+ return false;
68
+ }
69
+ return true;
70
+ }
@@ -0,0 +1,47 @@
1
+ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
2
+ import { isNodeOfType } from 'eslint-codemod-utils';
3
+
4
+ /**
5
+ * Given a component name finds its JSX usage
6
+ */
7
+ export var getJsxElementByName = function getJsxElementByName(componentName, scope) {
8
+ var _variableDeclaration$;
9
+ var variableDeclaration = scope.variables.find(function (v) {
10
+ return v.name === componentName;
11
+ });
12
+ if (!variableDeclaration) {
13
+ return;
14
+ }
15
+
16
+ // length here should be exactly 2 to indicate only two references:
17
+ // one being the variable declaration itself
18
+ // second being the JSX call site
19
+ // we might consider handling multiple local JSX call sites in the future
20
+ // but "this is good enough for now"™️
21
+ if (variableDeclaration.references.length !== 2) {
22
+ return;
23
+ }
24
+ var jsxUsage = (_variableDeclaration$ = variableDeclaration.references[1]) === null || _variableDeclaration$ === void 0 ? void 0 : _variableDeclaration$.identifier;
25
+ var _variableDeclaration$2 = variableDeclaration.references.map(function (ref) {
26
+ return ref === null || ref === void 0 ? void 0 : ref.identifier;
27
+ }),
28
+ _variableDeclaration$3 = _slicedToArray(_variableDeclaration$2, 2),
29
+ firstIdentifier = _variableDeclaration$3[0],
30
+ secondIdentifier = _variableDeclaration$3[1];
31
+ // Check if the first reference is a JSXOpeningElement and the second is not or vice versa
32
+ if (isNodeOfType(firstIdentifier, 'JSXIdentifier') && !isNodeOfType(secondIdentifier, 'JSXIdentifier')) {
33
+ jsxUsage = firstIdentifier;
34
+ } else if (isNodeOfType(secondIdentifier, 'JSXIdentifier') && !isNodeOfType(firstIdentifier, 'JSXIdentifier')) {
35
+ jsxUsage = secondIdentifier;
36
+ } else {
37
+ return;
38
+ }
39
+ if (!isNodeOfType(jsxUsage, 'JSXIdentifier')) {
40
+ return;
41
+ }
42
+ var jsxOpeningElement = jsxUsage.parent;
43
+ if (!isNodeOfType(jsxOpeningElement, 'JSXOpeningElement')) {
44
+ return;
45
+ }
46
+ return jsxOpeningElement;
47
+ };
@@ -0,0 +1,84 @@
1
+ // eslint-disable-next-line import/no-extraneous-dependencies
2
+
3
+ import { isNodeOfType } from 'eslint-codemod-utils';
4
+ import { createLintRule } from '../utils/create-rule';
5
+ var elementsAccessibleNameProps = ['label', 'titleId'];
6
+ var rule = createLintRule({
7
+ meta: {
8
+ name: 'use-popup-label',
9
+ type: 'suggestion',
10
+ docs: {
11
+ description: 'Encourages to provide accessible name for Atlassian Design System Popup component.',
12
+ recommended: true,
13
+ severity: 'warn'
14
+ },
15
+ messages: {
16
+ missingLabelProp: 'Missing accessible name. If there is no visible content to associate use `label` prop, otherwise pass id of element to `titleId` prop to be associated as label.',
17
+ labelPropShouldHaveContents: 'Define string that labels the interactive element.',
18
+ titleIdShouldHaveValue: '`titleId` should reference the id of element that define accessible name.',
19
+ noBothPropsUsage: 'Do not include both `titleId` and `label` properties. Use `titleId` if the label text is available in the DOM to reference it, otherwise use `label` to provide accessible name explicitly.'
20
+ },
21
+ hasSuggestions: true
22
+ },
23
+ create: function create(context) {
24
+ var contextLocalIdentifier = [];
25
+ return {
26
+ ImportDeclaration: function ImportDeclaration(node) {
27
+ if (node.source.value === '@atlaskit/popup') {
28
+ if (node.specifiers.length) {
29
+ var defaultImport = node.specifiers.filter(function (spec) {
30
+ return spec.type === 'ImportDefaultSpecifier';
31
+ });
32
+ if (defaultImport.length) {
33
+ var local = defaultImport[0].local;
34
+ contextLocalIdentifier.push(local.name);
35
+ }
36
+ }
37
+ }
38
+ },
39
+ JSXElement: function JSXElement(node) {
40
+ if (!isNodeOfType(node, 'JSXElement')) {
41
+ return;
42
+ }
43
+ if (!isNodeOfType(node.openingElement.name, 'JSXIdentifier')) {
44
+ return;
45
+ }
46
+ var name = node.openingElement.name.name;
47
+ if (contextLocalIdentifier.includes(name)) {
48
+ var componentRoleDialogProp = node.openingElement.attributes.find(function (attr) {
49
+ return isNodeOfType(attr, 'JSXAttribute') && isNodeOfType(attr.name, 'JSXIdentifier') && attr.value && isNodeOfType(attr.value, 'Literal') && attr.name.name === 'role' && attr.value.value === 'dialog';
50
+ });
51
+ var componentLabelProps = node.openingElement.attributes.filter(function (attr) {
52
+ return isNodeOfType(attr, 'JSXAttribute') && isNodeOfType(attr.name, 'JSXIdentifier') && elementsAccessibleNameProps.includes(attr.name.name);
53
+ });
54
+ if (componentLabelProps.length === 1) {
55
+ var prop = componentLabelProps[0];
56
+ if ('value' in prop && prop.value) {
57
+ if (isNodeOfType(prop.value, 'Literal') && !prop.value.value || isNodeOfType(prop.value, 'JSXExpressionContainer') && !prop.value.expression) {
58
+ context.report({
59
+ node: prop,
60
+ messageId: prop.name.name === 'label' ? 'labelPropShouldHaveContents' : 'titleIdShouldHaveValue'
61
+ });
62
+ }
63
+ }
64
+ } else if (componentLabelProps.length > 1) {
65
+ context.report({
66
+ node: node.openingElement,
67
+ messageId: 'noBothPropsUsage'
68
+ });
69
+ } else {
70
+ if (componentRoleDialogProp) {
71
+ context.report({
72
+ node: node.openingElement,
73
+ messageId: 'missingLabelProp'
74
+ });
75
+ } else {
76
+ return;
77
+ }
78
+ }
79
+ }
80
+ }
81
+ };
82
+ }
83
+ });
84
+ export default rule;
@@ -0,0 +1,65 @@
1
+ /**
2
+ * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
3
+ * @codegen <<SignedSource::30c84f908843af1f250860b6f3deeea0>>
4
+ * @codegenId spacing
5
+ * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen-token-maps
6
+ * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::55622b91aca9b3afac4bce440f222b71>>
7
+ */
8
+ export declare const positiveSpaceMap: {
9
+ '0px': string;
10
+ '2px': string;
11
+ '4px': string;
12
+ '6px': string;
13
+ '8px': string;
14
+ '12px': string;
15
+ '16px': string;
16
+ '20px': string;
17
+ '24px': string;
18
+ '32px': string;
19
+ '40px': string;
20
+ '48px': string;
21
+ '64px': string;
22
+ '80px': string;
23
+ };
24
+ export type Space = keyof typeof positiveSpaceMap;
25
+ export declare const negativeSpaceMap: {
26
+ '-2px': string;
27
+ '-4px': string;
28
+ '-6px': string;
29
+ '-8px': string;
30
+ '-12px': string;
31
+ '-16px': string;
32
+ '-20px': string;
33
+ '-24px': string;
34
+ '-32px': string;
35
+ };
36
+ export type NegativeSpace = keyof typeof negativeSpaceMap;
37
+ export declare const allSpaceMap: {
38
+ '-2px': string;
39
+ '-4px': string;
40
+ '-6px': string;
41
+ '-8px': string;
42
+ '-12px': string;
43
+ '-16px': string;
44
+ '-20px': string;
45
+ '-24px': string;
46
+ '-32px': string;
47
+ '0px': string;
48
+ '2px': string;
49
+ '4px': string;
50
+ '6px': string;
51
+ '8px': string;
52
+ '12px': string;
53
+ '16px': string;
54
+ '20px': string;
55
+ '24px': string;
56
+ '32px': string;
57
+ '40px': string;
58
+ '48px': string;
59
+ '64px': string;
60
+ '80px': string;
61
+ };
62
+ export type AllSpace = keyof typeof allSpaceMap;
63
+ /**
64
+ * @codegenEnd
65
+ */
@@ -16,7 +16,8 @@ export declare const configs: {
16
16
  '@atlaskit/design-system/no-empty-styled-expression': string;
17
17
  '@atlaskit/design-system/no-exported-css': string;
18
18
  '@atlaskit/design-system/no-exported-keyframes': string;
19
- '@atlaskit/design-system/no-html-button-element': string;
19
+ '@atlaskit/design-system/no-html-anchor': string;
20
+ '@atlaskit/design-system/no-html-button': string;
20
21
  '@atlaskit/design-system/no-invalid-css-map': string;
21
22
  '@atlaskit/design-system/no-keyframes-tagged-template-expression': string;
22
23
  '@atlaskit/design-system/no-margin': string;
@@ -32,6 +33,7 @@ export declare const configs: {
32
33
  '@atlaskit/design-system/use-heading': string;
33
34
  '@atlaskit/design-system/use-heading-level-in-spotlight-card': string;
34
35
  '@atlaskit/design-system/use-href-in-link-item': string;
36
+ '@atlaskit/design-system/use-popup-label': string;
35
37
  '@atlaskit/design-system/use-primitives': string;
36
38
  '@atlaskit/design-system/use-primitives-text': string;
37
39
  '@atlaskit/design-system/use-tokens-space': string;
@@ -62,6 +64,7 @@ export declare const configs: {
62
64
  '@atlaskit/design-system/use-drawer-label': string;
63
65
  '@atlaskit/design-system/use-heading-level-in-spotlight-card': string;
64
66
  '@atlaskit/design-system/use-href-in-link-item': string;
67
+ '@atlaskit/design-system/use-popup-label': string;
65
68
  '@atlaskit/design-system/use-visually-hidden': string;
66
69
  };
67
70
  };
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
3
- * @codegen <<SignedSource::1ab11547db880eba1206f334a9b2150f>>
3
+ * @codegen <<SignedSource::0be7639a95bf4c9bbfe00154d8193477>>
4
4
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
5
5
  */
6
6
  declare const _default: {
@@ -19,7 +19,8 @@ declare const _default: {
19
19
  '@atlaskit/design-system/no-empty-styled-expression': string;
20
20
  '@atlaskit/design-system/no-exported-css': string;
21
21
  '@atlaskit/design-system/no-exported-keyframes': string;
22
- '@atlaskit/design-system/no-html-button-element': string;
22
+ '@atlaskit/design-system/no-html-anchor': string;
23
+ '@atlaskit/design-system/no-html-button': string;
23
24
  '@atlaskit/design-system/no-invalid-css-map': string;
24
25
  '@atlaskit/design-system/no-keyframes-tagged-template-expression': string;
25
26
  '@atlaskit/design-system/no-margin': string;
@@ -35,6 +36,7 @@ declare const _default: {
35
36
  '@atlaskit/design-system/use-heading': string;
36
37
  '@atlaskit/design-system/use-heading-level-in-spotlight-card': string;
37
38
  '@atlaskit/design-system/use-href-in-link-item': string;
39
+ '@atlaskit/design-system/use-popup-label': string;
38
40
  '@atlaskit/design-system/use-primitives': string;
39
41
  '@atlaskit/design-system/use-primitives-text': string;
40
42
  '@atlaskit/design-system/use-tokens-space': string;
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
3
- * @codegen <<SignedSource::05b4fe8f97edc4f7e46ded52b4917037>>
3
+ * @codegen <<SignedSource::73a3666b244b58cc221eebcda071161d>>
4
4
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
5
5
  */
6
6
  declare const _default: {
@@ -26,6 +26,7 @@ declare const _default: {
26
26
  '@atlaskit/design-system/use-drawer-label': string;
27
27
  '@atlaskit/design-system/use-heading-level-in-spotlight-card': string;
28
28
  '@atlaskit/design-system/use-href-in-link-item': string;
29
+ '@atlaskit/design-system/use-popup-label': string;
29
30
  '@atlaskit/design-system/use-visually-hidden': string;
30
31
  };
31
32
  };
@@ -16,7 +16,8 @@ declare const _default: {
16
16
  'no-empty-styled-expression': import("eslint").Rule.RuleModule;
17
17
  'no-exported-css': import("eslint").Rule.RuleModule;
18
18
  'no-exported-keyframes': import("eslint").Rule.RuleModule;
19
- 'no-html-button-element': import("eslint").Rule.RuleModule;
19
+ 'no-html-anchor': import("eslint").Rule.RuleModule;
20
+ 'no-html-button': import("eslint").Rule.RuleModule;
20
21
  'no-invalid-css-map': import("eslint").Rule.RuleModule;
21
22
  'no-keyframes-tagged-template-expression': import("eslint").Rule.RuleModule;
22
23
  'no-margin': import("eslint").Rule.RuleModule;
@@ -32,6 +33,7 @@ declare const _default: {
32
33
  'use-heading': import("eslint").Rule.RuleModule;
33
34
  'use-heading-level-in-spotlight-card': import("eslint").Rule.RuleModule;
34
35
  'use-href-in-link-item': import("eslint").Rule.RuleModule;
36
+ 'use-popup-label': import("eslint").Rule.RuleModule;
35
37
  'use-primitives': import("eslint").Rule.RuleModule;
36
38
  'use-primitives-text': import("eslint").Rule.RuleModule;
37
39
  'use-tokens-space': import("eslint").Rule.RuleModule;
@@ -0,0 +1,3 @@
1
+ import type { Rule } from 'eslint';
2
+ declare const rule: Rule.RuleModule;
3
+ export default rule;
@@ -0,0 +1,2 @@
1
+ export { StyledComponent } from './styled-component';
2
+ export { JSXElement } from './jsx-element';
@@ -0,0 +1,8 @@
1
+ import type { Rule } from 'eslint';
2
+ interface MetaData {
3
+ context: Rule.RuleContext;
4
+ }
5
+ export declare const JSXElement: {
6
+ lint(node: Rule.Node, { context }: MetaData): void;
7
+ };
8
+ export {};
@@ -0,0 +1,6 @@
1
+ import type { Rule } from 'eslint';
2
+ import { type VariableDeclarator } from 'eslint-codemod-utils';
3
+ /**
4
+ * Returns a styled component
5
+ */
6
+ export declare const getStyledComponentCall: (node: Rule.Node) => (VariableDeclarator & Rule.NodeParentExtension) | undefined;
@@ -0,0 +1,8 @@
1
+ import type { Rule } from 'eslint';
2
+ interface MetaData {
3
+ context: Rule.RuleContext;
4
+ }
5
+ export declare const StyledComponent: {
6
+ lint(node: Rule.Node, { context }: MetaData): void;
7
+ };
8
+ export {};
@@ -0,0 +1,7 @@
1
+ import { type EslintNode } from 'eslint-codemod-utils';
2
+ /**
3
+ * Determines if the given JSX element is a supported element to lint with this rule.
4
+ */
5
+ export declare function isSupportedForLint(jsxNode: EslintNode, elementName?: string): jsxNode is Extract<EslintNode, {
6
+ type: 'JSXElement';
7
+ }>;
@@ -0,0 +1,6 @@
1
+ import type { Rule, Scope } from 'eslint';
2
+ import { type JSXOpeningElement } from 'eslint-codemod-utils';
3
+ /**
4
+ * Given a component name finds its JSX usage
5
+ */
6
+ export declare const getJsxElementByName: (componentName: string, scope: Scope.Scope) => (JSXOpeningElement & Rule.NodeParentExtension) | undefined;
@@ -0,0 +1,3 @@
1
+ import type { Rule } from 'eslint';
2
+ declare const rule: Rule.RuleModule;
3
+ export default rule;
@@ -0,0 +1,2 @@
1
+ export { StyledComponent } from './styled-component';
2
+ export { JSXElement } from './jsx-element';
@@ -0,0 +1,8 @@
1
+ import type { Rule } from 'eslint';
2
+ interface MetaData {
3
+ context: Rule.RuleContext;
4
+ }
5
+ export declare const JSXElement: {
6
+ lint(node: Rule.Node, { context }: MetaData): void;
7
+ };
8
+ export {};
@@ -0,0 +1,6 @@
1
+ import type { Rule } from 'eslint';
2
+ import { type VariableDeclarator } from 'eslint-codemod-utils';
3
+ /**
4
+ * Returns a styled component
5
+ */
6
+ export declare const getStyledComponentCall: (node: Rule.Node) => (VariableDeclarator & Rule.NodeParentExtension) | undefined;
@@ -0,0 +1,8 @@
1
+ import type { Rule } from 'eslint';
2
+ interface MetaData {
3
+ context: Rule.RuleContext;
4
+ }
5
+ export declare const StyledComponent: {
6
+ lint(node: Rule.Node, { context }: MetaData): void;
7
+ };
8
+ export {};
@@ -0,0 +1,7 @@
1
+ import { type EslintNode } from 'eslint-codemod-utils';
2
+ /**
3
+ * Determines if the given JSX element is a supported element to lint with this rule.
4
+ */
5
+ export declare function isSupportedForLint(jsxNode: EslintNode, elementName?: string): jsxNode is Extract<EslintNode, {
6
+ type: 'JSXElement';
7
+ }>;
@@ -0,0 +1,6 @@
1
+ import type { Rule, Scope } from 'eslint';
2
+ import { type JSXOpeningElement } from 'eslint-codemod-utils';
3
+ /**
4
+ * Given a component name finds its JSX usage
5
+ */
6
+ export declare const getJsxElementByName: (componentName: string, scope: Scope.Scope) => (JSXOpeningElement & Rule.NodeParentExtension) | undefined;
@@ -0,0 +1,3 @@
1
+ import type { Rule } from 'eslint';
2
+ declare const rule: Rule.RuleModule;
3
+ export default rule;
@@ -127,39 +127,6 @@ export declare const fontFamilyTokens: ({
127
127
  name: string;
128
128
  path: string[];
129
129
  cleanName: string;
130
- } | {
131
- attributes: {
132
- group: string;
133
- state: string;
134
- introduced: string;
135
- deprecated: string;
136
- description: string;
137
- responsiveSmallerVariant?: undefined;
138
- };
139
- value: string;
140
- filePath: string;
141
- isSource: boolean;
142
- original: {
143
- attributes: {
144
- group: string;
145
- state: string;
146
- introduced: string;
147
- deprecated: string;
148
- description: string;
149
- responsiveSmallerVariant?: undefined;
150
- };
151
- value: {
152
- fontWeight: string;
153
- fontSize: string;
154
- lineHeight: string;
155
- fontFamily: string;
156
- fontStyle: string;
157
- letterSpacing: string;
158
- };
159
- };
160
- name: string;
161
- path: string[];
162
- cleanName: string;
163
130
  } | {
164
131
  attributes: {
165
132
  group: string;