chore: update angular and nx to v15

apps/docs/project.json

@@ -1,4 +1,5 @@
 {
+    "name": "docs",
     "sourceRoot": "apps/docs/src",
     "projectType": "application",
     "prefix": "fundamental-ngx",
@@ -174,6 +175,9 @@
                 }
             },
             "configurations": {
+                "development": {
+                    "tsConfig": "apps/docs/tsconfig.app.json"
+                },
                 "production": {
                     "fileReplacements": [
                         {
@@ -210,11 +214,11 @@
                 }
             },
             "outputs": ["{options.outputPath}"],
-            "defaultConfiguration": "",
+            "defaultConfiguration": "development",
             "dependsOn": ["^build", "generate-typedoc"]
         },
         "serve": {
-            "executor": "@nrwl/angular:webpack-server",
+            "executor": "@nrwl/angular:webpack-dev-server",
             "options": {
                 "browserTarget": "docs:build"
             },
@@ -230,7 +234,8 @@
                     "disableHostCheck": true,
                     "liveReload": false
                 }
-            }
+            },
+            "defaultConfiguration": "hot-module-replacement"
         },
         "lint": {
             "executor": "@nrwl/linter:eslint",

apps/docs/src/app/app.module.ts

@@ -53,7 +53,6 @@ const routes: Routes = [
         HttpClientModule,
         RouterModule.forRoot(routes, {
             useHash: true,
-            relativeLinkResolution: 'legacy',
             preloadingStrategy: PreloadAllModules
         }),
         MarkdownModule.forRoot({ loader: HttpClient }),

apps/docs/tsconfig.app.json

@@ -4,7 +4,9 @@
         "resolveJsonModule": true,
         "esModuleInterop": true,
         "outDir": "../../dist/out-tsc",
-        "types": ["node"]
+        "types": ["node"],
+        "target": "ES2022",
+        "useDefineForClassFields": false
     },
     "files": ["src/main.ts", "src/polyfills.ts"],
     "include": ["src/*.d.ts", "**/*.ts"],

apps/docs/tsconfig.json

@@ -4,6 +4,6 @@
         "enableIvy": true
     },
     "compilerOptions": {
-        "target": "es2020"
+        "target": "es2022"
     }
 }

apps/docs/tsconfig.netlify.json

@@ -4,7 +4,9 @@
         "resolveJsonModule": true,
         "esModuleInterop": true,
         "outDir": "../../dist/out-tsc",
-        "types": ["node"]
+        "types": ["node"],
+        "target": "ES2022",
+        "useDefineForClassFields": false
     },
     "exclude": ["**/*.spec.ts"],
     "include": ["**/*.ts"]

e2e/project.json

