@atlaskit/eslint-plugin-design-system
Version:
The essential plugin for use with the Atlassian Design System.
40 lines (39 loc) • 1.46 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _createLintRule = require("../utils/create-lint-rule");
var _jsxElement = require("./node-types/jsx-element");
var _styledComponent = require("./node-types/styled-component");
var rule = (0, _createLintRule.createLintRule)({
meta: {
name: 'no-html-button',
type: 'suggestion',
docs: {
description: 'Discourage direct usage of HTML button elements in favor of Atlassian Design System button components.',
recommended: true,
severity: 'warn'
},
messages: {
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."
}
},
create: function create(context) {
return {
// transforms styled.<button>(...) usages
CallExpression: function CallExpression(node) {
_styledComponent.StyledComponent.lint(node, {
context: context
});
},
// transforms <button css={...}> usages
JSXElement: function JSXElement(node) {
_jsxElement.JSXElement.lint(node, {
context: context
});
}
};
}
});
var _default = exports.default = rule;