@patreon/studio/css-config/stylelint/enforce-custom-media.mjs

Patreon Studio Design System

import stylelint from 'stylelint';
import matchesStringOrRegExp from 'stylelint/lib/utils/matchesStringOrRegExp.mjs';
import { isRegExp, isString } from 'stylelint/lib/utils/validateTypes.mjs';

const {
  createPlugin,
  utils: { report, ruleMessages, validateOptions },
} = stylelint;

const ruleName = 'studio/enforce-custom-media';
const messages = ruleMessages(ruleName, {
  expected: (namespace, rule) => `"${namespace}" is not a valid media query, it should match "${rule}"`,
});

/** @type {import('stylelint').Rule} */
function pluginFunction(primaryOption) {
  return (root, result) => {
    // validate the options
    const validOptions = validateOptions(result, ruleName, {
      actual: primaryOption,
      possible: [isString, isRegExp],
    });

    // bail if it is not a valid option
    if (!validOptions) {
      return;
    }

    root.walkAtRules('media', (atRule) => {
      const mediaName = atRule.params.substring(1, atRule.params.length - 1);
      const matches = matchesStringOrRegExp(mediaName, primaryOption);

      // bail if the media query is not in the valid list
      if (!matches) {
        report({
          message: messages.expected(mediaName, primaryOption),
          node: atRule,
          word: mediaName,
          result,
          ruleName,
        });
      }
    });
  };
}

pluginFunction.ruleName = ruleName;
pluginFunction.messages = messages;

// biome-ignore lint/style/noDefaultExport: legacy code
export default createPlugin(ruleName, pluginFunction);