@@ -1,4 +1,5 @@
 {
+    "name": "components-e2e",
     "sourceRoot": "e2e",
     "projectType": "application",
     "targets": {

libs/core/schematics/migrations/migration-0-37/index.ts

@@ -32,7 +32,7 @@ function removeStylesFromConfig(): Rule {
                     ];
 
                     const stylesToRemove = [
-                        'node_modules/fundamental-styles/dist/icon.css',
+                        '~fundamental-styles/dist/icon.css',
                         './node_modules/@sap-theming/theming-base-content/content/Base/baseLib/sap_fiori_3/css_variables.css',
                         './node_modules/fundamental-styles/dist/theming/sap_fiori_3.css',
                         ...themes.map(

libs/core/src/lib/action-bar/action-bar.component.scss

@@ -1,2 +1,2 @@
-@import '~fundamental-styles/dist/action-bar';
-@import '~fundamental-styles/dist/title';
+@import '~fundamental-styles/dist/action-bar.css';
+@import '~fundamental-styles/dist/title.css';

libs/core/src/lib/action-bar/project.json

@@ -1,11 +1,12 @@
 {
+    "name": "core-action-bar",
     "projectType": "library",
     "sourceRoot": "libs/core/src/lib/action-bar",
     "prefix": "fd",
     "targets": {
         "build": {
             "executor": "@nrwl/angular:ng-packagr-lite",
-            "outputs": ["dist/libs/core/action-bar"],
+            "outputs": ["{workspaceRoot}/dist/libs/core/action-bar"],
             "options": {
                 "tsConfig": "libs/core/src/lib/action-bar/tsconfig.lib.json",
                 "project": "libs/core/src/lib/action-bar/ng-package.json",

libs/core/src/lib/action-bar/test.ts

@@ -7,13 +7,7 @@ import 'zone.js/testing';
 import { getTestBed } from '@angular/core/testing';
 import { BrowserDynamicTestingModule, platformBrowserDynamicTesting } from '@angular/platform-browser-dynamic/testing';
 
-declare const require: any;
-
 // First, initialize the Angular testing environment.
 getTestBed().initTestEnvironment(BrowserDynamicTestingModule, platformBrowserDynamicTesting(), {
     teardown: { destroyAfterEach: false }
 });
-// Then we find all the tests.
-const context = require.context('./', true, /\.spec\.ts$/);
-// And load the modules.
-context.keys().map(context);

libs/core/src/lib/action-bar/tsconfig.json

@@ -18,6 +18,6 @@
         "strict": false,
         "noImplicitReturns": false,
         "noFallthroughCasesInSwitch": true,
-        "target": "es2020"
+        "target": "es2022"
     }
 }

libs/core/src/lib/action-bar/tsconfig.lib.json

@@ -2,12 +2,13 @@
     "extends": "./tsconfig.json",
     "compilerOptions": {
         "outDir": "../../out-tsc/lib",
-        "target": "es2020",
+        "target": "ES2022",
         "declaration": true,
         "declarationMap": true,
         "inlineSources": true,
         "types": [],
-        "lib": ["dom", "es2018"]
+        "lib": ["dom", "es2018"],
+        "useDefineForClassFields": false
     },
     "angularCompilerOptions": {
         "skipTemplateCodegen": true,

libs/core/src/lib/action-bar/tsconfig.lib.prod.json

@@ -1,7 +1,9 @@
 {
     "extends": "./tsconfig.lib.json",
     "compilerOptions": {
-        "declarationMap": false
+        "declarationMap": false,
+        "target": "ES2022",
+        "useDefineForClassFields": false
     },
     "angularCompilerOptions": {
         "compilationMode": "partial"

libs/core/src/lib/action-bar/tsconfig.spec.json

@@ -1,9 +1,10 @@
-/* To learn more about this file see: https://angular.io/config/tsconfig. */
 {
     "extends": "./tsconfig.json",
     "compilerOptions": {
         "outDir": "../../out-tsc/spec",
-        "types": ["jasmine"]
+        "types": ["jasmine"],
+        "target": "ES2022",
+        "useDefineForClassFields": false
     },
     "files": ["./test.ts"],
     "include": ["**/*.spec.ts", "**/*.d.ts"]

libs/core/src/lib/action-sheet/action-sheet.component.scss

@@ -1,4 +1,4 @@
-@import '~fundamental-styles/dist/action-sheet';
+@import '~fundamental-styles/dist/action-sheet.css';
 
 fd-action-sheet-body {
     width: 100%;

libs/core/src/lib/action-sheet/action-sheet.component.spec.ts

@@ -1,7 +1,7 @@
 import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 import { Component, ElementRef, ViewChild } from '@angular/core';
 import { ActionSheetModule } from './action-sheet.module';
-import { ButtonModule } from '../button/button.module';
+import { ButtonModule } from '@fundamental-ngx/core/button';
 
 @Component({
     template: ` <div #componentElement fd-action-sheet>Action Sheet Parent Test Text</div> `

libs/core/src/lib/action-sheet/project.json

@@ -1,11 +1,12 @@
 {
+    "name": "core-action-sheet",
     "projectType": "library",
     "sourceRoot": "libs/core/src/lib/action-sheet",
     "prefix": "fd",
     "targets": {
         "build": {
             "executor": "@nrwl/angular:ng-packagr-lite",
-            "outputs": ["dist/libs/core/action-sheet"],
+            "outputs": ["{workspaceRoot}/dist/libs/core/action-sheet"],
             "options": {
                 "tsConfig": "libs/core/src/lib/action-sheet/tsconfig.lib.json",
                 "project": "libs/core/src/lib/action-sheet/ng-package.json",

libs/core/src/lib/action-sheet/test.ts

@@ -7,13 +7,7 @@ import 'zone.js/testing';
 import { getTestBed } from '@angular/core/testing';
 import { BrowserDynamicTestingModule, platformBrowserDynamicTesting } from '@angular/platform-browser-dynamic/testing';
 
-declare const require: any;
-
 // First, initialize the Angular testing environment.
 getTestBed().initTestEnvironment(BrowserDynamicTestingModule, platformBrowserDynamicTesting(), {
     teardown: { destroyAfterEach: false }
 });
-// Then we find all the tests.
-const context = require.context('./', true, /\.spec\.ts$/);
-// And load the modules.
-context.keys().map(context);

libs/core/src/lib/action-sheet/tsconfig.json

@@ -18,6 +18,6 @@
         "strict": false,
         "noImplicitReturns": false,
         "noFallthroughCasesInSwitch": true,
-        "target": "es2020"
+        "target": "es2022"
     }
 }

libs/core/src/lib/action-sheet/tsconfig.lib.json

@@ -2,12 +2,13 @@
     "extends": "./tsconfig.json",
     "compilerOptions": {
         "outDir": "../../out-tsc/lib",
-        "target": "es2020",
+        "target": "ES2022",
         "declaration": true,
         "declarationMap": true,
         "inlineSources": true,
         "types": [],
-        "lib": ["dom", "es2018"]
+        "lib": ["dom", "es2018"],
+        "useDefineForClassFields": false
     },
     "angularCompilerOptions": {
         "skipTemplateCodegen": true,

libs/core/src/lib/action-sheet/tsconfig.lib.prod.json

@@ -1,7 +1,9 @@
 {
     "extends": "./tsconfig.lib.json",
     "compilerOptions": {
-        "declarationMap": false
+        "declarationMap": false,
+        "target": "ES2022",
+        "useDefineForClassFields": false
     },
     "angularCompilerOptions": {
         "compilationMode": "partial"

libs/core/src/lib/action-sheet/tsconfig.spec.json

@@ -1,9 +1,10 @@
-/* To learn more about this file see: https://angular.io/config/tsconfig. */
 {
     "extends": "./tsconfig.json",
     "compilerOptions": {
         "outDir": "../../out-tsc/spec",
-        "types": ["jasmine"]
+        "types": ["jasmine"],
+        "target": "ES2022",
+        "useDefineForClassFields": false
     },
     "files": ["./test.ts"],
     "include": ["**/*.spec.ts", "**/*.d.ts"]

libs/core/src/lib/alert/alert-service/alert.service.spec.ts

@@ -7,7 +7,7 @@ import { BrowserModule } from '@angular/platform-browser';
 import { AlertContainerComponent } from '../alert-utils/alert-container.component';
 import { DynamicComponentService } from '@fundamental-ngx/core/utils';
 import { AlertRef } from '../alert-utils/alert-ref';
-import { ButtonModule } from '../../button/button.module';
+import { ButtonModule } from '@fundamental-ngx/core/button';
 import { AlertConfig } from '../alert-utils/alert-config';
 
 @Component({

libs/core/src/lib/alert/alert.component.scss

@@ -1,4 +1,4 @@
-@import '~fundamental-styles/dist/alert';
+@import '~fundamental-styles/dist/alert.css';
 
 .fd-alert {
     display: block;

libs/core/src/lib/alert/alert.component.spec.ts

@@ -8,7 +8,7 @@ import { CommonModule } from '@angular/common';
 import { BrowserModule } from '@angular/platform-browser';
 import { NoopAnimationsModule } from '@angular/platform-browser/animations';
 import { DynamicComponentService } from '@fundamental-ngx/core/utils';
-import { ButtonModule } from '../button/button.module';
+import { ButtonModule } from '@fundamental-ngx/core/button';
 import { AlertConfig } from './alert-utils/alert-config';
 
 @Component({

libs/core/src/lib/alert/project.json

@@ -1,11 +1,12 @@
 {
+    "name": "core-alert",
     "projectType": "library",
     "sourceRoot": "libs/core/src/lib/alert",
     "prefix": "fd",
     "targets": {
         "build": {
             "executor": "@nrwl/angular:ng-packagr-lite",
-            "outputs": ["dist/libs/core/alert"],
+            "outputs": ["{workspaceRoot}/dist/libs/core/alert"],
             "options": {
                 "tsConfig": "libs/core/src/lib/alert/tsconfig.lib.json",
                 "project": "libs/core/src/lib/alert/ng-package.json",

libs/core/src/lib/alert/test.ts

@@ -7,13 +7,7 @@ import 'zone.js/testing';
 import { getTestBed } from '@angular/core/testing';
 import { BrowserDynamicTestingModule, platformBrowserDynamicTesting } from '@angular/platform-browser-dynamic/testing';
 
-declare const require: any;
-
 // First, initialize the Angular testing environment.
 getTestBed().initTestEnvironment(BrowserDynamicTestingModule, platformBrowserDynamicTesting(), {
     teardown: { destroyAfterEach: false }
 });
-// Then we find all the tests.
-const context = require.context('./', true, /\.spec\.ts$/);
-// And load the modules.
-context.keys().map(context);

libs/core/src/lib/alert/tsconfig.json

@@ -18,6 +18,6 @@
         "strict": false,
         "noImplicitReturns": false,
         "noFallthroughCasesInSwitch": true,
-        "target": "es2020"
+        "target": "es2022"
     }
 }

libs/core/src/lib/alert/tsconfig.lib.json

@@ -2,12 +2,13 @@
     "extends": "./tsconfig.json",
     "compilerOptions": {
         "outDir": "../../out-tsc/lib",
-        "target": "es2020",
+        "target": "ES2022",
         "declaration": true,
         "declarationMap": true,
         "inlineSources": true,
         "types": [],
-        "lib": ["dom", "es2018"]
+        "lib": ["dom", "es2018"],
+        "useDefineForClassFields": false
     },
     "angularCompilerOptions": {
         "skipTemplateCodegen": true,

libs/core/src/lib/alert/tsconfig.lib.prod.json

@@ -1,7 +1,9 @@
 {
     "extends": "./tsconfig.lib.json",
     "compilerOptions": {
-        "declarationMap": false
+        "declarationMap": false,
+        "target": "ES2022",
+        "useDefineForClassFields": false
     },
     "angularCompilerOptions": {
         "compilationMode": "partial"

libs/core/src/lib/alert/tsconfig.spec.json

@@ -1,9 +1,10 @@
-/* To learn more about this file see: https://angular.io/config/tsconfig. */
 {
     "extends": "./tsconfig.json",
     "compilerOptions": {
         "outDir": "../../out-tsc/spec",
-        "types": ["jasmine"]
+        "types": ["jasmine"],
+        "target": "ES2022",
+        "useDefineForClassFields": false
     },
     "files": ["./test.ts"],
     "include": ["**/*.spec.ts", "**/*.d.ts"]

libs/core/src/lib/avatar-group/avatar-group.component.scss

@@ -1 +1 @@
-@import '~fundamental-styles/dist/avatar-group';
+@import '~fundamental-styles/dist/avatar-group.css';

libs/core/src/lib/avatar-group/avatar-group.component.spec.ts

@@ -2,10 +2,11 @@ import { Component, ViewChild } from '@angular/core';
 import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 
 import { AvatarModule } from '@fundamental-ngx/core/avatar';
-import { AvatarGroupComponent, AvatarGroupModule, AvatarGroupType } from '@fundamental-ngx/core/avatar-group';
 import { ButtonModule } from '@fundamental-ngx/core/button';
 import { PopoverModule } from '@fundamental-ngx/core/popover';
 import { Size } from '@fundamental-ngx/core/utils';
+import { AvatarGroupComponent, AvatarGroupType } from './avatar-group.component';
+import { AvatarGroupModule } from './avatar-group.module';
 
 const NUMBER_OF_ITEMS = 20;