feat: bump angular to v19 (#98)

* feat: bump angular to v19

* feat: bump angular material to v19

package.json

@@ -27,31 +27,31 @@
   },
   "private": true,
   "dependencies": {
-    "@angular/animations": "^18.2.2",
-    "@angular/cdk": "18.2.2",
-    "@angular/common": "^18.2.2",
-    "@angular/compiler": "^18.2.2",
-    "@angular/core": "^18.2.2",
-    "@angular/forms": "^18.2.2",
-    "@angular/material": "18.2.2",
-    "@angular/platform-browser": "^18.2.2",
-    "@angular/platform-browser-dynamic": "^18.2.2",
-    "@angular/router": "^18.2.2",
+    "@angular/animations": "^19.0.3",
+    "@angular/cdk": "19.0.2",
+    "@angular/common": "^19.0.3",
+    "@angular/compiler": "^19.0.3",
+    "@angular/core": "^19.0.3",
+    "@angular/forms": "^19.0.3",
+    "@angular/material": "19.0.2",
+    "@angular/platform-browser": "^19.0.3",
+    "@angular/platform-browser-dynamic": "^19.0.3",
+    "@angular/router": "^19.0.3",
     "highlight.js": "^11.8.0",
     "rxjs": "~7.8.0",
     "tslib": "^2.3.0",
     "webpack-bundle-analyzer": "^4.9.0",
-    "zone.js": "~0.14.10"
+    "zone.js": "~0.15.0"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "^18.2.2",
+    "@angular-devkit/build-angular": "^19.0.4",
     "@angular-eslint/builder": "18.3.0",
     "@angular-eslint/eslint-plugin": "18.3.0",
     "@angular-eslint/eslint-plugin-template": "18.3.0",
     "@angular-eslint/schematics": "18.3.0",
     "@angular-eslint/template-parser": "18.3.0",
-    "@angular/cli": "^18.2.2",
-    "@angular/compiler-cli": "^18.2.2",
+    "@angular/cli": "^19.0.4",
+    "@angular/compiler-cli": "^19.0.3",
     "@commitlint/cli": "^19.0.0",
     "@commitlint/config-conventional": "^19.0.0",
     "@types/jasmine": "~4.6.0",
@@ -70,8 +70,8 @@
     "karma-jasmine": "~5.1.0",
     "karma-jasmine-html-reporter": "~2.1.0",
     "lint-staged": "^15.0.0",
-    "ng-packagr": "^18.0.0",
-    "typescript": "~5.4.5"
+    "ng-packagr": "^19.0.1",
+    "typescript": "~5.6.3"
   },
   "resolutions": {
     "wrap-ansi": "7.0.0",

packages/dev-app/src/app/app.component.ts

@@ -3,14 +3,13 @@ import { RouterOutlet } from '@angular/router';
 import { SharedModule } from './shared/shared.module';
 
 @Component({
-  selector: 'app-root',
-  templateUrl: './app.component.html',
-  styleUrls: ['./app.component.scss'],
-  imports: [
-    RouterOutlet,
-    SharedModule,
-  ],
-  standalone: true,
+    selector: 'app-root',
+    templateUrl: './app.component.html',
+    styleUrls: ['./app.component.scss'],
+    imports: [
+        RouterOutlet,
+        SharedModule,
+    ]
 })
 export class AppComponent {
 

packages/dev-app/src/app/routes/guide/guide.component.ts

@@ -3,14 +3,13 @@ import { Component } from '@angular/core';
 import { SharedModule } from '../../shared/shared.module';
 
 @Component({
-  selector: 'app-guide',
-  templateUrl: './guide.component.html',
-  styleUrls: ['./guide.component.scss'],
-  imports: [
-    CommonModule,
-    SharedModule,
-  ],
-  standalone: true,
+    selector: 'app-guide',
+    templateUrl: './guide.component.html',
+    styleUrls: ['./guide.component.scss'],
+    imports: [
+        CommonModule,
+        SharedModule,
+    ]
 })
 export class GuideComponent {
 

packages/dev-app/src/app/routes/home/home.component.ts

@@ -6,15 +6,14 @@ import { NgxConfettiDirective } from 'ngx-dom-confetti/confetti-directive';
 import { SharedModule } from '../../shared/shared.module';
 
 @Component({
-  selector: 'app-home',
-  templateUrl: './home.component.html',
-  styleUrls: ['./home.component.scss'],
-  imports: [
-    CommonModule,
-    NgxDomConfettiModule,
-    SharedModule,
-  ],
-  standalone: true,
+    selector: 'app-home',
+    templateUrl: './home.component.html',
+    styleUrls: ['./home.component.scss'],
+    imports: [
+        CommonModule,
+        NgxDomConfettiModule,
+        SharedModule,
+    ]
 })
 export class HomeComponent {
 

packages/dev-app/src/app/shared/directives/highlight-code.directive.ts

@@ -2,7 +2,8 @@ import { AfterViewInit, Directive, ElementRef, SecurityContext } from '@angular/
 import { DomSanitizer } from '@angular/platform-browser';
 
 @Directive({
-  selector: 'code[highlight]',
+    selector: 'code[highlight]',
+    standalone: false
 })
 export class HighlightCodeDirective implements AfterViewInit {
 

packages/dev-app/src/app/shared/nav-bar/nav-bar.component.ts

@@ -1,9 +1,10 @@
 import { Component } from '@angular/core';
 
 @Component({
-  selector: 'app-nav-bar',
-  templateUrl: './nav-bar.component.html',
-  styleUrls: ['./nav-bar.component.scss']
+    selector: 'app-nav-bar',
+    templateUrl: './nav-bar.component.html',
+    styleUrls: ['./nav-bar.component.scss'],
+    standalone: false
 })
 export class NavBarComponent {
 

packages/dev-app/src/app/shared/shell/shell.component.ts

@@ -3,9 +3,10 @@ import { Component, ElementRef, ViewChild, inject } from '@angular/core';
 import { MatSnackBar } from '@angular/material/snack-bar';
 
 @Component({
-  selector: 'app-shell',
-  templateUrl: './shell.component.html',
-  styleUrls: ['./shell.component.scss']
+    selector: 'app-shell',
+    templateUrl: './shell.component.html',
+    styleUrls: ['./shell.component.scss'],
+    standalone: false
 })
 export class ShellComponent {
 

packages/dev-app/src/styles.scss

@@ -10,7 +10,8 @@
 //  you can delete this line and instead use:
 //    `@include mat.legacy-typography-hierarchy(mat.define-typography-config());`
 @include mat.all-component-typographies();
-@include mat.core();
+@include mat.elevation-classes();
+@include mat.app-background();
 
 $primary: mat.m2-define-palette(mat.$m2-indigo-palette);
 $accent: mat.m2-define-palette(mat.$m2-pink-palette, A200, A100, A400);

packages/ngx-dom-confetti/src/lib/confetti-component.ts

@@ -6,9 +6,10 @@ import { ConfettiRenderer } from './confetti-renderer';
 import { ConfettiConfig, NGX_CONFETTI_GLOBAL_CONFIG } from './config';
 
 @Component({
-  selector: 'ngx-dom-confetti',
-  template: ` <ng-content></ng-content> `,
-  styles: [],
+    selector: 'ngx-dom-confetti',
+    template: ` <ng-content></ng-content> `,
+    styles: [],
+    standalone: false
 })
 export class NgxDomConfettiComponent {
 

packages/ngx-dom-confetti/src/lib/confetti-directive.ts

@@ -14,8 +14,9 @@ import { ConfettiRenderer } from './confetti-renderer';
 import { ConfettiConfig, defaultsConfettiConfig, NGX_CONFETTI_GLOBAL_CONFIG } from './config';
 
 @Directive({
-  selector: '[confetti], [ngxConfetti]',
-  exportAs: 'ngxConfetti',
+    selector: '[confetti], [ngxConfetti]',
+    exportAs: 'ngxConfetti',
+    standalone: false
 })
 export class NgxConfettiDirective {