Revert "update ng 15"

This reverts commit f46c5ce47c.

package.json

@@ -11,23 +11,23 @@
   },
   "private": true,
   "dependencies": {
-    "@angular/animations": "^15.2.4",
+    "@angular/animations": "^14.2.10",
-    "@angular/cdk": "^15.2.4",
+    "@angular/cdk": "^14.2.6",
-    "@angular/common": "^15.2.4",
+    "@angular/common": "^14.2.10",
-    "@angular/compiler": "^15.2.4",
+    "@angular/compiler": "^14.2.10",
-    "@angular/core": "^15.2.4",
+    "@angular/core": "^14.2.10",
-    "@angular/fire": "^7.5.0",
+    "@angular/fire": "^7.4.1",
-    "@angular/forms": "^15.2.4",
+    "@angular/forms": "^14.2.10",
-    "@angular/material": "^15.2.4",
+    "@angular/material": "^14.2.6",
-    "@angular/platform-browser": "^15.2.4",
+    "@angular/platform-browser": "^14.2.10",
-    "@angular/platform-browser-dynamic": "^15.2.4",
+    "@angular/platform-browser-dynamic": "^14.2.10",
-    "@angular/router": "^15.2.4",
+    "@angular/router": "^14.2.10",
-    "@angular/service-worker": "^15.2.4",
+    "@angular/service-worker": "^14.2.10",
     "@fortawesome/angular-fontawesome": "^0.11.1",
     "@fortawesome/fontawesome-svg-core": "^6.1.2",
     "@fortawesome/free-solid-svg-icons": "^6.1.2",
     "docx": "^7.4.1",
-    "firebase": "^9.18.0",
+    "firebase": "^9.6.10",
     "lodash": "^4.17.21",
     "ngx-mat-select-search": "^4.2.1",
     "ngx-perfect-scrollbar": "^10.1.1",
@@ -38,16 +38,16 @@
     "zone.js": "~0.11.8"
   },
   "devDependencies": {
-    "@angular-devkit/architect": "0.1502.4",
+    "@angular-devkit/architect": "0.1402.9",
-    "@angular-devkit/build-angular": "^15.2.4",
+    "@angular-devkit/build-angular": "^14.2.9",
     "@angular-eslint/builder": "14.1.2",
     "@angular-eslint/eslint-plugin": "14.1.2",
     "@angular-eslint/eslint-plugin-template": "14.1.2",
     "@angular-eslint/schematics": "14.1.2",
     "@angular-eslint/template-parser": "14.1.2",
-    "@angular/cli": "^15.2.4",
+    "@angular/cli": "^14.2.9",
-    "@angular/compiler-cli": "^15.2.4",
+    "@angular/compiler-cli": "^14.2.10",
-    "@angular/language-service": "^15.2.4",
+    "@angular/language-service": "^14.2.10",
     "@types/jasmine": "~4.0.3",
     "@types/jasminewd2": "~2.0.10",
     "@types/lodash": "^4.14.182",
@@ -69,6 +69,6 @@
     "karma-jasmine-html-reporter": "^2.0.0",
     "prettier": "^2.7.1",
     "protractor": "~7.0.0",
-    "typescript": "~4.9.5"
+    "typescript": "~4.7.4"
   }
 }

src/app/app-routing.module.ts

