feat: add support for Angular 18 (#2419)

* feat: add support for Angular 18 BREAKING CHANGE: Added support for Angular 18 and removed support for Angular 17
blackbaud · Jul 3, 2024 · 7a53bb5 · 7a53bb5
1 parent a7565c7
commit 7a53bb5
Show file tree

Hide file tree

Showing 73 changed files with 9,571 additions and 7,895 deletions.
diff --git a/apps/integration/src/app/app.module.ts b/apps/integration/src/app/app.module.ts
@@ -1,4 +1,7 @@
-import { HttpClientModule } from '@angular/common/http';
+import {
+  provideHttpClient,
+  withInterceptorsFromDi,
+} from '@angular/common/http';
 import { NgModule } from '@angular/core';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { BrowserModule } from '@angular/platform-browser';
@@ -14,12 +17,12 @@ import { SkyThemeSelectorModule } from './shared/theme-selector/theme-selector.m
 
 @NgModule({
   declarations: [AppComponent],
+  bootstrap: [AppComponent],
   imports: [
     AppRoutingModule,
     BrowserAnimationsModule,
     BrowserModule,
     FormsModule,
-    HttpClientModule,
     ReactiveFormsModule,
     SkyFluidGridModule,
     SkyI18nModule,
@@ -33,7 +36,7 @@ import { SkyThemeSelectorModule } from './shared/theme-selector/theme-selector.m
         getUrl: (path: string): string => `/assets/${path}`,
       },
     },
+    provideHttpClient(withInterceptorsFromDi()),
   ],
-  bootstrap: [AppComponent],
 })
 export class AppModule {}
diff --git a/...on/src/app/integrations/modal-viewkept-toolbars/modal-viewkept-toolbars.component.spec.ts b/...on/src/app/integrations/modal-viewkept-toolbars/modal-viewkept-toolbars.component.spec.ts
@@ -1,4 +1,8 @@
-import { HttpClientTestingModule } from '@angular/common/http/testing';
+import {
+  provideHttpClient,
+  withInterceptorsFromDi,
+} from '@angular/common/http';
+import { provideHttpClientTesting } from '@angular/common/http/testing';
 import { RendererFactory2 } from '@angular/core';
 import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { NoopAnimationsModule } from '@angular/platform-browser/animations';
@@ -66,9 +70,12 @@ describe('Modals with viewkept toolbars', () => {
         NoopAnimationsModule,
         RouterTestingModule,
         ModalViewkeptToolbarsModule,
-        HttpClientTestingModule,
       ],
-      providers: [SkyThemeService],
+      providers: [
+        SkyThemeService,
+        provideHttpClient(withInterceptorsFromDi()),
+        provideHttpClientTesting(),
+      ],
     });
 
     fixture = TestBed.createComponent(ModalViewkeptToolbarsComponent);

diff --git a/apps/playground/src/app/components/indicators/illustration/illustration.module.ts b/apps/playground/src/app/components/indicators/illustration/illustration.module.ts
@@ -1,5 +1,8 @@
 import { CommonModule } from '@angular/common';
-import { HttpClientModule } from '@angular/common/http';
+import {
+  provideHttpClient,
+  withInterceptorsFromDi,
+} from '@angular/common/http';
 import { NgModule } from '@angular/core';
 import { SkyIllustrationResolverService } from '@skyux/indicators';
 
@@ -8,17 +11,13 @@ import { IllustrationRoutingModule } from './illustration-routing.module';
 import { IllustrationComponent } from './illustration.component';
 
 @NgModule({
-  imports: [
-    CommonModule,
-    HttpClientModule,
-    IllustrationComponent,
-    IllustrationRoutingModule,
-  ],
+  imports: [CommonModule, IllustrationComponent, IllustrationRoutingModule],
   providers: [
     {
       provide: SkyIllustrationResolverService,
       useClass: IllustrationResolverService,
     },
+    provideHttpClient(withInterceptorsFromDi()),
   ],
 })
 export class IllustrationModule {

diff --git a/libs/components/a11y/package.json b/libs/components/a11y/package.json
@@ -16,12 +16,12 @@
   },
   "homepage": "https://github.com/blackbaud/skyux#readme",
   "peerDependencies": {
-    "@angular/common": "^17.3.4",
-    "@angular/core": "^17.3.4",
+    "@angular/common": "^18.0.5",
+    "@angular/core": "^18.0.5",
     "@skyux/core": "0.0.0-PLACEHOLDER",
     "@skyux/i18n": "0.0.0-PLACEHOLDER"
   },
   "dependencies": {
-    "tslib": "^2.6.2"
+    "tslib": "^2.6.3"
   }
 }
