no-excessive-whitespace.ts

import { ESLintUtils } from '@typescript-eslint/utils';

export default ESLintUtils.RuleCreator((name) => name)({
  name: 'no-excessive-whitespace',
  meta: {
    type: 'layout',
    fixable: 'whitespace',
    docs: {
      description: 'Find excessive whitespace in classnames',
      recommended: false,
    },
    messages: {
      'excessive-whitespace': 'excessive whitespace in classnames',
    },
    schema: [],
  },
  defaultOptions: [],
  create: (context) => {
    return {
      JSXAttribute: async (node) => {
        const {
          name: { name },
          value,
        } = node;

        if (name !== 'className' || !value) {
          return;
        }

        if (value.type === 'Literal') {
          const { value: className } = value;

          if (typeof className !== 'string') {
            return;
          }

          const normalizedClassName = className.trim().replace(/\s+/g, ' ');

          if (className !== normalizedClassName) {
            context.report({
              node,
              messageId: 'excessive-whitespace',
              fix: (fixer) =>
                fixer.replaceText(node, `'${normalizedClassName}'`),
            });

            return false;
          }
        }

        return true;
      },
    };
  },
});