| import valueParser from 'postcss-value-parser'; |
| |
| import { atRuleParamIndex, declarationValueIndex } from '../../utils/nodeFieldIndices.mjs'; |
| import { atRuleRegexes, propertyRegexes } from '../../utils/regexes.mjs'; |
| import { isRegExp, isString } from '../../utils/validateTypes.mjs'; |
| import { basicKeywords } from '../../reference/keywords.mjs'; |
| import isStandardSyntaxAtRule from '../../utils/isStandardSyntaxAtRule.mjs'; |
| import isStandardSyntaxDeclaration from '../../utils/isStandardSyntaxDeclaration.mjs'; |
| import isStandardSyntaxValue from '../../utils/isStandardSyntaxValue.mjs'; |
| import report from '../../utils/report.mjs'; |
| import ruleMessages from '../../utils/ruleMessages.mjs'; |
| import validateOptions from '../../utils/validateOptions.mjs'; |
| |
| const ruleName = 'container-name-pattern'; |
| |
| const messages = ruleMessages(ruleName, { |
| expected: (containerName, pattern) => `Expected "${containerName}" to match pattern "${pattern}"`, |
| }); |
| |
| const meta = { |
| url: 'https://stylelint.io/user-guide/rules/container-name-pattern', |
| }; |
| |
| const KEYWORDS = new Set(['and', 'or', 'none', 'not']); |
| |
| /** @type {import('stylelint').CoreRules[ruleName]} */ |
| const rule = (primary) => { |
| return (root, result) => { |
| const validOptions = validateOptions(result, ruleName, { |
| actual: primary, |
| possible: [isRegExp, isString], |
| }); |
| |
| if (!validOptions) return; |
| |
| const regex = isString(primary) ? new RegExp(primary) : primary; |
| |
| const languageCssWideKeywords = |
| result.stylelint.config?.languageOptions?.syntax?.cssWideKeywords ?? []; |
| |
| const cssWideKeywords = new Set([...basicKeywords, ...languageCssWideKeywords]); |
| |
| root.walkDecls(propertyRegexes.containerNameAndShorthandName, (decl) => { |
| if (!isStandardSyntaxDeclaration(decl)) return; |
| |
| const parsedValue = valueParser(decl.value); |
| |
| let isContainerType = false; |
| |
| parsedValue.walk(({ sourceIndex, type, value }) => { |
| if (isContainerType) return; |
| |
| if (type === 'div' && value === '/') isContainerType = true; |
| |
| if (type !== 'word') return false; |
| |
| if (cssWideKeywords.has(value.toLowerCase())) return; |
| |
| if (!isStandardSyntaxValue(value)) return; |
| |
| if (regex.test(value)) return; |
| |
| complain(declarationValueIndex(decl) + sourceIndex, value, decl); |
| }); |
| }); |
| |
| root.walkAtRules(atRuleRegexes.containerName, (atRule) => { |
| if (!isStandardSyntaxAtRule(atRule)) return; |
| |
| const { params } = atRule; |
| |
| const parsedValue = valueParser(params); |
| |
| parsedValue.walk(({ sourceIndex, type, value }) => { |
| if (type !== 'word') return false; |
| |
| if (KEYWORDS.has(value.toLowerCase())) return; |
| |
| if (regex.test(value)) return; |
| |
| complain(atRuleParamIndex(atRule) + sourceIndex, value, atRule); |
| }); |
| }); |
| |
| /** |
| * @param {number} index |
| * @param {string} containerName |
| * @param {import('postcss').Declaration|import('postcss').AtRule} node |
| */ |
| function complain(index, containerName, node) { |
| report({ |
| result, |
| ruleName, |
| message: messages.expected, |
| messageArgs: [containerName, primary], |
| node, |
| index, |
| endIndex: index + containerName.length, |
| }); |
| } |
| }; |
| }; |
| |
| rule.ruleName = ruleName; |
| rule.messages = messages; |
| rule.meta = meta; |
| export default rule; |