chore(portal-next): bump dependencies for angular v18

gravitee-io · Jan 21, 2025 · 2c9537d · 2c9537d
1 parent 6af24b5
commit 2c9537d
Show file tree

Hide file tree

Showing 7 changed files with 4,380 additions and 6,225 deletions.
diff --git a/gravitee-apim-portal-webui-next/angular.json b/gravitee-apim-portal-webui-next/angular.json
@@ -19,7 +19,7 @@
       "prefix": "app",
       "architect": {
         "build": {
-          "builder": "@angular-devkit/build-angular:application",
+          "builder": "@angular/build:application",
           "options": {
             "outputPath": "../gravitee-apim-portal-webui/dist/next",
             "index": "src/index.html",
@@ -86,7 +86,7 @@
           "defaultConfiguration": "production"
         },
         "serve": {
-          "builder": "@angular-devkit/build-angular:dev-server",
+          "builder": "@angular/build:dev-server",
           "options": {
             "port": 4101,
             "proxyConfig": "src/proxy.conf.mjs",
@@ -103,7 +103,7 @@
           "defaultConfiguration": "development"
         },
         "extract-i18n": {
-          "builder": "@angular-devkit/build-angular:extract-i18n",
+          "builder": "@angular/build:extract-i18n",
           "options": {
             "buildTarget": "gravitee-apim-portal-webui-next:build"
           }

diff --git a/gravitee-apim-portal-webui-next/package.json b/gravitee-apim-portal-webui-next/package.json
@@ -30,18 +30,18 @@
   },
   "private": true,
   "dependencies": {
-    "@angular/animations": "17.3.6",
-    "@angular/cdk": "17.3.6",
-    "@angular/common": "17.3.6",
-    "@angular/compiler": "17.3.6",
-    "@angular/core": "17.3.6",
-    "@angular/forms": "17.3.6",
-    "@angular/localize": "17.3.6",
-    "@angular/material": "17.3.6",
-    "@angular/material-experimental": "17.3.6",
-    "@angular/platform-browser": "17.3.6",
-    "@angular/platform-browser-dynamic": "17.3.6",
-    "@angular/router": "17.3.6",
+    "@angular/animations": "18.2.13",
+    "@angular/cdk": "18.2.14",
+    "@angular/common": "18.2.13",
+    "@angular/compiler": "18.2.13",
+    "@angular/core": "18.2.13",
+    "@angular/forms": "18.2.13",
+    "@angular/localize": "18.2.13",
+    "@angular/material": "18.2.14",
+    "@angular/material-experimental": "18.2.14",
+    "@angular/platform-browser": "18.2.13",
+    "@angular/platform-browser-dynamic": "18.2.13",
+    "@angular/router": "18.2.13",
     "@asciidoctor/core": "3.0.4",
     "@asyncapi/web-component": "1.4.9",
     "@emoji-mart/data": "1.2.1",
@@ -50,38 +50,41 @@
     "highlight.js": "11.9.0",
     "jdenticon": "3.2.0",
     "js-yaml": "4.1.0",
+    "lodash": "4.17.21",
     "marked": "12.0.2",
     "marked-alert": "2.1.2",
     "marked-emoji": "1.4.3",
     "marked-extended-tables": "1.1.0",
     "marked-gfm-heading-id": "3.1.3",
     "marked-highlight": "2.1.1",
-    "ngx-infinite-scroll": "17.0.0",
+    "ngx-infinite-scroll": "18.0.0",
     "rxjs": "7.8.0",
     "swagger-ui": "5.17.9",
     "tslib": "2.3.0",
     "xng-breadcrumb": "11.0.0",
-    "zone.js": "0.14.3"
+    "zone.js": "0.14.10"
   },
   "devDependencies": {
-    "@angular-builders/jest": "17.0.2",
-    "@angular-devkit/build-angular": "17.3.3",
-    "@angular-eslint/builder": "17.3.0",
-    "@angular-eslint/eslint-plugin": "17.3.0",
-    "@angular-eslint/eslint-plugin-template": "17.3.0",
-    "@angular-eslint/schematics": "17.3.0",
-    "@angular-eslint/template-parser": "17.3.0",
-    "@angular/cli": "17.3.3",
-    "@angular/compiler-cli": "17.3.3",
+    "@angular-builders/jest": "18.0.0",
+    "@angular-devkit/build-angular": "18.2.12",
+    "@angular-eslint/builder": "18.4.3",
+    "@angular-eslint/eslint-plugin": "18.4.3",
+    "@angular-eslint/eslint-plugin-template": "18.4.3",
+    "@angular-eslint/schematics": "18.4.3",
+    "@angular-eslint/template-parser": "18.4.3",
+    "@angular/build": "18.2.12",
+    "@angular/cli": "18.2.12",
+    "@angular/compiler-cli": "18.2.13",
     "@chromatic-com/storybook": "1.2.26",
-    "@storybook/addon-essentials": "8.0.5",
-    "@storybook/addon-interactions": "8.0.5",
-    "@storybook/addon-links": "8.0.5",
-    "@storybook/angular": "8.0.5",
-    "@storybook/blocks": "8.0.5",
-    "@storybook/test": "8.0.5",
-    "@types/jest": "29.5.12",
+    "@storybook/addon-essentials": "8.5.0",
+    "@storybook/addon-interactions": "8.5.0",
+    "@storybook/addon-links": "8.5.0",
+    "@storybook/angular": "8.5.0",
+    "@storybook/blocks": "8.5.0",
+    "@storybook/test": "8.5.0",
+    "@types/jest": "29.5.14",
     "@types/js-yaml": "4.0.9",
+    "@types/lodash": "4",
     "@typescript-eslint/eslint-plugin": "7.2.0",
     "@typescript-eslint/parser": "7.2.0",
     "eslint": "8.57.0",
@@ -92,17 +95,17 @@
     "eslint-plugin-storybook": "0.8.0",
     "jest": "29.7.0",
     "jest-junit": "16.0.0",
-    "jest-preset-angular": "14.0.3",
+    "jest-preset-angular": "14.5.0",
     "license-check-and-add": "4.0.5",
     "prettier": "3.2.5",
     "prettier-eslint": "16.3.0",
-    "storybook": "8.0.5",
+    "storybook": "8.5.0",
     "stylelint": "16.2.1",
     "stylelint-config-idiomatic-order": "10.0.0",
     "stylelint-config-prettier-scss": "1.0.0",
     "stylelint-config-standard-scss": "13.0.0",
     "stylelint-order": "6.0.4",
-    "typescript": "5.3.3"
+    "typescript": "5.5.4"
   },
   "packageManager": "[email protected]"
 }
diff --git a/gravitee-apim-portal-webui-next/src/scss/theme/m3-theme.scss b/gravitee-apim-portal-webui-next/src/scss/theme/m3-theme.scss
@@ -1,3 +1,5 @@
+@use '@angular/material' as mat;
+
 /*
  * Copyright (C) 2024 The Gravitee team (http://gravitee.io)
  *
@@ -120,7 +122,7 @@ NOTE: This file is to be deleted once material 3 has an easier way to create pal
 
 @function generate-m3-light-theme() {
   $config: -config();
-  @return matx.define-theme(
+  @return mat.define-theme(
     (
       color: (
         theme-type: light,
@@ -136,7 +138,7 @@ NOTE: This file is to be deleted once material 3 has an easier way to create pal
 
 @function generate-m3-dark-theme() {
   $config: -config();
-  @return matx.define-theme(
+  @return mat.define-theme(
     (
       color: (
         theme-type: dark,

diff --git a/gravitee-apim-portal-webui-next/src/stories/theme/theme.stories.ts b/gravitee-apim-portal-webui-next/src/stories/theme/theme.stories.ts
@@ -21,7 +21,7 @@ import { Args, Meta, moduleMetadata, StoryObj } from '@storybook/angular';
 import { of } from 'rxjs/internal/observable/of';
 import { BreadcrumbService } from 'xng-breadcrumb';
 
-import { computeAndInjectThemeForStory, CUSTOMIZATION_ARGS } from './theme.util';
+import { computeAndInjectThemeForStory } from './theme.util';
 import { ApiDetailsComponent } from '../../app/api/api-details/api-details.component';
 import { ApiCardComponent } from '../../components/api-card/api-card.component';
 import { BannerComponent } from '../../components/banner/banner.component';
@@ -67,7 +67,29 @@ export default {
 } as Meta;
 
 export const Default: StoryObj = {
-  argTypes: CUSTOMIZATION_ARGS,
+  argTypes: {
+    primary: {
+      control: { type: 'color' },
+    },
+    secondary: {
+      control: { type: 'color' },
+    },
+    tertiary: {
+      control: { type: 'color' },
+    },
+    error: {
+      control: { type: 'color' },
+    },
+    background: {
+      control: { type: 'color' },
+    },
+    bannerBackground: {
+      control: { type: 'color' },
+    },
+    bannerText: {
+      control: { type: 'color' },
+    },
+  },
   render: (args: Args) => {
     computeAndInjectThemeForStory(args);
     return {

diff --git a/gravitee-apim-portal-webui-next/src/stories/theme/theme.util.ts b/gravitee-apim-portal-webui-next/src/stories/theme/theme.util.ts
@@ -17,30 +17,6 @@ import { Args } from '@storybook/angular';
 
 import { addPropertyToDocument, addHslToDocument } from '../../services/theme.service';
 
-const CUSTOMIZATION_ARGS = {
-  primary: {
-    control: 'color',
-  },
-  secondary: {
-    control: 'color',
-  },
-  tertiary: {
-    control: 'color',
-  },
-  error: {
-    control: 'color',
-  },
-  background: {
-    control: 'color',
-  },
-  bannerBackground: {
-    control: 'color',
-  },
-  bannerText: {
-    control: 'color',
-  },
-};
-
 export interface CustomizationConfig {
   primary?: string;
   secondary?: string;
@@ -75,10 +51,10 @@ const computeAndInjectThemeForStory = (args: Args): void => {
 };
 
 const computePalette = (config: CustomizationConfig) => {
-  addHslToDocument(CSS_VAR.primary, '#613CB0', config.primary);
-  addHslToDocument(CSS_VAR.secondary, '#958BA9', config.secondary);
-  addHslToDocument(CSS_VAR.tertiary, '#B7818F', config.tertiary);
-  addHslToDocument(CSS_VAR.error, '#EC6152', config.error);
+  addHslToDocument(CSS_VAR.primary, config.primary ?? '#613CB0');
+  addHslToDocument(CSS_VAR.secondary, config.secondary ?? '#958BA9');
+  addHslToDocument(CSS_VAR.tertiary, config.tertiary ?? '#B7818F');
+  addHslToDocument(CSS_VAR.error, config.error ?? '#EC6152');
 };
 
 const computeStyles = (theme: CustomizationConfig): void => {
@@ -94,4 +70,4 @@ const resetTheme = (): void => {
   computePalette({});
 };
 
-export { computeAndInjectThemeForStory, resetTheme, CUSTOMIZATION_ARGS };
+export { computeAndInjectThemeForStory, resetTheme };
diff --git a/gravitee-apim-portal-webui-next/src/styles.scss b/gravitee-apim-portal-webui-next/src/styles.scss
@@ -24,7 +24,7 @@
 @use './scss/theme';
 
 @include mat.core();
-@include matx.color-variants-back-compat(theme.$light-theme);
+@include mat.color-variants-backwards-compatibility(theme.$light-theme);
 
 html {
   @include mat.all-component-themes(theme.$light-theme);