Update to Angular 20 (#189)

Only rule changes are as follows:
- `@angular-eslint/component-class-suffix` removed (was `error`)
- `@angular-eslint/directive-class-suffix` removed (was `error`)

We also have a new recommended rule that we are disabling:
- `@angular-eslint/prefer-inject`
Apparently, using the `inject()` function is recommended over injection
as constructor arguments. Angular even provides an automatic migration
(`ng generate @angular/core:inject`), but it's not smart. It just puts
new fields immediately before the constructor, but they need to be
declared/initialized before any other field initializers that depend on
them. For automation purposes (and probably as general convention), that
means we want them declared at the top of the class.
`@typescript-eslint/member-ordering` doesn't have an automated fix-up,
nor the ability to take initializers into acount. The
[Perfectionist](https://perfectionist.dev/)
[`sort-classes`](https://perfectionist.dev/rules/sort-classes#accessors)
rule has both of those, so I optimistically tried using that instead. We
can configure their rule to enforce (and automate the sorting of) fields
initialized with `inject(...` coming before all other fields. But I
wasn't able to prevent it from auto-sorting getter/setter pairs with
different access modifiers apart from each other (which is also a
violation).

Aside from this it's unclear how painful it would be to update unit test
code that might be constructing these objects directly. Based on all
this, I'm disabling the rule.

Author: m-akinc

change/@ni-eslint-config-angular-88db44c6-80da-4faa-94ca-0cc9a261fd43.json

@@ -0,0 +1,7 @@
+{
+  "type": "major",
+  "comment": "Update to Angular 20",
+  "packageName": "@ni/eslint-config-angular",
+  "email": "7282195+m-akinc@users.noreply.github.com",
+  "dependentChangeType": "patch"
+}

package-lock.json

@@ -16,6 +16,15 @@ export const angularTypescriptConfig = defineConfig([
                 https://github.com/angular-eslint/angular-eslint/blob/main/packages/eslint-plugin/src/configs/recommended.json
             */
 
+            '@angular-eslint/component-class-suffix': 'error',
+            /*
+                Enabling this would require replacing DI constuctor parameters with fields initialized with `inject()`.
+                The new fields would have to be declared early/first in the class (other initializers may be relying on them),
+                and doing so may violate @typescript-eslint/member-ordering. Additionally, it likely requires effort to
+                update existing unit tests.
+                See: https://github.com/ni/javascript-styleguide/issues/190
+            */
+            '@angular-eslint/prefer-inject': 'off',
             '@angular-eslint/prefer-standalone': 'off',
 
             /*

packages/eslint-config-angular/index.js

@@ -37,7 +37,7 @@
     "!/eslint.config.js"
   ],
   "peerDependencies": {
-    "angular-eslint": "^19.8.1",
+    "angular-eslint": "^20.7.0",
     "@ni/eslint-config-typescript": "^5.0.5",
     "@ni/eslint-config-javascript": "^5.1.4"
   }

packages/eslint-config-angular/package.json

@@ -1,5 +1,5 @@
 {
-  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
+  "$schema": "../../node_modules/@angular/cli/lib/config/schema.json",
   "version": 1,
   "newProjectRoot": "projects",
   "projects": {
@@ -10,7 +10,7 @@
       "prefix": "app",
       "architect": {
         "build": {
-          "builder": "@angular-devkit/build-angular:application",
+          "builder": "@angular/build:application",
           "options": {
             "outputPath": "dist/angular-test",
             "index": "src/index.html",
@@ -34,7 +34,7 @@
           "defaultConfiguration": "production"
         },
         "serve": {
-          "builder": "@angular-devkit/build-angular:dev-server",
+          "builder": "@angular/build:dev-server",
           "configurations": {
             "production": {
               "buildTarget": "angular-test:build:production"
@@ -46,10 +46,10 @@
           "defaultConfiguration": "development"
         },
         "extract-i18n": {
-          "builder": "@angular-devkit/build-angular:extract-i18n"
+          "builder": "@angular/build:extract-i18n"
         },
         "test": {
-          "builder": "@angular-devkit/build-angular:karma",
+          "builder": "@angular/build:karma",
           "options": {
             "browsers": "ChromeHeadlessNoSandbox",
             "polyfills": [
@@ -81,7 +81,7 @@
       "prefix": "angular-lib",
       "architect": {
         "build": {
-          "builder": "@angular-devkit/build-angular:ng-packagr",
+          "builder": "@angular/build:ng-packagr",
           "options": {
             "project": "projects/angular-library/ng-package.json"
           },
@@ -96,7 +96,7 @@
           "defaultConfiguration": "production"
         },
         "test": {
-          "builder": "@angular-devkit/build-angular:karma",
+          "builder": "@angular/build:karma",
           "options": {
             "browsers": "ChromeHeadlessNoSandbox",
             "polyfills": [

tests/angular/angular.json

@@ -11,30 +11,30 @@
   },
   "private": true,
   "dependencies": {
-    "@angular/animations": "^19.2.17",
-    "@angular/common": "^19.2.17",
-    "@angular/compiler": "^19.2.17",
-    "@angular/core": "^19.2.17",
-    "@angular/forms": "^19.2.17",
-    "@angular/platform-browser": "^19.2.17",
-    "@angular/platform-browser-dynamic": "^19.2.17",
+    "@angular/animations": "^20.3.15",
+    "@angular/common": "^20.3.15",
+    "@angular/compiler": "^20.3.15",
+    "@angular/core": "^20.3.15",
+    "@angular/forms": "^20.3.15",
+    "@angular/platform-browser": "^20.3.15",
+    "@angular/platform-browser-dynamic": "^20.3.15",
     "rxjs": "~7.8.0",
     "tslib": "^2.3.0",
     "zone.js": "~0.15.1"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "^19.2.17",
-    "@angular/cli": "^19.2.17",
-    "@angular/compiler-cli": "^19.2.17",
-    "@angular/localize": "^19.2.17",
+    "@angular/build": "^20.3.15",
+    "@angular/cli": "^20.3.15",
+    "@angular/compiler-cli": "^20.3.15",
+    "@angular/localize": "^20.3.15",
     "@types/jasmine": "~5.1.4",
     "jasmine-core": "~5.2.0",
     "karma": "~6.4.0",
     "karma-chrome-launcher": "~3.2.0",
     "karma-coverage": "~2.2.0",
     "karma-jasmine": "~5.1.0",
     "karma-jasmine-html-reporter": "~2.1.0",
-    "ng-packagr": "^19.2.2",
+    "ng-packagr": "^20.3.2",
     "typescript": "~5.8.3"
   },
   "peerDependencies": {

tests/angular/package.json

@@ -3,8 +3,8 @@
   "version": "0.0.0",
   "private": true,
   "peerDependencies": {
-    "@angular/common": "^18.2.0",
-    "@angular/core": "^18.2.0"
+    "@angular/common": "^20.3.15",
+    "@angular/core": "^20.3.15"
   },
   "dependencies": {
     "tslib": "^2.3.0"

tests/angular/projects/angular-library/package.json

@@ -1,7 +1,7 @@
 import { Component, Input } from '@angular/core';
 
 @Component({
-    selector: 'angular-lib',
+    selector: 'angular-lib-component',
     standalone: true,
     /* Angular In-line Template Smoke Test */
     template: '<span i18n [(id)]="name" theme="non-localized-theme-id" title="This title should be localized." i18n-title>Hello {{name}}</span>!'

tests/angular/projects/angular-library/src/lib/angular-library.component.ts

@@ -11,7 +11,7 @@
     "print-evaluated-rules:no-audit": "node index.js --no-audit"
   },
   "peerDependencies": {
-    "angular-eslint": "19.8.1",
+    "angular-eslint": "^20.7.0",
     "@ni/angular-test": "*",
     "@ni/eslint-config-angular": "*",
     "@ni/eslint-config-javascript": "*",