feat(eslint-plugin): add key-spacing rule extension for interface & type declarations (#6211)

* 🚧 key-spacing for interface on default settings

* 🚧 Support type literals as welll

* 🚧 Add full typing for the options

* 🚧 Add 'mode' param

* 🐛 Fix index signatures

* ✨ Support classes

* 🩹 fixes

* ✅ Add tests on mode, multiLine, singleLine

* 🏷️ Allow options.multiline.align to be an object

* 🎨 Use ast utils to locate last character before token

* ✨ Support comments in-between properties

* ✅ Add test cases for nested type declarations & multiline type annotations

* ✨ Autofix for non-aligned values

* ✨ Autofix for aligned values

* ✏️

* 🚨

* 🐛 Support optional ? token

* ✅ Add tests with class property assignments

* 📝 Add documentation on key-spacing

* 🎨 Use .at() to access last element of array

* ✅ Fix tests

* fixup! ✅ Fix tests

* ✅ Add some coverage

* 🐛 Fix edge case in determining aligned groups

In case there is three statements in one line, and one statement in the line after

* ⚡️ Use Array.concat instead of .push(...)

.push could error if 60k + arguments

* 🎨 Improve readability

* 🎨 Use tempate literals in tests

* ✅ Add test with anonymous types

* ✅ Add test with quoted keys

* ➕ Add grapheme-splitter to deal with emojis

* ✅ Add test case for multiline comments

* 🚨 Remove 'in' statements, reduce amount of null-assertions

* ✅ Add test case for properties without type annotation or assignments

* ✅ Add wacky test cases

* ✅ Add coverage

* ✅ Add coverage, again

* ✅ Add coverage, again

* ✅ Add coverage when align is an object, but align.on is missing

It defaults to 'colon' in this case

* KeyTypeNodeWithTypeAnnotation

* Extract to shared helper

Co-authored-by: Josh Goldberg <[email protected]>

Author: coyotte508

packages/eslint-plugin/docs/rules/key-spacing.md

@@ -0,0 +1,12 @@
+---
+description: 'Enforce consistent spacing between property names and type annotations in types and interfaces.'
+---
+
+> 🛑 This file is source code, not the primary documentation location! 🛑
+>
+> See **https://typescript-eslint.io/rules/key-spacing** for documentation.
+
+## Examples
+
+This rule extends the base [`eslint/keyword-spacing`](https://eslint.org/docs/rules/key-spacing) rule.
+This version adds support for type annotations on interfaces, classes and type literals properties.

packages/eslint-plugin/package.json

@@ -50,6 +50,7 @@
     "debug": "^4.3.4",
     "grapheme-splitter": "^1.0.4",
     "ignore": "^5.2.0",
+    "grapheme-splitter": "^1.0.4",
     "natural-compare-lite": "^1.4.0",
     "regexpp": "^3.2.0",
     "semver": "^7.3.7",

packages/eslint-plugin/src/configs/all.ts

@@ -37,6 +37,8 @@ export = {
     '@typescript-eslint/indent': 'error',
     'init-declarations': 'off',
     '@typescript-eslint/init-declarations': 'error',
+    'key-spacing': 'off',
+    '@typescript-eslint/key-spacing': 'error',
     'keyword-spacing': 'off',
     '@typescript-eslint/keyword-spacing': 'error',
     'lines-between-class-members': 'off',

packages/eslint-plugin/src/rules/ban-ts-comment.ts

@@ -1,22 +1,7 @@
 import { AST_TOKEN_TYPES } from '@typescript-eslint/utils';
-import GraphemeSplitter from 'grapheme-splitter';
 
 import * as util from '../util';
 
-let splitter: GraphemeSplitter;
-function isASCII(value: string): boolean {
-  return /^[\u0020-\u007f]*$/u.test(value);
-}
-function getStringLength(value: string): number {
-  if (isASCII(value)) {
-    return value.length;
-  }
-
-  splitter ??= new GraphemeSplitter();
-
-  return splitter.countGraphemes(value);
-}
-
 type DirectiveConfig =
   | boolean
   | 'allow-with-description'
@@ -163,7 +148,8 @@ export default util.createRule<[Options], MessageIds>({
             } = options;
             const format = descriptionFormats.get(fullDirective);
             if (
-              getStringLength(description.trim()) < minimumDescriptionLength
+              util.getStringLength(description.trim()) <
+              minimumDescriptionLength
             ) {
               context.report({
                 data: { directive, minimumDescriptionLength },

packages/eslint-plugin/src/rules/index.ts

@@ -22,6 +22,7 @@ import explicitModuleBoundaryTypes from './explicit-module-boundary-types';
 import funcCallSpacing from './func-call-spacing';
 import indent from './indent';
 import initDeclarations from './init-declarations';
+import keySpacing from './key-spacing';
 import keywordSpacing from './keyword-spacing';
 import linesBetweenClassMembers from './lines-between-class-members';
 import memberDelimiterStyle from './member-delimiter-style';
@@ -153,6 +154,7 @@ export default {
   'func-call-spacing': funcCallSpacing,
   indent: indent,
   'init-declarations': initDeclarations,
+  'key-spacing': keySpacing,
   'keyword-spacing': keywordSpacing,
   'lines-between-class-members': linesBetweenClassMembers,
   'member-delimiter-style': memberDelimiterStyle,