diff --git a/libs/components/action-bars/package.json b/libs/components/action-bars/package.json
@@ -16,10 +16,10 @@
   },
   "homepage": "https://github.com/blackbaud/skyux#readme",
   "peerDependencies": {
-    "@angular/animations": "^17.3.4",
-    "@angular/common": "^17.3.4",
-    "@angular/core": "^17.3.4",
-    "@angular/platform-browser": "^17.3.4",
+    "@angular/animations": "^18.0.5",
+    "@angular/common": "^18.0.5",
+    "@angular/core": "^18.0.5",
+    "@angular/platform-browser": "^18.0.5",
     "@skyux-sdk/testing": "0.0.0-PLACEHOLDER",
     "@skyux/animations": "0.0.0-PLACEHOLDER",
     "@skyux/core": "0.0.0-PLACEHOLDER",
@@ -30,6 +30,6 @@
   },
   "dependencies": {
     "@skyux/icon": "0.0.0-PLACEHOLDER",
-    "tslib": "^2.6.2"
+    "tslib": "^2.6.3"
   }
 }
diff --git a/libs/components/ag-grid/package.json b/libs/components/ag-grid/package.json
@@ -21,9 +21,9 @@
     }
   },
   "peerDependencies": {
-    "@angular/common": "^17.3.4",
-    "@angular/core": "^17.3.4",
-    "@angular/forms": "^17.3.4",
+    "@angular/common": "^18.0.5",
+    "@angular/core": "^18.0.5",
+    "@angular/forms": "^18.0.5",
     "@skyux/autonumeric": "0.0.0-PLACEHOLDER",
     "@skyux/core": "0.0.0-PLACEHOLDER",
     "@skyux/data-manager": "0.0.0-PLACEHOLDER",
@@ -40,6 +40,6 @@
   },
   "dependencies": {
     "@skyux/icon": "0.0.0-PLACEHOLDER",
-    "tslib": "^2.6.2"
+    "tslib": "^2.6.3"
   }
 }
diff --git a/libs/components/angular-tree-component/package.json b/libs/components/angular-tree-component/package.json
@@ -16,8 +16,8 @@
   },
   "homepage": "https://github.com/blackbaud/skyux#readme",
   "peerDependencies": {
-    "@angular/common": "^17.3.4",
-    "@angular/core": "^17.3.4",
+    "@angular/common": "^18.0.5",
+    "@angular/core": "^18.0.5",
     "@blackbaud/angular-tree-component": "^1.0.0",
     "@skyux/core": "0.0.0-PLACEHOLDER",
     "@skyux/forms": "0.0.0-PLACEHOLDER",
@@ -27,6 +27,6 @@
   },
   "dependencies": {
     "@skyux/icon": "0.0.0-PLACEHOLDER",
-    "tslib": "^2.6.2"
+    "tslib": "^2.6.3"
   }
 }
diff --git a/libs/components/animations/package.json b/libs/components/animations/package.json
@@ -16,11 +16,11 @@
   },
   "homepage": "https://github.com/blackbaud/skyux#readme",
   "peerDependencies": {
-    "@angular/animations": "^17.3.4",
-    "@angular/common": "^17.3.4",
-    "@angular/core": "^17.3.4"
+    "@angular/animations": "^18.0.5",
+    "@angular/common": "^18.0.5",
+    "@angular/core": "^18.0.5"
   },
   "dependencies": {
-    "tslib": "^2.6.2"
+    "tslib": "^2.6.3"
   }
 }
diff --git a/libs/components/assets/package.json b/libs/components/assets/package.json
@@ -16,10 +16,10 @@
   },
   "homepage": "https://github.com/blackbaud/skyux#readme",
   "peerDependencies": {
-    "@angular/common": "^17.3.4",
-    "@angular/core": "^17.3.4"
+    "@angular/common": "^18.0.5",
+    "@angular/core": "^18.0.5"
   },
   "dependencies": {
-    "tslib": "^2.6.2"
+    "tslib": "^2.6.3"
   }
 }
