UNPKG

@atlaskit/stylelint-design-system

Version:

Stylelint plugin for use with the Atlassian Design System.

142 lines (141 loc) 5.51 kB
import _toArray from "@babel/runtime/helpers/toArray"; function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; } import valueParser from 'postcss-value-parser'; import stylelint from 'stylelint'; import renameMapping from '@atlaskit/tokens/rename-mapping'; import { getCSSCustomProperty } from '@atlaskit/tokens/utils/get-css-custom-property'; import { getDefaultTokenValue } from '../../utils/get-default-token-value'; import { isFunction } from '../../utils/is-function'; import { isToken } from '../../utils/is-token'; import { isVar } from '../../utils/is-var'; import { isWord } from '../../utils/is-word'; export var ruleName = 'design-system/no-unsafe-design-token-usage'; export var messages = stylelint.utils.ruleMessages(ruleName, { invalidToken: function invalidToken(name) { return "The token '".concat(name, "' does not exist. You can find the design tokens reference at <https://atlaskit.atlassian.com/packages/design-system/tokens/docs/tokens-reference>."); }, tokenRemoved: function tokenRemoved(name, replacement) { return "The token '".concat(name, "' has been deleted. Please use ").concat(replacement, " instead."); }, missingFallback: 'Token usage is missing a fallback.', hasFallback: 'Token usage has a fallback.' }); var isInvalidToken = function isInvalidToken(node) { return isWord(node) && node.value.startsWith('--ds-') && !isToken(node); }; var isDeletedToken = function isDeletedToken(node) { return isWord(node) && node.value.startsWith('--ds-') && renameMapping.filter(function (_ref) { var state = _ref.state; return state === 'deleted'; }).some(function (token) { return getCSSCustomProperty(token.path) === node.value; }); }; var ruleBase = function ruleBase(isEnabled) { var flags = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; var context = arguments.length > 2 ? arguments[2] : undefined; return function (root, result) { var validOptions = stylelint.utils.validateOptions(result, ruleName, { actual: isEnabled, possible: [true, false] }, { actual: flags, possible: { shouldEnsureFallbackUsage: [true, false], fallbackUsage: ['forced', 'optional', 'none'] }, optional: true }); if (!validOptions || !isEnabled) { return; } var _ref2 = flags, shouldEnsureFallbackUsage = _ref2.shouldEnsureFallbackUsage, _ref2$fallbackUsage = _ref2.fallbackUsage, fallbackUsage = _ref2$fallbackUsage === void 0 ? 'optional' : _ref2$fallbackUsage; var fallbackUsageStrategy = fallbackUsage; if (shouldEnsureFallbackUsage) { fallbackUsageStrategy = 'forced'; } else if (shouldEnsureFallbackUsage === false) { fallbackUsageStrategy = 'none'; } root.walkDecls(function (decl) { var parsedValue = valueParser(decl.value); parsedValue.walk(function (node) { if (!isFunction(node) || !isVar(node)) { return; } var _node$nodes = _toArray(node.nodes), head = _node$nodes[0], tail = _arrayLikeToArray(_node$nodes).slice(1); if (!head) { return; } if (isDeletedToken(head)) { var tokenMeta = renameMapping.find(function (_ref3) { var path = _ref3.path; return getCSSCustomProperty(path) === head.value; }); if (!tokenMeta) { return; } if (tokenMeta.replacement) { var replacement = getCSSCustomProperty(tokenMeta.replacement); if (context.fix) { decl.value = decl.value.replace(head.value, replacement); return; } else { return stylelint.utils.report({ message: messages.tokenRemoved(head.value, replacement), node: decl, word: node.value, result: result, ruleName: ruleName }); } } } if (isInvalidToken(head)) { return stylelint.utils.report({ message: messages.invalidToken(head.value), node: decl, word: node.value, result: result, ruleName: ruleName }); } var isTokenUsage = isToken(head); if (!isTokenUsage) { return; } var hasFallback = tail.some(function (node) { return !isToken(node); }); if (fallbackUsageStrategy === 'optional' || fallbackUsageStrategy === 'forced' && hasFallback || fallbackUsageStrategy === 'none' && !hasFallback) { return; } if (context.fix && !hasFallback) { var defaultFallback = getDefaultTokenValue(head); if (defaultFallback) { decl.value = decl.value.replace(head.value, "".concat(head.value, ", ").concat(defaultFallback)); return; } } stylelint.utils.report({ message: hasFallback ? messages.hasFallback : messages.missingFallback, node: decl, word: node.value, result: result, ruleName: ruleName }); }); }); }; }; var rule = Object.assign(ruleBase, { ruleName: ruleName, messages: messages }); var plugin = stylelint.createPlugin(ruleName, rule); // eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports export default plugin;