@atlaskit/eslint-plugin-design-system 9.5.2 → 9.6.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.
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,11 @@
|
|
|
1
1
|
# @atlaskit/eslint-plugin-design-system
|
|
2
2
|
|
|
3
|
+
## 9.6.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- [#94356](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/94356) [`8c4f5854f3da`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/8c4f5854f3da) - The `icon-label` rule now supports label being defined via spreading render props in the new buttons.
|
|
8
|
+
|
|
3
9
|
## 9.5.2
|
|
4
10
|
|
|
5
11
|
### Patch Changes
|
|
@@ -7,7 +7,7 @@ exports.default = void 0;
|
|
|
7
7
|
var _eslintCodemodUtils = require("eslint-codemod-utils");
|
|
8
8
|
var _createRule = require("../utils/create-rule");
|
|
9
9
|
var _jsx = require("../utils/jsx");
|
|
10
|
-
var elements = ['AkButton', 'AKButton', 'Button', 'MenuItem', 'ButtonItem', 'CustomItem', 'CustomThemeButton', 'LoadingButton', 'BreadcrumbsItem'];
|
|
10
|
+
var elements = ['AkButton', 'AKButton', 'Button', 'IconButton', 'MenuItem', 'ButtonItem', 'CustomItem', 'CustomThemeButton', 'LoadingButton', 'BreadcrumbsItem'];
|
|
11
11
|
var elementsIconProps = ['iconBefore', 'iconAfter', 'icon'];
|
|
12
12
|
var rule = (0, _createRule.createLintRule)({
|
|
13
13
|
meta: {
|
|
@@ -46,15 +46,7 @@ var rule = (0, _createRule.createLintRule)({
|
|
|
46
46
|
iconImports[defaultImportName] = true;
|
|
47
47
|
}
|
|
48
48
|
},
|
|
49
|
-
JSXElement: function (
|
|
50
|
-
function JSXElement(_x) {
|
|
51
|
-
return _JSXElement.apply(this, arguments);
|
|
52
|
-
}
|
|
53
|
-
JSXElement.toString = function () {
|
|
54
|
-
return _JSXElement.toString();
|
|
55
|
-
};
|
|
56
|
-
return JSXElement;
|
|
57
|
-
}(function (node) {
|
|
49
|
+
JSXElement: function JSXElement(node) {
|
|
58
50
|
if (!(0, _eslintCodemodUtils.isNodeOfType)(node, 'JSXElement')) {
|
|
59
51
|
return;
|
|
60
52
|
}
|
|
@@ -106,7 +98,19 @@ var rule = (0, _createRule.createLintRule)({
|
|
|
106
98
|
if (iconImports[name]) {
|
|
107
99
|
// We've found an icon from @atlaskit - let's get to work.
|
|
108
100
|
var hasLabelProp = (0, _jsx.findProp)(node, 'label');
|
|
109
|
-
|
|
101
|
+
var hasSpreadPropApplied = false;
|
|
102
|
+
|
|
103
|
+
// Check to see if it's inside an arrow function and the props have been spread
|
|
104
|
+
// ✅ <IconButton icon={(iconProps) => <StarIcon {...iconProps} />} label="Add to favorites" />
|
|
105
|
+
// ❌ <IconButton icon={() => <StarIcon />} label="Add to favorites" />
|
|
106
|
+
if (node.parent && (0, _eslintCodemodUtils.isNodeOfType)(node.parent, 'ArrowFunctionExpression') && node.parent.params[0] && node.parent.params[0].type === 'Identifier') {
|
|
107
|
+
// We are using an arrow function, test if the params have been spread onto the icon component
|
|
108
|
+
var paramName = node.parent.params[0].name;
|
|
109
|
+
hasSpreadPropApplied = !!node.openingElement.attributes.find(function (attribute) {
|
|
110
|
+
return attribute.type === 'JSXSpreadAttribute' && attribute.argument.type === 'Identifier' && attribute.argument.name === paramName;
|
|
111
|
+
});
|
|
112
|
+
}
|
|
113
|
+
if (!hasLabelProp && !hasSpreadPropApplied) {
|
|
110
114
|
context.report({
|
|
111
115
|
node: node.openingElement,
|
|
112
116
|
messageId: 'missingLabelProp'
|
|
@@ -114,7 +118,7 @@ var rule = (0, _createRule.createLintRule)({
|
|
|
114
118
|
return;
|
|
115
119
|
}
|
|
116
120
|
}
|
|
117
|
-
}
|
|
121
|
+
}
|
|
118
122
|
};
|
|
119
123
|
}
|
|
120
124
|
});
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { isNodeOfType } from 'eslint-codemod-utils';
|
|
2
2
|
import { createLintRule } from '../utils/create-rule';
|
|
3
3
|
import { findProp } from '../utils/jsx';
|
|
4
|
-
const elements = ['AkButton', 'AKButton', 'Button', 'MenuItem', 'ButtonItem', 'CustomItem', 'CustomThemeButton', 'LoadingButton', 'BreadcrumbsItem'];
|
|
4
|
+
const elements = ['AkButton', 'AKButton', 'Button', 'IconButton', 'MenuItem', 'ButtonItem', 'CustomItem', 'CustomThemeButton', 'LoadingButton', 'BreadcrumbsItem'];
|
|
5
5
|
const elementsIconProps = ['iconBefore', 'iconAfter', 'icon'];
|
|
6
6
|
const rule = createLintRule({
|
|
7
7
|
meta: {
|
|
@@ -86,7 +86,17 @@ const rule = createLintRule({
|
|
|
86
86
|
if (iconImports[name]) {
|
|
87
87
|
// We've found an icon from @atlaskit - let's get to work.
|
|
88
88
|
const hasLabelProp = findProp(node, 'label');
|
|
89
|
-
|
|
89
|
+
let hasSpreadPropApplied = false;
|
|
90
|
+
|
|
91
|
+
// Check to see if it's inside an arrow function and the props have been spread
|
|
92
|
+
// ✅ <IconButton icon={(iconProps) => <StarIcon {...iconProps} />} label="Add to favorites" />
|
|
93
|
+
// ❌ <IconButton icon={() => <StarIcon />} label="Add to favorites" />
|
|
94
|
+
if (node.parent && isNodeOfType(node.parent, 'ArrowFunctionExpression') && node.parent.params[0] && node.parent.params[0].type === 'Identifier') {
|
|
95
|
+
// We are using an arrow function, test if the params have been spread onto the icon component
|
|
96
|
+
const paramName = node.parent.params[0].name;
|
|
97
|
+
hasSpreadPropApplied = !!node.openingElement.attributes.find(attribute => attribute.type === 'JSXSpreadAttribute' && attribute.argument.type === 'Identifier' && attribute.argument.name === paramName);
|
|
98
|
+
}
|
|
99
|
+
if (!hasLabelProp && !hasSpreadPropApplied) {
|
|
90
100
|
context.report({
|
|
91
101
|
node: node.openingElement,
|
|
92
102
|
messageId: 'missingLabelProp'
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { isNodeOfType } from 'eslint-codemod-utils';
|
|
2
2
|
import { createLintRule } from '../utils/create-rule';
|
|
3
3
|
import { findProp } from '../utils/jsx';
|
|
4
|
-
var elements = ['AkButton', 'AKButton', 'Button', 'MenuItem', 'ButtonItem', 'CustomItem', 'CustomThemeButton', 'LoadingButton', 'BreadcrumbsItem'];
|
|
4
|
+
var elements = ['AkButton', 'AKButton', 'Button', 'IconButton', 'MenuItem', 'ButtonItem', 'CustomItem', 'CustomThemeButton', 'LoadingButton', 'BreadcrumbsItem'];
|
|
5
5
|
var elementsIconProps = ['iconBefore', 'iconAfter', 'icon'];
|
|
6
6
|
var rule = createLintRule({
|
|
7
7
|
meta: {
|
|
@@ -40,15 +40,7 @@ var rule = createLintRule({
|
|
|
40
40
|
iconImports[defaultImportName] = true;
|
|
41
41
|
}
|
|
42
42
|
},
|
|
43
|
-
JSXElement: function (
|
|
44
|
-
function JSXElement(_x) {
|
|
45
|
-
return _JSXElement.apply(this, arguments);
|
|
46
|
-
}
|
|
47
|
-
JSXElement.toString = function () {
|
|
48
|
-
return _JSXElement.toString();
|
|
49
|
-
};
|
|
50
|
-
return JSXElement;
|
|
51
|
-
}(function (node) {
|
|
43
|
+
JSXElement: function JSXElement(node) {
|
|
52
44
|
if (!isNodeOfType(node, 'JSXElement')) {
|
|
53
45
|
return;
|
|
54
46
|
}
|
|
@@ -100,7 +92,19 @@ var rule = createLintRule({
|
|
|
100
92
|
if (iconImports[name]) {
|
|
101
93
|
// We've found an icon from @atlaskit - let's get to work.
|
|
102
94
|
var hasLabelProp = findProp(node, 'label');
|
|
103
|
-
|
|
95
|
+
var hasSpreadPropApplied = false;
|
|
96
|
+
|
|
97
|
+
// Check to see if it's inside an arrow function and the props have been spread
|
|
98
|
+
// ✅ <IconButton icon={(iconProps) => <StarIcon {...iconProps} />} label="Add to favorites" />
|
|
99
|
+
// ❌ <IconButton icon={() => <StarIcon />} label="Add to favorites" />
|
|
100
|
+
if (node.parent && isNodeOfType(node.parent, 'ArrowFunctionExpression') && node.parent.params[0] && node.parent.params[0].type === 'Identifier') {
|
|
101
|
+
// We are using an arrow function, test if the params have been spread onto the icon component
|
|
102
|
+
var paramName = node.parent.params[0].name;
|
|
103
|
+
hasSpreadPropApplied = !!node.openingElement.attributes.find(function (attribute) {
|
|
104
|
+
return attribute.type === 'JSXSpreadAttribute' && attribute.argument.type === 'Identifier' && attribute.argument.name === paramName;
|
|
105
|
+
});
|
|
106
|
+
}
|
|
107
|
+
if (!hasLabelProp && !hasSpreadPropApplied) {
|
|
104
108
|
context.report({
|
|
105
109
|
node: node.openingElement,
|
|
106
110
|
messageId: 'missingLabelProp'
|
|
@@ -108,7 +112,7 @@ var rule = createLintRule({
|
|
|
108
112
|
return;
|
|
109
113
|
}
|
|
110
114
|
}
|
|
111
|
-
}
|
|
115
|
+
}
|
|
112
116
|
};
|
|
113
117
|
}
|
|
114
118
|
});
|
package/package.json
CHANGED