diff --git a/libs/components/autonumeric/package.json b/libs/components/autonumeric/package.json
@@ -16,12 +16,12 @@
   },
   "homepage": "https://github.com/blackbaud/skyux#readme",
   "peerDependencies": {
-    "@angular/common": "^17.3.4",
-    "@angular/core": "^17.3.4",
-    "@angular/forms": "^17.3.4",
+    "@angular/common": "^18.0.5",
+    "@angular/core": "^18.0.5",
+    "@angular/forms": "^18.0.5",
     "autonumeric": "^4.10.5"
   },
   "dependencies": {
-    "tslib": "^2.6.2"
+    "tslib": "^2.6.3"
   }
 }
diff --git a/libs/components/avatar/package.json b/libs/components/avatar/package.json
@@ -16,9 +16,9 @@
   },
   "homepage": "https://github.com/blackbaud/skyux#readme",
   "peerDependencies": {
-    "@angular/common": "^17.3.4",
-    "@angular/core": "^17.3.4",
-    "@angular/platform-browser": "^17.3.4",
+    "@angular/common": "^18.0.5",
+    "@angular/core": "^18.0.5",
+    "@angular/platform-browser": "^18.0.5",
     "@skyux-sdk/testing": "0.0.0-PLACEHOLDER",
     "@skyux/core": "0.0.0-PLACEHOLDER",
     "@skyux/errors": "0.0.0-PLACEHOLDER",
@@ -27,6 +27,6 @@
     "@skyux/theme": "0.0.0-PLACEHOLDER"
   },
   "dependencies": {
-    "tslib": "^2.6.2"
+    "tslib": "^2.6.3"
   }
 }
diff --git a/libs/components/colorpicker/package.json b/libs/components/colorpicker/package.json
@@ -16,11 +16,11 @@
   },
   "homepage": "https://github.com/blackbaud/skyux#readme",
   "peerDependencies": {
-    "@angular/cdk": "^17.3.4",
-    "@angular/common": "^17.3.4",
-    "@angular/core": "^17.3.4",
-    "@angular/forms": "^17.3.4",
-    "@angular/platform-browser": "^17.3.4",
+    "@angular/cdk": "^18.0.5",
+    "@angular/common": "^18.0.5",
+    "@angular/core": "^18.0.5",
+    "@angular/forms": "^18.0.5",
+    "@angular/platform-browser": "^18.0.5",
     "@skyux-sdk/testing": "0.0.0-PLACEHOLDER",
     "@skyux/core": "0.0.0-PLACEHOLDER",
     "@skyux/forms": "0.0.0-PLACEHOLDER",
@@ -31,6 +31,6 @@
   },
   "dependencies": {
     "@skyux/icon": "0.0.0-PLACEHOLDER",
-    "tslib": "^2.6.2"
+    "tslib": "^2.6.3"
   }
 }
diff --git a/libs/components/config/package.json b/libs/components/config/package.json
@@ -16,10 +16,10 @@
   },
   "homepage": "https://github.com/blackbaud/skyux#readme",
   "peerDependencies": {
-    "@angular/common": "^17.3.4",
-    "@angular/core": "^17.3.4"
+    "@angular/common": "^18.0.5",
+    "@angular/core": "^18.0.5"
   },
   "dependencies": {
-    "tslib": "^2.6.2"
+    "tslib": "^2.6.3"
   }
 }
diff --git a/libs/components/core/package.json b/libs/components/core/package.json
@@ -16,15 +16,15 @@
   },
   "homepage": "https://github.com/blackbaud/skyux#readme",
   "peerDependencies": {
-    "@angular/cdk": "^17.3.4",
-    "@angular/common": "^17.3.4",
-    "@angular/core": "^17.3.4",
-    "@angular/forms": "^17.3.4",
-    "@angular/platform-browser": "^17.3.4",
-    "@angular/router": "^17.3.4",
+    "@angular/cdk": "^18.0.5",
+    "@angular/common": "^18.0.5",
+    "@angular/core": "^18.0.5",
+    "@angular/forms": "^18.0.5",
+    "@angular/platform-browser": "^18.0.5",
+    "@angular/router": "^18.0.5",
     "@skyux/i18n": "0.0.0-PLACEHOLDER"
   },
   "dependencies": {
-    "tslib": "^2.6.2"
+    "tslib": "^2.6.3"
   }
 }
