diff --git a/.changeset/cyan-seahorses-add.md b/.changeset/cyan-seahorses-add.md new file mode 100644 index 0000000000..8c22b56534 --- /dev/null +++ b/.changeset/cyan-seahorses-add.md @@ -0,0 +1,7 @@ +--- +'@swisspost/design-system-components-angular': major +'@swisspost/design-system-intranet-header': major +'@swisspost/design-system-demo': major +--- + +Upgraded major version of Angular from v15 to v16. diff --git a/packages/components-angular/angular.json b/packages/components-angular/angular.json index f138ec852e..cb703b154d 100644 --- a/packages/components-angular/angular.json +++ b/packages/components-angular/angular.json @@ -155,5 +155,8 @@ "@angular-eslint/schematics:library": { "setParserOptionsProject": true } + }, + "cli": { + "analytics": false } } diff --git a/packages/components-angular/package.json b/packages/components-angular/package.json index fd689eabfc..120f539aec 100644 --- a/packages/components-angular/package.json +++ b/packages/components-angular/package.json @@ -10,16 +10,16 @@ "lint": "ng lint" }, "dependencies": { - "@angular/animations": "15.2.9", - "@angular/common": "15.2.9", - "@angular/compiler": "15.2.9", - "@angular/core": "15.2.9", - "@angular/forms": "15.2.9", - "@angular/localize": "15.2.9", - "@angular/platform-browser": "15.2.9", - "@angular/platform-browser-dynamic": "15.2.9", - "@angular/router": "15.2.9", - "@ng-bootstrap/ng-bootstrap": "14.2.0", + "@angular/animations": "16.2.3", + "@angular/common": "16.2.3", + "@angular/compiler": "16.2.3", + "@angular/core": "16.2.3", + "@angular/forms": "16.2.3", + "@angular/localize": "16.2.3", + "@angular/platform-browser": "16.2.3", + "@angular/platform-browser-dynamic": "16.2.3", + "@angular/router": "16.2.3", + "@ng-bootstrap/ng-bootstrap": "15.1.1", "@popperjs/core": "2.11.8", "@swisspost/design-system-styles": "workspace:6.4.0", "rxjs": "7.8.1", @@ -28,26 +28,26 @@ "zone.js": "0.13.1" }, "devDependencies": { - "@angular-devkit/build-angular": "15.2.9", - "@angular-eslint/builder": "15.2.1", - "@angular-eslint/eslint-plugin": "15.2.1", - "@angular-eslint/eslint-plugin-template": "15.2.1", - "@angular-eslint/schematics": "15.2.1", - "@angular-eslint/template-parser": "15.2.1", - "@angular/cli": "15.2.9", - "@angular/compiler-cli": "15.2.9", + "@angular-devkit/build-angular": "16.2.1", + "@angular-eslint/builder": "16.1.1", + "@angular-eslint/eslint-plugin": "16.1.1", + "@angular-eslint/eslint-plugin-template": "16.1.1", + "@angular-eslint/schematics": "16.1.1", + "@angular-eslint/template-parser": "16.1.1", + "@angular/cli": "16.2.1", + "@angular/compiler-cli": "16.2.3", "@types/jasmine": "4.3.5", "@types/node": "18.17.14", "@typescript-eslint/eslint-plugin": "5.62.0", "@typescript-eslint/parser": "5.62.0", "eslint": "8.48.0", - "jasmine-core": "4.6.0", + "jasmine-core": "5.1.1", "karma": "6.4.2", "karma-chrome-launcher": "3.2.0", "karma-coverage": "2.2.1", "karma-jasmine": "5.1.0", "karma-jasmine-html-reporter": "2.1.0", - "ng-packagr": "15.2.2", + "ng-packagr": "16.2.2", "rimraf": "5.0.1", "typescript": "4.9.5" } diff --git a/packages/demo/package.json b/packages/demo/package.json index 5c27ad0ba5..426af756e6 100644 --- a/packages/demo/package.json +++ b/packages/demo/package.json @@ -12,17 +12,17 @@ "lint": "ng lint" }, "dependencies": { - "@angular/animations": "15.2.9", - "@angular/cdk": "15.2.9", - "@angular/common": "15.2.9", - "@angular/compiler": "15.2.9", - "@angular/core": "15.2.9", - "@angular/forms": "15.2.9", - "@angular/localize": "15.2.9", - "@angular/platform-browser": "15.2.9", - "@angular/platform-browser-dynamic": "15.2.9", - "@angular/router": "15.2.9", - "@ng-bootstrap/ng-bootstrap": "14.2.0", + "@angular/animations": "16.2.3", + "@angular/cdk": "16.2.2", + "@angular/common": "16.2.3", + "@angular/compiler": "16.2.3", + "@angular/core": "16.2.3", + "@angular/forms": "16.2.3", + "@angular/localize": "16.2.3", + "@angular/platform-browser": "16.2.3", + "@angular/platform-browser-dynamic": "16.2.3", + "@angular/router": "16.2.3", + "@ng-bootstrap/ng-bootstrap": "15.1.1", "@popperjs/core": "2.11.8", "@swimlane/ngx-datatable": "20.1.0", "@swisspost/design-system-intranet-header": "workspace:4.0.10", @@ -30,25 +30,25 @@ "bootstrap": "5.3.1", "core-js": "3.32.1", "highlight.js": "11.8.0", - "ngx-highlightjs": "8.0.0", - "ngx-toastr": "16.2.0", + "ngx-highlightjs": "10.0.0", + "ngx-toastr": "17.0.2", "prettier": "2.8.8", "rxjs": "7.8.1", "tslib": "2.6.2", "zone.js": "0.13.1" }, "devDependencies": { - "@angular-devkit/build-angular": "15.2.9", + "@angular-devkit/build-angular": "16.2.1", "@angular-devkit/build-optimizer": "0.1202.18", - "@angular-eslint/builder": "15.2.1", - "@angular-eslint/eslint-plugin": "15.2.1", - "@angular-eslint/eslint-plugin-template": "15.2.1", - "@angular-eslint/schematics": "15.2.1", - "@angular-eslint/template-parser": "15.2.1", - "@angular/cli": "15.2.9", - "@angular/compiler-cli": "15.2.9", - "@angular/elements": "15.2.9", - "@angular/language-service": "15.2.9", + "@angular-eslint/builder": "16.1.1", + "@angular-eslint/eslint-plugin": "16.1.1", + "@angular-eslint/eslint-plugin-template": "16.1.1", + "@angular-eslint/schematics": "16.1.1", + "@angular-eslint/template-parser": "16.1.1", + "@angular/cli": "16.2.1", + "@angular/compiler-cli": "16.2.3", + "@angular/elements": "16.2.3", + "@angular/language-service": "16.2.3", "@types/highlight.js": "9.12.4", "@types/jasmine": "4.3.5", "@types/jasminewd2": "2.0.10", @@ -56,7 +56,7 @@ "@typescript-eslint/eslint-plugin": "5.62.0", "@typescript-eslint/parser": "5.62.0", "eslint": "8.48.0", - "jasmine-core": "4.6.0", + "jasmine-core": "5.1.1", "jasmine-marbles": "0.9.2", "jasmine-spec-reporter": "7.0.0", "karma": "6.4.2", diff --git a/packages/demo/src/app/common/dependency-link/dependency-link.component.ts b/packages/demo/src/app/common/dependency-link/dependency-link.component.ts index 4d88b6b94c..af0ad89ca1 100644 --- a/packages/demo/src/app/common/dependency-link/dependency-link.component.ts +++ b/packages/demo/src/app/common/dependency-link/dependency-link.component.ts @@ -4,8 +4,11 @@ import { Component, Input, OnDestroy } from '@angular/core'; import { ActivatedRoute } from '@angular/router'; -import { Subscription } from 'rxjs'; +import { combineLatest, from, Subscription, switchMap } from 'rxjs'; import { VersionService } from '../version.service'; +import { HttpClient } from '@angular/common/http'; +import { map } from 'rxjs/operators'; +import { Observable } from 'rxjs/internal/Observable'; @Component({ selector: 'app-dependency-link', @@ -19,14 +22,25 @@ export class DependencyLinkComponent implements OnDestroy { documentationBaseUrl: string; urlChangeSubscription: Subscription; - constructor(private route: ActivatedRoute, private versionService: VersionService) { - this.urlChangeSubscription = this.route.url.subscribe(() => { + constructor( + private route: ActivatedRoute, + private versionService: VersionService, + private http: HttpClient, + ) { + this.urlChangeSubscription = combineLatest([ + this.getLatestVersion('@ng-bootstrap/ng-bootstrap'), + this.route.url, + ]).subscribe(([ngBootStrapLatestVersion, _]) => { const { dependencies } = this.versionService.localVersion; + const ngBootStrapLatestMajorVersion = ngBootStrapLatestVersion.split('.')[0]; + if (route.parent.snapshot.url[0].path === 'ng-bootstrap-samples') { this.dependency = 'ng-bootstrap'; this.dependencyVersion = dependencies.get('@ng-bootstrap/ng-bootstrap').format('x'); this.documentationBaseUrl = `https://ng-bootstrap.github.io${ - this.dependencyVersion === '14' ? '' : `/releases/${this.dependencyVersion}.x` + this.dependencyVersion === ngBootStrapLatestMajorVersion + ? '' + : `/releases/${this.dependencyVersion}.x` }/#/`; } else { this.dependency = 'Bootstrap'; @@ -40,6 +54,25 @@ export class DependencyLinkComponent implements OnDestroy { }); } + private getLatestVersion(packageName: string): Observable { + const url = `https://registry.npmjs.org/${packageName}/latest`; + + const cachedResponse = caches + .match(url) + .catch(() => fetch(url)) + .then(response => { + caches.open('npm').then(cache => { + void cache.put(url, response); + }); + return response.clone(); + }); + + return from(cachedResponse).pipe( + switchMap(response => response.json()), + map(packageConfig => packageConfig.version), + ); + } + ngOnDestroy() { this.urlChangeSubscription.unsubscribe(); } diff --git a/packages/demo/src/app/home/home.component.html b/packages/demo/src/app/home/home.component.html index ee6dee30f5..66800c614b 100644 --- a/packages/demo/src/app/home/home.component.html +++ b/packages/demo/src/app/home/home.component.html @@ -51,6 +51,16 @@

Design System

+
@@ -126,7 +136,9 @@

Migration from v5 to v6

    @@ -139,26 +151,28 @@

    Package Update 🩺

    https://update.angular.io/ - to update Angular to version 15 + to update Angular to version 16

  1. Update Bootstrap to version - - 5.2.x + + 5.3.x and ng-bootstrap to version - - 14.x.x + + 15.x.x - : + + :

    2. @@ -209,7 +223,8 @@
    breaking

    - The markup of the stepper component has been changed in order to be more accessible. + The markup of the stepper component has been changed in order to + be more accessible.

    • @@ -278,7 +293,8 @@

      Clean Start 🧹

      Old Package Uninstallation 🗑️

      -

      Uninstall the old styles and the old intranet header packages.

      +

      Uninstall the old styles and the old intranet header packages.

      Package Update 🩺 Update Bootstrap to version - + 5.1.x and ng-bootstrap to version - + 12.x.x @@ -439,11 +456,15 @@
      Paths & Files
      />
@@ -533,10 +554,15 @@
Paths & Files
/>
@@ -551,7 +577,8 @@
Paths & Files
/>
@@ -566,7 +593,8 @@
Paths & Files
/> @@ -590,7 +618,8 @@
Variables
/> @@ -607,7 +636,8 @@
Variables
/> @@ -624,7 +654,8 @@
Variables
/> @@ -642,7 +673,8 @@
Variables
/>