@atlaskit/eslint-plugin-design-system
Version:
The essential plugin for use with the Atlassian Design System.
76 lines • 3.31 kB
JavaScript
import { createLintRule } from '../utils/create-lint-rule';
import { errorBoundary } from '../utils/error-boundary';
import { getConfig } from './config/get-config';
import { PATTERNS } from './config/patterns';
import { RestrictedCapitalisation } from './linters/restricted-capitalisation';
import { RestrictedProperty } from './linters/restricted-property';
import { WrappedTokenValue } from './linters/wrapped-token-value';
const typescriptErrorMessage = 'There is ongoing work to make this a TypeScript error. Once that happens, you will have to delete/refactor anyway.';
const rule = createLintRule({
meta: {
name: 'use-latest-xcss-syntax-typography',
type: 'problem',
fixable: 'code',
hasSuggestions: false,
schema: [{
type: 'object',
properties: {
failSilently: {
type: 'boolean'
},
patterns: {
maxLength: PATTERNS.length,
type: 'array',
items: {
type: 'string',
enum: PATTERNS
},
uniqueItems: true
}
},
additionalProperties: false
}],
docs: {
description: 'Prohibits use of unsafe styling properties in xcss. Please use Text/Heading primitives instead.',
recommended: true,
severity: 'warn'
},
messages: {
noRestrictedTypographyProperties: `Don't set '{{ property }}' on xcss as it allows invalid combinations of typography tokens. ${typescriptErrorMessage}`,
noRestrictedTypographyPropertiesHeading: `Don't set '{{ property }}' on xcss in combination with 'font' heading tokens. ${typescriptErrorMessage}`,
noRestrictedCapitalisation: `Avoid using ALL CAPS as it reduces readability and is bad for accessibility.`,
noWrappedTokenTypographyValues: `Don't wrap typography tokens in xcss. ${typescriptErrorMessage}`
}
},
create(context) {
// TODO: JFP-2823 - this type cast was added due to Jira's ESLint v9 migration
const config = getConfig(context.options[0]);
return errorBoundary({
'CallExpression[callee.name="xcss"] ObjectExpression > Property > Identifier[name=/(fontSize|lineHeight|fontWeight|letterSpacing)/]': node => RestrictedProperty.lint(node, {
context,
config
}),
'CallExpression[callee.name="xcss"] ObjectExpression > Property > Literal[value=/(fontSize|lineHeight|fontWeight|letterSpacing)/]': node => RestrictedProperty.lint(node, {
context,
config
}),
'CallExpression[callee.name="xcss"] ObjectExpression > Property > Identifier[name=textTransform]': node => RestrictedCapitalisation.lint(node, {
context,
config
}),
'CallExpression[callee.name="xcss"] ObjectExpression > Property > Literal[value=textTransform]': node => RestrictedCapitalisation.lint(node, {
context,
config
}),
'CallExpression[callee.name="xcss"] ObjectExpression > Property > Identifier[name=/(font|fontFamily|fontWeight)/]': node => WrappedTokenValue.lint(node, {
context,
config
}),
'CallExpression[callee.name="xcss"] ObjectExpression > Property > Literal[value=/(font|fontFamily|fontWeight)/]': node => WrappedTokenValue.lint(node, {
context,
config
})
}, config);
}
});
export default rule;