@@ -54,6 +54,7 @@ const routes: Routes = [
   imports: [
     RouterModule.forRoot(routes, {
       preloadingStrategy: PreloadAllModules,
+      relativeLinkResolution: 'legacy',
     }),
   ],
   exports: [RouterModule],

src/app/modules/presentation/presentation.module.ts

@@ -5,20 +5,20 @@ import {PresentationRoutingModule} from './presentation-routing.module';
 import {MonitorComponent} from './monitor/monitor.component';
 import {RemoteComponent} from './remote/remote.component';
 import {CardModule} from '../../widget-modules/components/card/card.module';
-import {MatLegacyFormFieldModule as MatFormFieldModule} from '@angular/material/legacy-form-field';
+import {MatFormFieldModule} from '@angular/material/form-field';
-import {MatLegacySelectModule as MatSelectModule} from '@angular/material/legacy-select';
+import {MatSelectModule} from '@angular/material/select';
 import {ShowTypeTranslaterModule} from '../../widget-modules/pipes/show-type-translater/show-type-translater.module';
 import {SectionTypeTranslatorModule} from '../../widget-modules/pipes/section-type-translator/section-type-translator.module';
 import {SongTextModule} from '../../widget-modules/components/song-text/song-text.module';
 import {LegalComponent} from './monitor/legal/legal.component';
-import {MatLegacyButtonModule as MatButtonModule} from '@angular/material/legacy-button';
+import {MatButtonModule} from '@angular/material/button';
 import {FontAwesomeModule} from '@fortawesome/angular-fontawesome';
-import {MatLegacySliderModule as MatSliderModule} from '@angular/material/legacy-slider';
+import {MatSliderModule} from '@angular/material/slider';
 import {FormsModule, ReactiveFormsModule} from '@angular/forms';
 import {AddSongModule} from '../../widget-modules/components/add-song/add-song.module';
 import {LogoComponent} from './monitor/logo/logo.component';
 import {SelectComponent} from './select/select.component';
-import {MatLegacyInputModule as MatInputModule} from '@angular/material/legacy-input';
+import {MatInputModule} from '@angular/material/input';
 import {UserNameModule} from '../../services/user/user-name/user-name.module';
 
 @NgModule({

src/app/modules/shows/shows.module.ts

@@ -4,17 +4,17 @@ import {CommonModule} from '@angular/common';
 import {ShowsRoutingModule} from './shows-routing.module';
 import {NewComponent} from './new/new.component';
 import {CardModule} from '../../widget-modules/components/card/card.module';
-import {MatLegacyFormFieldModule as MatFormFieldModule} from '@angular/material/legacy-form-field';
+import {MatFormFieldModule} from '@angular/material/form-field';
 import {FormsModule, ReactiveFormsModule} from '@angular/forms';
-import {MatLegacyInputModule as MatInputModule} from '@angular/material/legacy-input';
+import {MatInputModule} from '@angular/material/input';
 import {ListComponent} from './list/list.component';
 import {ListItemComponent} from './list/list-item/list-item.component';
 import {ListHeaderModule} from '../../widget-modules/components/list-header/list-header.module';
-import {MatLegacyCheckboxModule as MatCheckboxModule} from '@angular/material/legacy-checkbox';
+import {MatCheckboxModule} from '@angular/material/checkbox';
 import {ButtonRowModule} from '../../widget-modules/components/button-row/button-row.module';
-import {MatLegacyButtonModule as MatButtonModule} from '@angular/material/legacy-button';
+import {MatButtonModule} from '@angular/material/button';
 import {MatDatepickerModule} from '@angular/material/datepicker';
-import {MatLegacySelectModule as MatSelectModule} from '@angular/material/legacy-select';
+import {MatSelectModule} from '@angular/material/select';
 import {ShowTypeTranslaterModule} from '../../widget-modules/pipes/show-type-translater/show-type-translater.module';
 import {MatNativeDateModule} from '@angular/material/core';
 import {ShowComponent} from './show/show.component';
@@ -27,11 +27,11 @@ import {AddSongModule} from '../../widget-modules/components/add-song/add-song.m
 import {ButtonModule} from '../../widget-modules/components/button/button.module';
 import {OwnerModule} from '../../services/user/owner.module';
 import {UserNameModule} from '../../services/user/user-name/user-name.module';
-import {MatLegacyMenuModule as MatMenuModule} from '@angular/material/legacy-menu';
+import {MatMenuModule} from '@angular/material/menu';
 import {DragDropModule} from '@angular/cdk/drag-drop';
 import {RoleModule} from '../../services/user/role.module';
 import {SortByModule} from '../../widget-modules/pipes/sort-by/sort-by.module';
-import {MatLegacyTooltipModule as MatTooltipModule} from '@angular/material/legacy-tooltip';
+import {MatTooltipModule} from '@angular/material/tooltip';
 import {FilterComponent} from './list/filter/filter.component';
 import {EditComponent} from './edit/edit.component';
 

src/app/modules/songs/song-list/song-list.module.ts

@@ -5,14 +5,14 @@ import {CardModule} from '../../../widget-modules/components/card/card.module';
 import {RouterModule} from '@angular/router';
 import {LegalTypeTranslatorModule} from '../../../widget-modules/pipes/legal-type-translator/legal-type-translator.module';
 import {ListHeaderModule} from '../../../widget-modules/components/list-header/list-header.module';
-import {MatLegacyFormFieldModule as MatFormFieldModule} from '@angular/material/legacy-form-field';
+import {MatFormFieldModule} from '@angular/material/form-field';
-import {MatLegacyInputModule as MatInputModule} from '@angular/material/legacy-input';
+import {MatInputModule} from '@angular/material/input';
 import {FilterComponent} from './filter/filter.component';
 import {ReactiveFormsModule} from '@angular/forms';
-import {MatLegacySelectModule as MatSelectModule} from '@angular/material/legacy-select';
+import {MatSelectModule} from '@angular/material/select';
 import {SongTypeTranslaterModule} from '../../../widget-modules/pipes/song-type-translater/song-type-translater.module';
 import {FontAwesomeModule} from '@fortawesome/angular-fontawesome';
-import {MatLegacyTooltipModule as MatTooltipModule} from '@angular/material/legacy-tooltip';
+import {MatTooltipModule} from '@angular/material/tooltip';
 import {RoleModule} from '../../../services/user/role.module';
 import {KeyTranslatorModule} from '../../../widget-modules/pipes/key-translator/key-translator.module';
 

src/app/modules/songs/song/edit/edit-song/edit-song.component.ts

@@ -7,9 +7,9 @@ import {EditService} from '../edit.service';
 import {first, map, switchMap} from 'rxjs/operators';
 import {KEYS} from '../../../services/key.helper';
 import {COMMA, ENTER} from '@angular/cdk/keycodes';
-import {MatLegacyChipInputEvent as MatChipInputEvent} from '@angular/material/legacy-chips';
+import {MatChipInputEvent} from '@angular/material/chips';
 import {faExternalLinkAlt, faSave, faTimesCircle} from '@fortawesome/free-solid-svg-icons';
-import {MatLegacyDialog as MatDialog} from '@angular/material/legacy-dialog';
+import {MatDialog} from '@angular/material/dialog';
 import {SaveDialogComponent} from './save-dialog/save-dialog.component';
 
 @Component({

src/app/modules/songs/song/edit/edit.module.ts

@@ -4,10 +4,10 @@ import {EditComponent} from './edit.component';
 import {CardModule} from '../../../../widget-modules/components/card/card.module';
 import {SongTypeTranslaterModule} from '../../../../widget-modules/pipes/song-type-translater/song-type-translater.module';
 import {ReactiveFormsModule} from '@angular/forms';
-import {MatLegacyInputModule as MatInputModule} from '@angular/material/legacy-input';
+import {MatInputModule} from '@angular/material/input';
-import {MatLegacyCheckboxModule as MatCheckboxModule} from '@angular/material/legacy-checkbox';
+import {MatCheckboxModule} from '@angular/material/checkbox';
-import {MatLegacySelectModule as MatSelectModule} from '@angular/material/legacy-select';
+import {MatSelectModule} from '@angular/material/select';
-import {MatLegacyButtonModule as MatButtonModule} from '@angular/material/legacy-button';
+import {MatButtonModule} from '@angular/material/button';
 import {ButtonRowModule} from '../../../../widget-modules/components/button-row/button-row.module';
 import {RouterModule} from '@angular/router';
 import {EditSongComponent} from './edit-song/edit-song.component';
@@ -17,13 +17,13 @@ import {FileComponent} from './edit-file/file/file.component';
 import {LegalOwnerTranslatorModule} from '../../../../widget-modules/pipes/legal-owner-translator/legal-owner-translator.module';
 import {LegalTypeTranslatorModule} from '../../../../widget-modules/pipes/legal-type-translator/legal-type-translator.module';
 import {KeyTranslatorModule} from '../../../../widget-modules/pipes/key-translator/key-translator.module';
-import {MatLegacyChipsModule as MatChipsModule} from '@angular/material/legacy-chips';
+import {MatChipsModule} from '@angular/material/chips';
 import {FontAwesomeModule} from '@fortawesome/angular-fontawesome';
 import {StatusTranslaterModule} from '../../../../widget-modules/pipes/status-translater/status-translater.module';
 import {ButtonModule} from '../../../../widget-modules/components/button/button.module';
-import {MatLegacyTooltipModule as MatTooltipModule} from '@angular/material/legacy-tooltip';
+import {MatTooltipModule} from '@angular/material/tooltip';
 import {SaveDialogComponent} from './edit-song/save-dialog/save-dialog.component';
-import {MatLegacyDialogModule as MatDialogModule} from '@angular/material/legacy-dialog';
+import {MatDialogModule} from '@angular/material/dialog';
 import {HistoryComponent} from './history/history.component';
 import {SongTextModule} from '../../../../widget-modules/components/song-text/song-text.module';
 

src/app/modules/songs/song/new/new.module.ts

@@ -3,8 +3,8 @@ import {CommonModule} from '@angular/common';
 import {NewComponent} from './new.component';
 import {CardModule} from '../../../../widget-modules/components/card/card.module';
 import {ReactiveFormsModule} from '@angular/forms';
-import {MatLegacyFormFieldModule as MatFormFieldModule} from '@angular/material/legacy-form-field';
+import {MatFormFieldModule} from '@angular/material/form-field';
-import {MatLegacyInputModule as MatInputModule} from '@angular/material/legacy-input';
+import {MatInputModule} from '@angular/material/input';
 import {ButtonRowModule} from '../../../../widget-modules/components/button-row/button-row.module';
 import {ButtonModule} from '../../../../widget-modules/components/button/button.module';
 import {AutofocusModule} from '../../../../widget-modules/directives/autofocus/autofocus.module';

src/app/modules/songs/song/song.module.ts

@@ -3,17 +3,17 @@ import {CommonModule} from '@angular/common';
 import {SongComponent} from './song.component';
 import {CardModule} from '../../../widget-modules/components/card/card.module';
 import {SongTypeTranslaterModule} from '../../../widget-modules/pipes/song-type-translater/song-type-translater.module';
-import {MatLegacyButtonModule as MatButtonModule} from '@angular/material/legacy-button';
+import {MatButtonModule} from '@angular/material/button';
 import {ButtonRowModule} from '../../../widget-modules/components/button-row/button-row.module';
 import {RouterModule} from '@angular/router';
 import {LegalOwnerTranslatorModule} from '../../../widget-modules/pipes/legal-owner-translator/legal-owner-translator.module';
 import {SongTextModule} from '../../../widget-modules/components/song-text/song-text.module';
-import {MatLegacyChipsModule as MatChipsModule} from '@angular/material/legacy-chips';
+import {MatChipsModule} from '@angular/material/chips';
 import {RoleModule} from '../../../services/user/role.module';
 import {StatusTranslaterModule} from '../../../widget-modules/pipes/status-translater/status-translater.module';
 import {ButtonModule} from '../../../widget-modules/components/button/button.module';
 import {FileComponent} from './file/file.component';
-import {MatLegacyMenuModule as MatMenuModule} from '@angular/material/legacy-menu';
+import {MatMenuModule} from '@angular/material/menu';
 import {ShowTypeTranslaterModule} from '../../../widget-modules/pipes/show-type-translater/show-type-translater.module';
 
 @NgModule({

src/app/modules/user/user.module.ts

@@ -3,16 +3,16 @@ import {CommonModule} from '@angular/common';
 import {LoginComponent} from './login/login.component';
 import {UserRoutingModule} from './user-routing.module';
 import {CardModule} from '../../widget-modules/components/card/card.module';
-import {MatLegacyFormFieldModule as MatFormFieldModule} from '@angular/material/legacy-form-field';
+import {MatFormFieldModule} from '@angular/material/form-field';
 import {FormsModule, ReactiveFormsModule} from '@angular/forms';
-import {MatLegacyInputModule as MatInputModule} from '@angular/material/legacy-input';
+import {MatInputModule} from '@angular/material/input';
 import {ButtonRowModule} from '../../widget-modules/components/button-row/button-row.module';
-import {MatLegacyButtonModule as MatButtonModule} from '@angular/material/legacy-button';
+import {MatButtonModule} from '@angular/material/button';
 import {AuthMessagePipe} from './login/auth-message.pipe';
 import {InfoComponent} from './info/info.component';
 import {LogoutComponent} from './logout/logout.component';
 import {RolePipe} from './info/role.pipe';
-import {MatLegacySelectModule as MatSelectModule} from '@angular/material/legacy-select';
+import {MatSelectModule} from '@angular/material/select';
 import {PasswordComponent} from './password/password.component';
 import {PasswordSendComponent} from './password-send/password-send.component';
 import {UsersComponent} from './info/users/users.component';

src/app/widget-modules/components/add-song/add-song.component.ts

@@ -1,7 +1,7 @@
 import {ChangeDetectionStrategy, Component, Input} from '@angular/core';
 import {UntypedFormControl} from '@angular/forms';
 import {filterSong} from '../../../services/filter.helper';
-import {MatLegacySelectChange as MatSelectChange} from '@angular/material/legacy-select';
+import {MatSelectChange} from '@angular/material/select';
 import {Song} from '../../../modules/songs/services/song';
 import {ShowSong} from '../../../modules/shows/services/show-song';
 import {ShowSongService} from '../../../modules/shows/services/show-song.service';

src/app/widget-modules/components/add-song/add-song.module.ts

@@ -1,8 +1,8 @@
 import {NgModule} from '@angular/core';
 import {CommonModule} from '@angular/common';
 import {AddSongComponent} from './add-song.component';
-import {MatLegacyFormFieldModule as MatFormFieldModule} from '@angular/material/legacy-form-field';
+import {MatFormFieldModule} from '@angular/material/form-field';
-import {MatLegacySelectModule as MatSelectModule} from '@angular/material/legacy-select';
+import {MatSelectModule} from '@angular/material/select';
 import {NgxMatSelectSearchModule} from 'ngx-mat-select-search';
 import {ReactiveFormsModule} from '@angular/forms';
 

src/app/widget-modules/components/button/button.module.ts

@@ -2,7 +2,7 @@ import {NgModule} from '@angular/core';
 import {CommonModule} from '@angular/common';
 import {ButtonComponent} from './button.component';
 import {FontAwesomeModule} from '@fortawesome/angular-fontawesome';
-import {MatLegacyButtonModule as MatButtonModule} from '@angular/material/legacy-button';
+import {MatButtonModule} from '@angular/material/button';
 
 @NgModule({
   declarations: [ButtonComponent],

src/app/widget-modules/components/card/card.component.less

@@ -3,10 +3,12 @@
 .card {
   margin: 20px;
   border-radius: 8px;
-  background: #fff;
+  background: #fffc;
+  backdrop-filter: blur(12px);
   overflow: hidden;
   width: 800px;
   position: relative;
+  transition: all 150ms ease-in-out;
 
   @media screen and (max-width: 860px) {
     width: 100vw;

src/app/widget-modules/components/card/card.module.ts

@@ -1,7 +1,7 @@
 import {NgModule} from '@angular/core';
 import {CommonModule} from '@angular/common';
 import {CardComponent} from './card.component';
-import {MatLegacyButtonModule as MatButtonModule} from '@angular/material/legacy-button';
+import {MatButtonModule} from '@angular/material/button';
 import {RouterModule} from '@angular/router';
 import {FontAwesomeModule} from '@fortawesome/angular-fontawesome';
 

src/app/widget-modules/components/list-header/list-header.module.ts

@@ -2,7 +2,7 @@ import {NgModule} from '@angular/core';
 import {CommonModule} from '@angular/common';
 import {ListHeaderComponent} from './list-header.component';
 import {FontAwesomeModule} from '@fortawesome/angular-fontawesome';
-import {MatLegacyButtonModule as MatButtonModule} from '@angular/material/legacy-button';
+import {MatButtonModule} from '@angular/material/button';
 import {RouterModule} from '@angular/router';
 import {CardModule} from '../card/card.module';
 

src/app/widget-modules/components/menu-button/menu-button.module.ts

@@ -2,7 +2,7 @@ import {NgModule} from '@angular/core';
 import {CommonModule} from '@angular/common';
 import {MenuButtonComponent} from './menu-button.component';
 import {FontAwesomeModule} from '@fortawesome/angular-fontawesome';
-import {MatLegacyButtonModule as MatButtonModule} from '@angular/material/legacy-button';
+import {MatButtonModule} from '@angular/material/button';
 
 @NgModule({
   declarations: [MenuButtonComponent],

src/app/widget-modules/components/song-text/song-text.module.ts

@@ -2,7 +2,7 @@ import {NgModule} from '@angular/core';
 import {CommonModule} from '@angular/common';
 import {SongTextComponent} from './song-text.component';
 import {FontAwesomeModule} from '@fortawesome/angular-fontawesome';
-import {MatLegacyButtonModule as MatButtonModule} from '@angular/material/legacy-button';
+import {MatButtonModule} from '@angular/material/button';
 
 @NgModule({
   declarations: [SongTextComponent],

src/custom-theme.scss

@@ -7,16 +7,7 @@
 // Include the common styles for Angular Material. We include this here so that you only
 // have to load a single css file for Angular Material in your app.
 // Be sure that you only ever include this mixin once!
-// TODO(v15): As of v15 mat.legacy-core no longer includes default typography styles.
+@include mat.core();
-//  The following line adds:
-//    1. Default typography styles for all components
-//    2. Styles for typography hierarchy classes (e.g. .mat-headline-1)
-//  If you specify typography styles for the components you use elsewhere, you should delete this line.
-//  If you don't need the default component typographies but still want the hierarchy styles,
-//  you can delete this line and instead use:
-//    `@include mat.legacy-typography-hierarchy(mat.define-legacy-typography-config());`
-@include mat.all-legacy-component-typographies();
-@include mat.legacy-core();
 
 // Define the palettes for your theme using the Material Design palettes available in palette.scss
 // (imported above). For each palette, you can optionally specify a default, lighter, and darker
@@ -33,7 +24,7 @@ $wgenerator-theme: mat.define-light-theme($wgenerator-primary, $wgenerator-accen
 // Include theme styles for core and each component used in your app.
 // Alternatively, you can import and @include the theme mixins for each component
 // that you are using.
-@include mat.all-legacy-component-themes($wgenerator-theme);
+@include mat.all-component-themes($wgenerator-theme);
 
 
 // Custom Theming for Angular Material
@@ -43,16 +34,7 @@ $wgenerator-theme: mat.define-light-theme($wgenerator-primary, $wgenerator-accen
 // Include the common styles for Angular Material. We include this here so that you only
 // have to load a single css file for Angular Material in your app.
 // Be sure that you only ever include this mixin once!
-// TODO(v15): As of v15 mat.legacy-core no longer includes default typography styles.
+@include mat.core();
-//  The following line adds:
-//    1. Default typography styles for all components
-//    2. Styles for typography hierarchy classes (e.g. .mat-headline-1)
-//  If you specify typography styles for the components you use elsewhere, you should delete this line.
-//  If you don't need the default component typographies but still want the hierarchy styles,
-//  you can delete this line and instead use:
-//    `@include mat.legacy-typography-hierarchy(mat.define-legacy-typography-config());`
-@include mat.all-legacy-component-typographies();
-@include mat.legacy-core();
 
 // Define the palettes for your theme using the Material Design palettes available in palette.scss
 // (imported above). For each palette, you can optionally specify a default, lighter, and darker
@@ -69,7 +51,7 @@ $wgenerator-theme: mat.define-light-theme($wgenerator-primary, $wgenerator-accen
 // Include theme styles for core and each component used in your app.
 // Alternatively, you can import and @include the theme mixins for each component
 // that you are using.
-@include mat.all-legacy-component-themes($wgenerator-theme);
+@include mat.all-component-themes($wgenerator-theme);
 
 // Custom Theming for Angular Material
 // For more information: https://material.angular.io/guide/theming
@@ -78,16 +60,7 @@ $wgenerator-theme: mat.define-light-theme($wgenerator-primary, $wgenerator-accen
 // Include the common styles for Angular Material. We include this here so that you only
 // have to load a single css file for Angular Material in your app.
 // Be sure that you only ever include this mixin once!
-// TODO(v15): As of v15 mat.legacy-core no longer includes default typography styles.
+@include mat.core();
-//  The following line adds:
-//    1. Default typography styles for all components
-//    2. Styles for typography hierarchy classes (e.g. .mat-headline-1)
-//  If you specify typography styles for the components you use elsewhere, you should delete this line.
-//  If you don't need the default component typographies but still want the hierarchy styles,
-//  you can delete this line and instead use:
-//    `@include mat.legacy-typography-hierarchy(mat.define-legacy-typography-config());`
-@include mat.all-legacy-component-typographies();
-@include mat.legacy-core();
 
 // Define the palettes for your theme using the Material Design palettes available in palette.scss
 // (imported above). For each palette, you can optionally specify a default, lighter, and darker
@@ -104,5 +77,5 @@ $wgenerator-theme: mat.define-light-theme($wgenerator-primary, $wgenerator-accen
 // Include theme styles for core and each component used in your app.
 // Alternatively, you can import and @include the theme mixins for each component
 // that you are using.
-@include mat.all-legacy-component-themes($wgenerator-theme);
+@include mat.all-component-themes($wgenerator-theme);
 

src/test.ts

@@ -5,6 +5,11 @@ import {getTestBed} from '@angular/core/testing';
 import {BrowserDynamicTestingModule, platformBrowserDynamicTesting} from '@angular/platform-browser-dynamic/testing';
 
 type req = {keys: () => {map: (context: req) => void}};
+declare const require: {context: (a: string, b: boolean, c: RegExp) => req};
 
 // First, initialize the Angular testing environment.
 getTestBed().initTestEnvironment(BrowserDynamicTestingModule, platformBrowserDynamicTesting());
+// Then we find all the tests.
+const context = require.context('./', true, /\.spec\.ts$/);
+// And load the modules.
+context.keys().map(context);

tsconfig.json

@@ -11,17 +11,15 @@
     "module": "es2020",
     "moduleResolution": "node",
     "importHelpers": true,
-    "target": "ES2022",
+    "target": "es2020",
     "strict": true,
-    "skipLibCheck": true,
     "typeRoots": [
       "node_modules/@types"
     ],
     "lib": [
       "es2018",
       "dom"
-    ],
+    ]
-    "useDefineForClassFields": false
   },
   "angularCompilerOptions": {
     "fullTemplateTypeCheck": true,