feat(deps): angular 19 upgrade

BREAKING CHANGE: Requires `@angular/core@>=19.0.0`.

Author: bbortt

.editorconfig

@@ -10,7 +10,7 @@ jobs:
       - uses: actions/setup-node@v4
         with:
           cache: 'npm'
-          node-version: '20'
+          node-version: '22'
       - run: npm ci
       - run: npm run prettier:check
   lint:
@@ -21,6 +21,6 @@ jobs:
       - uses: actions/setup-node@v4
         with:
           cache: 'npm'
-          node-version: '20'
+          node-version: '22'
       - run: npm ci
       - run: npm run lint

.eslintrc.json

@@ -11,7 +11,7 @@ jobs:
       - uses: actions/setup-node@v4
         with:
           cache: 'npm'
-          node-version: '20'
+          node-version: '22'
           registry-url: 'https://registry.npmjs.org'
       - run: npm ci
       - run: npm run build:lib

.github/workflows/lint.yaml

@@ -15,7 +15,7 @@ jobs:
       - uses: actions/setup-node@v4
         with:
           cache: 'npm'
-          node-version: '20'
+          node-version: '22'
       - run: npm ci
       - run: npm run build:lib
       - env:

.github/workflows/publish.yaml

@@ -11,7 +11,7 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-        node-version: ['18', '20', '22']
+        node-version: ['18', '20', '22', '23']
     steps:
       - uses: actions/checkout@v4
       - uses: actions/setup-node@v4

.github/workflows/release.yaml

@@ -1 +1 @@
-npx --no-install commitlint --edit .git/COMMIT_EDITMSG
+commitlint --edit .git/COMMIT_EDITMSG

.github/workflows/test.yaml

@@ -1 +1 @@
-npx --no-install lint-staged
+lint-staged

.husky/commit-msg

@@ -1,8 +1,5 @@
 {
-  "{,e2e/**/,projects/**/,src/**/}*.{js,ts,tsx,css}": [
-    "eslint --fix",
-    "prettier --write -u"
-  ],
+  "{,e2e/**/,projects/**/,src/**/}*.{js,ts,tsx,css}": ["prettier --write -u"],
   "{,e2e/**/,projects/**/,src/**/}*.{md,json,html,css,scss}": [
     "prettier --write -u"
   ]

.husky/pre-commit

@@ -58,9 +58,24 @@ imports: [
 <form [formGroup]="group">
   <mat-form-field>
     <mat-placeholder>Start DateTime</mat-placeholder>
-    <mat-datetimepicker-toggle [for]="datetimePicker" matSuffix></mat-datetimepicker-toggle>
-    <mat-datetimepicker #datetimePicker type="datetime" openOnFocus="true" timeInterval="5"> </mat-datetimepicker>
-    <input matInput formControlName="start" [matDatetimepicker]="datetimePicker" required autocomplete="false" />
+    <mat-datetimepicker-toggle
+      [for]="datetimePicker"
+      matSuffix
+    ></mat-datetimepicker-toggle>
+    <mat-datetimepicker
+      #datetimePicker
+      type="datetime"
+      openOnFocus="true"
+      timeInterval="5"
+    >
+    </mat-datetimepicker>
+    <input
+      matInput
+      formControlName="start"
+      [matDatetimepicker]="datetimePicker"
+      required
+      autocomplete="false"
+    />
   </mat-form-field>
 </form>
 ```
@@ -178,10 +193,10 @@ providers: [
 ## Theming
 
 ```scss
-@import '@mat-datetimepicker/core/datetimepicker/datetimepicker-theme.scss';
+@use '@mat-datetimepicker/core/datetimepicker/datetimepicker-theme.scss';
 
 // Using the $theme variable from the pre-built theme you can call the theming function
-@include mat-datetimepicker-theme($theme);
+@include datetimepicker-theme.mat-datetimepicker-theme($theme);
 ```
 
 @see [src/styles.scss](src/styles.scss)

.lintstagedrc.json

@@ -103,7 +103,7 @@
       "root": "projects/core",
       "sourceRoot": "projects/core/src",
       "projectType": "library",
-      "prefix": "lib",
+      "prefix": "mat-datetimepicker",
       "architect": {
         "build": {
           "builder": "@angular-devkit/build-angular:ng-packagr",
@@ -131,7 +131,8 @@
             "lintFilePatterns": [
               "projects/core/**/*.ts",
               "projects/core/**/*.html"
-            ]
+            ],
+            "eslintConfig": "projects/core/eslint.config.js"
           }
         }
       }
@@ -140,7 +141,7 @@
       "root": "projects/moment",
       "sourceRoot": "projects/moment/src",
       "projectType": "library",
-      "prefix": "lib",
+      "prefix": "mat-datetimepicker-moment",
       "architect": {
         "build": {
           "builder": "@angular-devkit/build-angular:ng-packagr",
@@ -168,7 +169,8 @@
             "lintFilePatterns": [
               "projects/moment/**/*.ts",
               "projects/moment/**/*.html"
-            ]
+            ],
+            "eslintConfig": "projects/moment/eslint.config.js"
           }
         }
       }

README.md

@@ -0,0 +1,52 @@
+// @ts-check
+const eslint = require('@eslint/js');
+const tseslint = require('typescript-eslint');
+const angular = require('angular-eslint');
+const simpleImportSort = require('eslint-plugin-simple-import-sort');
+
+module.exports = tseslint.config(
+  {
+    files: ['**/*.ts'],
+    extends: [
+      eslint.configs.recommended,
+      ...tseslint.configs.recommended,
+      ...tseslint.configs.stylistic,
+      ...angular.configs.tsRecommended,
+    ],
+    plugins: {
+      'simple-import-sort': simpleImportSort,
+    },
+    processor: angular.processInlineTemplates,
+    rules: {
+      '@angular-eslint/directive-selector': [
+        'error',
+        {
+          type: 'attribute',
+          prefix: 'app',
+          style: 'camelCase',
+        },
+      ],
+      '@angular-eslint/component-selector': [
+        'error',
+        {
+          type: 'element',
+          prefix: 'app',
+          style: 'kebab-case',
+        },
+      ],
+      '@typescript-eslint/no-explicit-any': ['off'],
+      'simple-import-sort/imports': ['error'],
+      'simple-import-sort/exports': ['error'],
+    },
+  },
+  {
+    files: ['**/*.html'],
+    extends: [
+      ...angular.configs.templateRecommended,
+      ...angular.configs.templateAccessibility,
+    ],
+    rules: {
+      '@angular-eslint/template/interactive-supports-focus': ['warn'],
+    },
+  }
+);