diff --git a/libs/components/data-manager/package.json b/libs/components/data-manager/package.json
@@ -16,9 +16,9 @@
   },
   "homepage": "https://github.com/blackbaud/skyux#readme",
   "peerDependencies": {
-    "@angular/common": "^17.3.4",
-    "@angular/core": "^17.3.4",
-    "@angular/forms": "^17.3.4",
+    "@angular/common": "^18.0.5",
+    "@angular/core": "^18.0.5",
+    "@angular/forms": "^18.0.5",
     "@skyux/core": "0.0.0-PLACEHOLDER",
     "@skyux/forms": "0.0.0-PLACEHOLDER",
     "@skyux/i18n": "0.0.0-PLACEHOLDER",
@@ -30,6 +30,6 @@
     "@skyux/modals": "0.0.0-PLACEHOLDER"
   },
   "dependencies": {
-    "tslib": "^2.6.2"
+    "tslib": "^2.6.3"
   }
 }
diff --git a/libs/components/datetime/package.json b/libs/components/datetime/package.json
@@ -16,11 +16,11 @@
   },
   "homepage": "https://github.com/blackbaud/skyux#readme",
   "peerDependencies": {
-    "@angular/cdk": "^17.3.4",
-    "@angular/common": "^17.3.4",
-    "@angular/core": "^17.3.4",
-    "@angular/forms": "^17.3.4",
-    "@angular/platform-browser": "^17.3.4",
+    "@angular/cdk": "^18.0.5",
+    "@angular/common": "^18.0.5",
+    "@angular/core": "^18.0.5",
+    "@angular/forms": "^18.0.5",
+    "@angular/platform-browser": "^18.0.5",
     "@skyux-sdk/testing": "0.0.0-PLACEHOLDER",
     "@skyux/core": "0.0.0-PLACEHOLDER",
     "@skyux/forms": "0.0.0-PLACEHOLDER",
@@ -32,6 +32,6 @@
   },
   "dependencies": {
     "@skyux/icon": "0.0.0-PLACEHOLDER",
-    "tslib": "^2.6.2"
+    "tslib": "^2.6.3"
   }
 }
diff --git a/libs/components/errors/package.json b/libs/components/errors/package.json
@@ -16,15 +16,15 @@
   },
   "homepage": "https://github.com/blackbaud/skyux#readme",
   "peerDependencies": {
-    "@angular/common": "^17.3.4",
-    "@angular/core": "^17.3.4",
-    "@angular/platform-browser": "^17.3.4",
+    "@angular/common": "^18.0.5",
+    "@angular/core": "^18.0.5",
+    "@angular/platform-browser": "^18.0.5",
     "@skyux-sdk/testing": "0.0.0-PLACEHOLDER",
     "@skyux/core": "0.0.0-PLACEHOLDER",
     "@skyux/i18n": "0.0.0-PLACEHOLDER",
     "@skyux/modals": "0.0.0-PLACEHOLDER"
   },
   "dependencies": {
-    "tslib": "^2.6.2"
+    "tslib": "^2.6.3"
   }
 }
diff --git a/libs/components/flyout/package.json b/libs/components/flyout/package.json
@@ -16,18 +16,18 @@
   },
   "homepage": "https://github.com/blackbaud/skyux#readme",
   "peerDependencies": {
-    "@angular/animations": "^17.3.4",
-    "@angular/cdk": "^17.3.4",
-    "@angular/common": "^17.3.4",
-    "@angular/core": "^17.3.4",
-    "@angular/router": "^17.3.4",
+    "@angular/animations": "^18.0.5",
+    "@angular/cdk": "^18.0.5",
+    "@angular/common": "^18.0.5",
+    "@angular/core": "^18.0.5",
+    "@angular/router": "^18.0.5",
     "@skyux/core": "0.0.0-PLACEHOLDER",
     "@skyux/i18n": "0.0.0-PLACEHOLDER",
     "@skyux/router": "0.0.0-PLACEHOLDER",
     "@skyux/theme": "0.0.0-PLACEHOLDER"
   },
   "dependencies": {
     "@skyux/icon": "0.0.0-PLACEHOLDER",
-    "tslib": "^2.6.2"
+    "tslib": "^2.6.3"
   }
 }