chore: run npm update and adapting code

Author: valeriocomo

package-lock.json

@@ -64,19 +64,20 @@
     }
   ],
   "dependencies": {
-    "@angular-devkit/schematics": "^20.3.13",
-    "@angular/animations": "^20.3.15",
-    "@angular/cdk": "^19.1.5",
-    "@angular/common": "^20.3.15",
-    "@angular/compiler": "^20.3.15",
-    "@angular/core": "^20.3.15",
-    "@angular/forms": "^20.3.15",
-    "@angular/localize": "^20.3.15",
-    "@angular/platform-browser": "^20.3.15",
-    "@angular/platform-browser-dynamic": "^20.3.15",
-    "@angular/router": "^20.3.15",
+    "@angular-devkit/schematics": "^21.0.3",
+    "@angular/animations": "^21.0.4",
+    "@angular/cdk": "^21.0.3",
+    "@angular/common": "^21.0.4",
+    "@angular/compiler": "^21.0.4",
+    "@angular/core": "^21.0.4",
+    "@angular/forms": "^21.0.4",
+    "@angular/localize": "^21.0.4",
+    "@angular/platform-browser": "^21.0.4",
+    "@angular/platform-browser-dynamic": "^21.0.4",
+    "@angular/router": "^21.0.4",
     "@ngx-translate/core": "^16.0.4",
     "@ngx-translate/http-loader": "^16.0.1",
+    "@standard-schema/spec": "^1.0.0",
     "@types/video.js": "^7.3.58",
     "@types/youtube": "^0.1.0",
     "bootstrap-italia": "^2.16.2",
@@ -90,31 +91,31 @@
     "zone.js": "~0.15.0"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "^20.3.13",
-    "@angular-devkit/core": "^20.3.13",
-    "@angular-eslint/builder": "20.7.0",
-    "@angular-eslint/eslint-plugin": "20.7.0",
-    "@angular-eslint/eslint-plugin-template": "20.7.0",
-    "@angular-eslint/schematics": "20.7.0",
-    "@angular-eslint/template-parser": "20.7.0",
-    "@angular/cli": "^20.3.13",
-    "@angular/compiler-cli": "^20.3.15",
-    "@angular/language-service": "^20.3.15",
+    "@angular-devkit/build-angular": "^21.0.3",
+    "@angular-devkit/core": "^21.0.3",
+    "@angular-eslint/builder": "21.1.0",
+    "@angular-eslint/eslint-plugin": "21.1.0",
+    "@angular-eslint/eslint-plugin-template": "21.1.0",
+    "@angular-eslint/schematics": "21.1.0",
+    "@angular-eslint/template-parser": "21.1.0",
+    "@angular/cli": "^21.0.3",
+    "@angular/compiler-cli": "^21.0.4",
+    "@angular/language-service": "^21.0.4",
     "@commitlint/cli": "^19.7.1",
     "@commitlint/config-conventional": "^19.7.1",
     "@compodoc/compodoc": "^1.1.26",
     "@types/bootstrap": "^5.2.10",
     "@types/jasmine": "~5.1.7",
     "@types/jasminewd2": "~2.0.13",
     "@types/node": "^22.13.5",
-    "@typescript-eslint/eslint-plugin": "^7.15.0",
-    "@typescript-eslint/parser": "^7.15.0",
+    "@typescript-eslint/eslint-plugin": "^8.49.0",
+    "@typescript-eslint/parser": "^8.49.0",
     "browserslist-config-design-italia": "^1.1.0",
     "concurrently": "^9.1.2",
     "copyfiles": "^2.4.1",
-    "eslint": "^8.57.0",
-    "eslint-config-prettier": "^9.1.0",
-    "eslint-plugin-prettier": "^5.1.3",
+    "eslint": "^9.39.0",
+    "eslint-config-prettier": "^10.1.8",
+    "eslint-plugin-prettier": "^5.5.4",
     "gh-pages": "^6.3.0",
     "husky": "^9.1.7",
     "is-ci": "^4.1.0",
@@ -128,10 +129,10 @@
     "karma-jasmine": "~5.1.0",
     "karma-jasmine-html-reporter": "^2.1.0",
     "lint-staged": "^15.4.3",
-    "ng-packagr": "^20.0.0",
+    "ng-packagr": "^21.0.0",
     "nunjucks-cli": "^1.0.0",
-    "prettier": "^3.5.2",
-    "prettier-eslint": "^16.3.0",
+    "prettier": "^3.7.4",
+    "prettier-eslint": "^16.4.2",
     "replace-in-file": "^8.3.0",
     "ts-node": "~10.9.2",
     "typescript": "^5.8.3"

package.json

@@ -1,9 +1,9 @@
-import { ControlContainer, ControlValueAccessor, FormControl, FormGroup, NgControl, ValidatorFn } from '@angular/forms';
 import { Component, DoCheck, Input, OnInit, inject } from '@angular/core';
-import { ItAbstractComponent } from './abstract.component';
-import { Observable } from 'rxjs';
+import { ControlContainer, ControlValueAccessor, FormControl, FormGroup, NgControl, ValidatorFn } from '@angular/forms';
 import { TranslateService } from '@ngx-translate/core';
+import { Observable } from 'rxjs';
 import { inputToBoolean } from '../utils/coercion';
+import { ItAbstractComponent } from './abstract.component';
 
 @Component({
   template: '',
@@ -44,6 +44,7 @@ export abstract class ItAbstractFormComponent<T = any> extends ItAbstractCompone
   constructor() {
     super();
     this.control = new FormControl();
+    // eslint-disable-next-line
     this._ngControl && (this._ngControl.valueAccessor = this);
   }
 

projects/design-angular-kit/src/lib/abstracts/abstract-form.component.ts

@@ -1,8 +1,8 @@
 import { ContentChildren, Directive, HostBinding, Input, QueryList, inject } from '@angular/core';
 import { ButtonColor, ButtonSize } from '../../../interfaces/core';
+import { inputToBoolean } from '../../../utils/coercion';
 import { ItIconComponent } from '../../utils/icon/icon.component';
 import { ItProgressButtonComponent } from '../progress-button/progress-button.component';
-import { inputToBoolean } from '../../../utils/coercion';
 
 /**
  * Button
@@ -47,7 +47,7 @@ export class ItButtonDirective {
    * @default button
    */
   @Input()
-  @HostBinding('type')
+  @HostBinding('attr.type')
   type: 'button' | 'reset' | 'submit' = 'button';
 
   /**

projects/design-angular-kit/src/lib/components/core/button/button.directive.ts

@@ -13,11 +13,11 @@ import {
 } from '@angular/core';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import { RouterLink, RouterLinkActive, RouterLinkWithHref } from '@angular/router';
+import { TranslateModule } from '@ngx-translate/core';
 import { delay, filter, map, tap, withLatestFrom } from 'rxjs';
 import { ItNavscrollListItemsComponent } from './navscroll-list-items.component';
 import { NavscrollItem } from './navscroll.model';
 import { NavscrollStore } from './navscroll.store';
-import { TranslateModule } from '@ngx-translate/core';
 
 /**
  * Navscroll
@@ -73,13 +73,13 @@ export class ItNavscrollComponent implements OnInit {
   @Input()
   pageSectionsTemplate?: TemplateRef<any>;
 
-  @HostListener('window:scroll', ['$event']) // for window scroll events
+  @HostListener('window:scroll') // for window scroll events
   onScroll() {
     const sectionContainer = this.#elementRef.nativeElement.querySelector('.it-page-sections-container');
     this.#store.updateProgressBar(sectionContainer);
   }
 
-  @HostListener('window:resize', ['$event'])
+  @HostListener('window:resize')
   onResize() {
     this.#setMobile();
   }

projects/design-angular-kit/src/lib/components/navigation/navscroll/navscroll.component.ts

@@ -190,7 +190,7 @@ export class ItValidators {
         if (control?.value) {
           new RegExp(control.value);
         }
-      } catch (e) {
+      } catch {
         return { invalidRegex: true };
       }
       return null;

projects/design-angular-kit/src/lib/validators/it-validators.ts

@@ -1,6 +1,7 @@
 import { Component } from '@angular/core';
-const { version: appVersion } = require('../../package.json');
 import TableOfContent from '../assets/table-of-content.json';
+// eslint-disable-next-line
+const { version: appVersion } = require('../../package.json');
 
 @Component({
   selector: 'it-root',

src/app/app.component.ts

@@ -1,6 +1,5 @@
-import { ApplicationRef, enableProdMode, isDevMode } from '@angular/core';
-import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
-
+import { ApplicationRef, enableProdMode, isDevMode, provideZoneChangeDetection } from '@angular/core';
+import { platformBrowser } from '@angular/platform-browser';
 import { AppModule } from './app/app.module';
 import { environment } from './environments/environment';
 
@@ -9,7 +8,7 @@ if (environment.production) {
 }
 
 async function bootstrap() {
-  const { injector } = await platformBrowserDynamic().bootstrapModule(AppModule);
+  const { injector } = await platformBrowser().bootstrapModule(AppModule, { applicationProviders: [provideZoneChangeDetection()] });
 
   if (isDevMode()) {
     const { enableDebugTools } = await import('@angular/platform-browser');

src/main.ts

@@ -7,18 +7,14 @@
     "outDir": "./dist/out-tsc",
     "sourceMap": true,
     "declaration": false,
-    "moduleResolution": "node",
+    "moduleResolution": "bundler",
     "resolveJsonModule": true,
     "esModuleInterop": true,
     "experimentalDecorators": true,
     "target": "ES2022",
     "typeRoots": [
       "node_modules/@types"
     ],
-    "lib": [
-      "es2020",
-      "dom"
-    ],
     "useDefineForClassFields": false
   }
 }