Changed ng version before material migration

lib/core/breadcrumbs/src/_stories/breadcrumb.stories.ts

@@ -16,8 +16,8 @@
  */
 
 import { Meta, moduleMetadata, Story } from '@storybook/angular';
-import { MatButtonModule } from '@angular/material/button';
-import { MatMenuModule } from '@angular/material/menu';
+import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
+import { MatLegacyMenuModule as MatMenuModule } from '@angular/material/legacy-menu';
 import { MatIconModule } from '@angular/material/icon';
 import { BreadcrumbComponent } from '../components/breadcrumb/breadcrumb.component';
 import { BreadcrumbItemComponent } from '../components/breadcrumb-item/breadcrumb-item.component';

lib/core/breadcrumbs/src/components/breadcrumb/breadcrumb.component.ts

@@ -17,9 +17,9 @@
 
 import { AfterContentInit, ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChildren, EventEmitter, Input, OnChanges, Output, QueryList, SimpleChanges, TemplateRef, ViewChildren } from '@angular/core';
 import { CommonModule } from '@angular/common';
-import { MatButtonModule } from '@angular/material/button';
+import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
 import { MatIconModule } from '@angular/material/icon';
-import { MatTooltipModule } from '@angular/material/tooltip';
+import { MatLegacyTooltipModule as MatTooltipModule } from '@angular/material/legacy-tooltip';
 import { map, startWith } from 'rxjs/operators';
 import { TranslateModule } from '@ngx-translate/core';
 

lib/core/custom-theme/theme/typography.scss

@@ -3,7 +3,7 @@
 @import '../variables/font-family';
 
 @function get-mat-typography($base-font-size, $font-family) {
-    $custom-typography: mat.define-typography-config(
+    $custom-typography: mat.define-legacy-typography-configmat.define-legacy-typography-config(
         $font-family: $default-font-family,
         $display-4: mat.define-typography-level(112px, 112px, 300),
         $display-3: mat.define-typography-level(56px, 56px, 400),
@@ -22,7 +22,7 @@
     );
 
     @if $base-font-size {
-        $custom-typography: mat.define-typography-config(
+        $custom-typography: mat.define-legacy-typography-configmat.define-legacy-typography-config(
             $display-4: mat.define-typography-level(8rem, 8rem, 300),
             $display-3: mat.define-typography-level(4rem, 4rem, 400),
             $display-2: mat.define-typography-level(3.21rem, 3.21rem, 400),

lib/core/src/lib/auth/guard/auth-guard-base.ts

@@ -19,7 +19,7 @@ import { Router, CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot, CanAc
 import { AuthenticationService } from '../services/authentication.service';
 import { AppConfigService, AppConfigValues } from '../../app-config/app-config.service';
 import { OauthConfigModel } from '../models/oauth-config.model';
-import { MatDialog } from '@angular/material/dialog';
+import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog';
 import { StorageService } from '../../common/services/storage.service';
 import { Observable } from 'rxjs';
 import { BasicAlfrescoAuthService } from '../basic-auth/basic-alfresco-auth.service';

lib/core/src/lib/auth/guard/auth-guard-bpm.service.ts

@@ -20,7 +20,7 @@ import { ActivatedRouteSnapshot, Router, UrlTree } from '@angular/router';
 import { AppConfigService } from '../../app-config/app-config.service';
 import { AuthenticationService } from '../services/authentication.service';
 import { AuthGuardBase } from './auth-guard-base';
-import { MatDialog } from '@angular/material/dialog';
+import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog';
 import { StorageService } from '../../common/services/storage.service';
 import { BasicAlfrescoAuthService } from '../basic-auth/basic-alfresco-auth.service';
 import { OidcAuthenticationService } from '../oidc/oidc-authentication.service';

lib/core/src/lib/auth/guard/auth-guard-ecm.service.ts

@@ -20,7 +20,7 @@ import { ActivatedRouteSnapshot, Router, UrlTree } from '@angular/router';
 import { AuthenticationService } from '../services/authentication.service';
 import { AppConfigService } from '../../app-config/app-config.service';
 import { AuthGuardBase } from './auth-guard-base';
-import { MatDialog } from '@angular/material/dialog';
+import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog';
 import { StorageService } from '../../common/services/storage.service';
 import { BasicAlfrescoAuthService } from '../basic-auth/basic-alfresco-auth.service';
 import { OidcAuthenticationService } from '../oidc/oidc-authentication.service';

lib/core/src/lib/auth/guard/auth-guard-sso-role.service.ts

@@ -17,7 +17,7 @@
 
 import { Injectable } from '@angular/core';
 import { ActivatedRouteSnapshot, CanActivate, Router } from '@angular/router';
-import { MatDialog } from '@angular/material/dialog';
+import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog';
 import { UserAccessService } from '../services/user-access.service';
 
 @Injectable({

lib/core/src/lib/auth/guard/auth-guard.service.ts

@@ -21,7 +21,7 @@ import { AuthenticationService } from '../services/authentication.service';
 import { AppConfigService } from '../../app-config/app-config.service';
 import { AuthGuardBase } from './auth-guard-base';
 import { JwtHelperService } from '../services/jwt-helper.service';
-import { MatDialog } from '@angular/material/dialog';
+import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog';
 import { StorageService } from '../../common/services/storage.service';
 import { BasicAlfrescoAuthService } from '../basic-auth/basic-alfresco-auth.service';
 import { OidcAuthenticationService } from '../oidc/oidc-authentication.service';

lib/core/src/lib/card-view/card-view.module.ts

@@ -18,19 +18,19 @@
 import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
-import { MatButtonModule } from '@angular/material/button';
-import { MatCardModule } from '@angular/material/card';
-import { MatCheckboxModule } from '@angular/material/checkbox';
-import { MatChipsModule } from '@angular/material/chips';
+import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
+import { MatLegacyCardModule as MatCardModule } from '@angular/material/legacy-card';
+import { MatLegacyCheckboxModule as MatCheckboxModule } from '@angular/material/legacy-checkbox';
+import { MatLegacyChipsModule as MatChipsModule } from '@angular/material/legacy-chips';
 import { MatNativeDateModule } from '@angular/material/core';
 import { MatDatepickerModule } from '@angular/material/datepicker';
 import { MatIconModule } from '@angular/material/icon';
-import { MatInputModule } from '@angular/material/input';
-import { MatMenuModule } from '@angular/material/menu';
-import { MatSelectModule } from '@angular/material/select';
-import { MatSlideToggleModule } from '@angular/material/slide-toggle';
-import { MatTableModule } from '@angular/material/table';
-import { MatTooltipModule } from '@angular/material/tooltip';
+import { MatLegacyInputModule as MatInputModule } from '@angular/material/legacy-input';
+import { MatLegacyMenuModule as MatMenuModule } from '@angular/material/legacy-menu';
+import { MatLegacySelectModule as MatSelectModule } from '@angular/material/legacy-select';
+import { MatLegacySlideToggleModule as MatSlideToggleModule } from '@angular/material/legacy-slide-toggle';
+import { MatLegacyTableModule as MatTableModule } from '@angular/material/legacy-table';
+import { MatLegacyTooltipModule as MatTooltipModule } from '@angular/material/legacy-tooltip';
 import { MatDatetimepickerModule, MatNativeDatetimeModule } from '@mat-datetimepicker/core';
 import { TranslateModule } from '@ngx-translate/core';
 

lib/core/src/lib/card-view/components/card-view-arrayitem/card-view-arrayitem.component.spec.ts

@@ -24,8 +24,8 @@ import { By } from '@angular/platform-browser';
 import { CardViewUpdateService } from '../../services/card-view-update.service';
 import { HarnessLoader } from '@angular/cdk/testing';
 import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed';
-import { MatChipHarness, MatChipListHarness } from '@angular/material/chips/testing';
-import { MatButtonHarness } from '@angular/material/button/testing';
+import { MatLegacyChipHarness as MatChipHarness, MatLegacyChipListHarness as MatChipListHarness } from '@angular/material/legacy-chips/testing';
+import { MatLegacyButtonHarness as MatButtonHarness } from '@angular/material/legacy-button/testing';
 import { MatIconHarness } from '@angular/material/icon/testing';
 
 describe('CardViewArrayItemComponent', () => {

lib/core/src/lib/card-view/components/card-view-boolitem/card-view-boolitem.component.spec.ts

@@ -17,7 +17,7 @@
 
 import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { By } from '@angular/platform-browser';
-import { MatCheckbox, MatCheckboxChange } from '@angular/material/checkbox';
+import { MatLegacyCheckbox as MatCheckbox, MatLegacyCheckboxChange as MatCheckboxChange } from '@angular/material/legacy-checkbox';
 import { CardViewUpdateService } from '../../services/card-view-update.service';
 import { CardViewBoolItemComponent } from './card-view-boolitem.component';
 import { CardViewBoolItemModel } from '../../models/card-view-boolitem.model';

lib/core/src/lib/card-view/components/card-view-boolitem/card-view-boolitem.component.ts

@@ -15,7 +15,7 @@
  * limitations under the License.
  */
 
-import { Component } from '@angular/core';
+import { Component, Input } from '@angular/core';
 import { MatCheckboxChange } from '@angular/material/checkbox';
 import { CardViewBoolItemModel } from '../../models/card-view-boolitem.model';
 import { BaseCardView } from '../base-card-view';
@@ -33,6 +33,13 @@ import { BaseCardView } from '../base-card-view';
 })
 
 export class CardViewBoolItemComponent extends BaseCardView<CardViewBoolItemModel> {
+    @Input()
+    editable: boolean;
+
+    isEditable() {
+        return this.editable && this.property.editable;
+    }
+
     changed(change: MatCheckboxChange) {
         this.cardViewUpdateService.update({ ...this.property } as CardViewBoolItemModel, change.checked );
         this.property.value = change.checked;

lib/core/src/lib/card-view/components/card-view-dateitem/card-view-dateitem.component.spec.ts

@@ -28,7 +28,7 @@ import { AppConfigService } from '../../../app-config/app-config.service';
 import { MatDatetimepickerInputEvent } from '@mat-datetimepicker/core';
 import { HarnessLoader } from '@angular/cdk/testing';
 import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed';
-import { MatChipHarness } from '@angular/material/chips/testing';
+import { MatLegacyChipHarness as MatChipHarness } from '@angular/material/legacy-chips/testing';
 
 describe('CardViewDateItemComponent', () => {
     let loader: HarnessLoader;

lib/core/src/lib/card-view/components/card-view-keyvaluepairsitem/card-view-keyvaluepairsitem.component.ts

@@ -18,7 +18,7 @@
 import { Component, OnChanges, ViewEncapsulation } from '@angular/core';
 import { CardViewKeyValuePairsItemModel } from '../../models/card-view.models';
 import { CardViewKeyValuePairsItemType } from '../../interfaces/card-view.interfaces';
-import { MatTableDataSource } from '@angular/material/table';
+import { MatLegacyTableDataSource as MatTableDataSource } from '@angular/material/legacy-table';
 import { BaseCardView } from '../base-card-view';
 
 @Component({

lib/core/src/lib/card-view/components/card-view-selectitem/card-view-selectitem.component.ts

@@ -19,7 +19,7 @@ import { Component, Input, OnChanges, OnDestroy, OnInit, inject, ViewEncapsulati
 import { CardViewSelectItemModel } from '../../models/card-view-selectitem.model';
 import { BehaviorSubject, combineLatest, Observable } from 'rxjs';
 import { CardViewSelectItemOption } from '../../interfaces/card-view.interfaces';
-import { MatSelectChange } from '@angular/material/select';
+import { MatLegacySelectChange as MatSelectChange } from '@angular/material/legacy-select';
 import { BaseCardView } from '../base-card-view';
 import { AppConfigService } from '../../../app-config/app-config.service';
 import { takeUntil, map } from 'rxjs/operators';

lib/core/src/lib/card-view/components/card-view-selectitem/select-filter-input/select-filter-input.component.spec.ts

@@ -18,7 +18,7 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { CoreTestingModule } from '../../../../testing/core.testing.module';
 import { SelectFilterInputComponent } from './select-filter-input.component';
-import { MatSelect } from '@angular/material/select';
+import { MatLegacySelect as MatSelect } from '@angular/material/legacy-select';
 
 describe('SelectFilterInputComponent', () => {
     let fixture: ComponentFixture<SelectFilterInputComponent>;

lib/core/src/lib/card-view/components/card-view-selectitem/select-filter-input/select-filter-input.component.ts

@@ -16,7 +16,7 @@
  */
 
 import { Component, ViewEncapsulation, ViewChild, ElementRef, OnDestroy, Inject, Output, EventEmitter, OnInit } from '@angular/core';
-import { MatSelect } from '@angular/material/select';
+import { MatLegacySelect as MatSelect } from '@angular/material/legacy-select';
 import { Subject } from 'rxjs';
 import { takeUntil } from 'rxjs/operators';
 

lib/core/src/lib/card-view/components/card-view-textitem/card-view-textitem.component.ts

@@ -18,7 +18,7 @@
 import { ChangeDetectorRef, Component, Input, OnChanges, OnDestroy, SimpleChanges, ViewEncapsulation } from '@angular/core';
 import { CardViewTextItemModel } from '../../models/card-view-textitem.model';
 import { BaseCardView } from '../base-card-view';
-import { MatChipInputEvent } from '@angular/material/chips';
+import { MatLegacyChipInputEvent as MatChipInputEvent } from '@angular/material/legacy-chips';
 import { ClipboardService } from '../../../clipboard/clipboard.service';
 import { TranslationService } from '../../../translation/translation.service';
 import { CardViewItemValidator } from '../../interfaces/card-view-item-validator.interface';

lib/core/src/lib/card-view/components/card-view/card-view.component.spec.ts

@@ -28,7 +28,7 @@ import { CardViewItem } from '../../interfaces/card-view-item.interface';
 import { CardViewItemDispatcherComponent } from '../card-view-item-dispatcher/card-view-item-dispatcher.component';
 import { HarnessLoader } from '@angular/cdk/testing';
 import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed';
-import { MatSelectHarness } from '@angular/material/select/testing';
+import { MatLegacySelectHarness as MatSelectHarness } from '@angular/material/legacy-select/testing';
 
 describe('CardViewComponent', () => {
     let loader: HarnessLoader;

lib/core/src/lib/clipboard/clipboard.service.spec.ts

@@ -18,7 +18,7 @@
 import { NotificationService } from '../notifications/services/notification.service';
 import { TestBed } from '@angular/core/testing';
 import { ClipboardService } from './clipboard.service';
-import { MatSnackBarModule } from '@angular/material/snack-bar';
+import { MatLegacySnackBarModule as MatSnackBarModule } from '@angular/material/legacy-snack-bar';
 import { CoreTestingModule } from '../testing';
 
 describe('ClipboardService', () => {

lib/core/src/lib/comments/comment-list/comment-list.module.ts

@@ -18,10 +18,10 @@
 import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
 import { TranslateModule } from '@ngx-translate/core';
-import { MatButtonModule } from '@angular/material/button';
-import { MatFormFieldModule } from '@angular/material/form-field';
-import { MatInputModule } from '@angular/material/input';
-import { MatListModule } from '@angular/material/list';
+import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
+import { MatLegacyFormFieldModule as MatFormFieldModule } from '@angular/material/legacy-form-field';
+import { MatLegacyInputModule as MatInputModule } from '@angular/material/legacy-input';
+import { MatLegacyListModule as MatListModule } from '@angular/material/legacy-list';
 import { MatLineModule } from '@angular/material/core';
 import { FormsModule } from '@angular/forms';
 import { PipeModule } from '../../pipes/pipe.module';

lib/core/src/lib/comments/comments.module.ts

@@ -18,10 +18,10 @@
 import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
 import { TranslateModule } from '@ngx-translate/core';
-import { MatButtonModule } from '@angular/material/button';
-import { MatFormFieldModule } from '@angular/material/form-field';
-import { MatInputModule } from '@angular/material/input';
-import { MatListModule } from '@angular/material/list';
+import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
+import { MatLegacyFormFieldModule as MatFormFieldModule } from '@angular/material/legacy-form-field';
+import { MatLegacyInputModule as MatInputModule } from '@angular/material/legacy-input';
+import { MatLegacyListModule as MatListModule } from '@angular/material/legacy-list';
 import { MatLineModule } from '@angular/material/core';
 import { FormsModule } from '@angular/forms';
 import { PipeModule } from '../pipes/pipe.module';

lib/core/src/lib/core.module.ts

@@ -55,7 +55,7 @@ import { AdfHttpClient } from '@alfresco/adf-core/api';
 import { AuthenticationInterceptor, Authentication } from '@alfresco/adf-core/auth';
 import { HttpClientModule, HttpClientXsrfModule, HTTP_INTERCEPTORS } from '@angular/common/http';
 import { AuthenticationService } from './auth/services/authentication.service';
-import { MAT_SNACK_BAR_DEFAULT_OPTIONS } from '@angular/material/snack-bar';
+import { MAT_LEGACY_SNACK_BAR_DEFAULT_OPTIONS as MAT_SNACK_BAR_DEFAULT_OPTIONS } from '@angular/material/legacy-snack-bar';
 import { IdentityUserInfoModule } from './identity-user-info/identity-user-info.module';
 import { loadAppConfig } from './app-config/app-config.loader';
 import { AppConfigService } from './app-config/app-config.service';

lib/core/src/lib/dialogs/edit-json/edit-json.dialog.module.ts

@@ -20,8 +20,8 @@ import { EditJsonDialogComponent } from './edit-json.dialog';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { CommonModule } from '@angular/common';
 import { TranslateModule } from '@ngx-translate/core';
-import { MatDialogModule } from '@angular/material/dialog';
-import { MatButtonModule } from '@angular/material/button';
+import { MatLegacyDialogModule as MatDialogModule } from '@angular/material/legacy-dialog';
+import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
 @NgModule({
     declarations: [EditJsonDialogComponent],
     imports: [

lib/core/src/lib/dialogs/edit-json/edit-json.dialog.stories.component.ts

@@ -16,7 +16,7 @@
  */
 
 import { Component, OnInit, OnChanges, Input } from '@angular/core';
-import { MatDialog } from '@angular/material/dialog';
+import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog';
 import {
     EditJsonDialogComponent,
     EditJsonDialogSettings

lib/core/src/lib/dialogs/edit-json/edit-json.dialog.stories.ts

@@ -19,7 +19,7 @@ import { Meta, moduleMetadata, Story } from '@storybook/angular';
 import { CoreStoryModule } from '../../testing/core.story.module';
 import { EditJsonDialogModule } from './edit-json.dialog.module';
 import { EditJsonDialogStorybookComponent } from './edit-json.dialog.stories.component';
-import { MatButtonModule } from '@angular/material/button';
+import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
 
 const jsonData = {
     maxValue: 50,

lib/core/src/lib/dialogs/edit-json/edit-json.dialog.ts

@@ -16,7 +16,7 @@
  */
 
 import { Component, Inject, OnInit, Input, ViewEncapsulation } from '@angular/core';
-import { MAT_DIALOG_DATA } from '@angular/material/dialog';
+import { MAT_LEGACY_DIALOG_DATA as MAT_DIALOG_DATA } from '@angular/material/legacy-dialog';
 
 export interface EditJsonDialogSettings {
     title?: string;

lib/core/src/lib/directives/infinite-select-scroll.directive.spec.ts

@@ -53,8 +53,14 @@ describe('InfiniteSelectScrollDirective', () => {
 
     beforeEach(() => {
         TestBed.configureTestingModule({
-            imports: [MatSelectModule, NoopAnimationsModule, InfiniteSelectScrollDirective],
-            declarations: [TestComponent]
+            imports: [
+                MatSelectModule,
+                NoopAnimationsModule
+            ],
+            declarations: [
+                TestComponent,
+                InfiniteSelectScrollDirective
+            ]
         });
         fixture = TestBed.createComponent(TestComponent);
         component = fixture.componentInstance;

lib/core/src/lib/directives/infinite-select-scroll.directive.ts

@@ -16,7 +16,7 @@
  */
 
 import { Inject, AfterViewInit, Directive, EventEmitter, OnDestroy, Output } from '@angular/core';
-import { MatSelect } from '@angular/material/select';
+import { MatLegacySelect as MatSelect } from '@angular/material/legacy-select';
 import { Subject } from 'rxjs';
 import { takeUntil } from 'rxjs/operators';
 

lib/core/src/lib/form/components/widgets/json/json.widget.ts

@@ -18,7 +18,7 @@
 import { Component, ViewEncapsulation } from '@angular/core';
 import { MatButtonModule } from '@angular/material/button';
 import { MatDialog } from '@angular/material/dialog';
-import { EditJsonDialogComponent, EditJsonDialogSettings } from '../../../../dialogs';
+import { EditJsonDialogSettings, EditJsonDialogComponent } from '../../../../dialogs/edit-json/edit-json.dialog';
 import { FormService } from '../../../services/form.service';
 import { WidgetComponent } from '../widget.component';
 

lib/core/src/lib/form/components/widgets/text/text.widget.spec.ts

@@ -22,13 +22,13 @@ import { FormModel } from '../core/form.model';
 import { TextWidgetComponent } from './text.widget';
 import { FormsModule } from '@angular/forms';
 import { MatIconModule } from '@angular/material/icon';
-import { MatInputModule } from '@angular/material/input';
+import { MatLegacyInputModule as MatInputModule } from '@angular/material/legacy-input';
 import { CoreTestingModule } from '../../../../testing';
 import { HarnessLoader } from '@angular/cdk/testing';
 import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed';
-import { MatInputHarness } from '@angular/material/input/testing';
-import { MatFormFieldHarness } from '@angular/material/form-field/testing';
-import { MatTooltipHarness } from '@angular/material/tooltip/testing';
+import { MatLegacyInputHarness as MatInputHarness } from '@angular/material/legacy-input/testing';
+import { MatLegacyFormFieldHarness as MatFormFieldHarness } from '@angular/material/legacy-form-field/testing';
+import { MatLegacyTooltipHarness as MatTooltipHarness } from '@angular/material/legacy-tooltip/testing';
 
 describe('TextWidgetComponent', () => {
     const form = new FormModel({ taskId: 'fake-task-id' });

lib/core/src/lib/identity-user-info/identity-user-info.component.spec.ts

@@ -18,7 +18,7 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { IdentityUserInfoComponent } from './identity-user-info.component';
 import { CoreTestingModule } from '../testing/core.testing.module';
-import { MatMenuModule } from '@angular/material/menu';
+import { MatLegacyMenuModule as MatMenuModule } from '@angular/material/legacy-menu';
 import { By } from '@angular/platform-browser';
 import { IdentityUserModel } from '../auth/models/identity-user.model';
 

lib/core/src/lib/identity-user-info/identity-user-info.component.ts

@@ -16,7 +16,7 @@
  */
 
 import { Component, Input, OnDestroy, ViewChild, ViewEncapsulation } from '@angular/core';
-import { MatMenuTrigger, MenuPositionX, MenuPositionY } from '@angular/material/menu';
+import { MatLegacyMenuTrigger as MatMenuTrigger, LegacyMenuPositionX as MenuPositionX, LegacyMenuPositionY as MenuPositionY } from '@angular/material/legacy-menu';
 import { IdentityUserModel } from '../auth/models/identity-user.model';
 import { Subject } from 'rxjs';
 

lib/core/src/lib/identity-user-info/identity-user-info.module.ts

@@ -18,10 +18,10 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { IdentityUserInfoComponent } from './identity-user-info.component';
-import { MatButtonModule } from '@angular/material/button';
-import { MatCardModule } from '@angular/material/card';
-import { MatMenuModule } from '@angular/material/menu';
-import { MatTabsModule } from '@angular/material/tabs';
+import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
+import { MatLegacyCardModule as MatCardModule } from '@angular/material/legacy-card';
+import { MatLegacyMenuModule as MatMenuModule } from '@angular/material/legacy-menu';
+import { MatLegacyTabsModule as MatTabsModule } from '@angular/material/legacy-tabs';
 import { TranslateModule } from '@ngx-translate/core';
 import { PipeModule } from '../pipes/pipe.module';
 import { FullNamePipe, InitialUsernamePipe } from '../pipes';

lib/core/src/lib/info-drawer/info-drawer.component.spec.ts

@@ -17,7 +17,7 @@
 
 import { Component } from '@angular/core';
 import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { MatTabChangeEvent } from '@angular/material/tabs';
+import { MatLegacyTabChangeEvent as MatTabChangeEvent } from '@angular/material/legacy-tabs';
 import { By } from '@angular/platform-browser';
 import { InfoDrawerComponent } from './info-drawer.component';
 import { of } from 'rxjs';

lib/core/src/lib/language-menu/language-menu.module.ts

@@ -19,9 +19,9 @@ import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
 import { TranslateModule } from '@ngx-translate/core';
 
-import { MatMenuModule } from '@angular/material/menu';
+import { MatLegacyMenuModule as MatMenuModule } from '@angular/material/legacy-menu';
 import { MatIconModule } from '@angular/material/icon';
-import { MatButtonModule } from '@angular/material/button';
+import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
 
 import { LanguageMenuComponent } from './language-menu.component';
 import { LanguagePickerComponent } from './language-picker.component';

lib/core/src/lib/layout/components/sidenav-layout/sidenav-layout.component.stories.ts

@@ -19,7 +19,7 @@ import { Meta, moduleMetadata, Story } from '@storybook/angular';
 import { CoreStoryModule } from '../../../testing/core.story.module';
 import { SidenavLayoutModule } from '../../layout.module';
 import { SidenavLayoutComponent } from './sidenav-layout.component';
-import { MatListModule } from '@angular/material/list';
+import { MatLegacyListModule as MatListModule } from '@angular/material/legacy-list';
 import { MatIconModule } from '@angular/material/icon';
 import { RouterTestingModule } from '@angular/router/testing';
 

lib/core/src/lib/material.module.ts

@@ -18,31 +18,32 @@
 import { NgModule } from '@angular/core';
 import { MatDatetimepickerModule, MatNativeDatetimeModule } from '@mat-datetimepicker/core';
 
-import { MatAutocompleteModule } from '@angular/material/autocomplete';
-import { MatButtonModule } from '@angular/material/button';
-import { MatCardModule } from '@angular/material/card';
-import { MatCheckboxModule } from '@angular/material/checkbox';
-import { MatChipsModule } from '@angular/material/chips';
-import { MatNativeDateModule, MatOptionModule, MatRippleModule } from '@angular/material/core';
+import { MatLegacyAutocompleteModule as MatAutocompleteModule } from '@angular/material/legacy-autocomplete';
+import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
+import { MatLegacyCardModule as MatCardModule } from '@angular/material/legacy-card';
+import { MatLegacyCheckboxModule as MatCheckboxModule } from '@angular/material/legacy-checkbox';
+import { MatLegacyChipsModule as MatChipsModule } from '@angular/material/legacy-chips';
+import { MatNativeDateModule, MatRippleModule } from '@angular/material/core';
+import { MatLegacyOptionModule as MatOptionModule } from '@angular/material/legacy-core';
 import { MatDatepickerModule } from '@angular/material/datepicker';
-import { MatDialogModule } from '@angular/material/dialog';
+import { MatLegacyDialogModule as MatDialogModule } from '@angular/material/legacy-dialog';
 import { MatExpansionModule } from '@angular/material/expansion';
 import { MatGridListModule } from '@angular/material/grid-list';
 import { MatIconModule } from '@angular/material/icon';
-import { MatInputModule } from '@angular/material/input';
-import { MatListModule } from '@angular/material/list';
-import { MatMenuModule } from '@angular/material/menu';
-import { MatProgressBarModule } from '@angular/material/progress-bar';
-import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
-import { MatRadioModule } from '@angular/material/radio';
-import { MatSelectModule } from '@angular/material/select';
+import { MatLegacyInputModule as MatInputModule } from '@angular/material/legacy-input';
+import { MatLegacyListModule as MatListModule } from '@angular/material/legacy-list';
+import { MatLegacyMenuModule as MatMenuModule } from '@angular/material/legacy-menu';
+import { MatLegacyProgressBarModule as MatProgressBarModule } from '@angular/material/legacy-progress-bar';
+import { MatLegacyProgressSpinnerModule as MatProgressSpinnerModule } from '@angular/material/legacy-progress-spinner';
+import { MatLegacyRadioModule as MatRadioModule } from '@angular/material/legacy-radio';
+import { MatLegacySelectModule as MatSelectModule } from '@angular/material/legacy-select';
 import { MatSidenavModule } from '@angular/material/sidenav';
-import { MatSlideToggleModule } from '@angular/material/slide-toggle';
-import { MatSnackBarModule } from '@angular/material/snack-bar';
-import { MatTableModule } from '@angular/material/table';
-import { MatTabsModule } from '@angular/material/tabs';
+import { MatLegacySlideToggleModule as MatSlideToggleModule } from '@angular/material/legacy-slide-toggle';
+import { MatLegacySnackBarModule as MatSnackBarModule } from '@angular/material/legacy-snack-bar';
+import { MatLegacyTableModule as MatTableModule } from '@angular/material/legacy-table';
+import { MatLegacyTabsModule as MatTabsModule } from '@angular/material/legacy-tabs';
 import { MatToolbarModule } from '@angular/material/toolbar';
-import { MatTooltipModule } from '@angular/material/tooltip';
+import { MatLegacyTooltipModule as MatTooltipModule } from '@angular/material/legacy-tooltip';
 import { MatBadgeModule } from '@angular/material/badge';
 
 @NgModule({

lib/core/src/lib/notifications/services/notification.service.spec.ts

@@ -17,14 +17,14 @@
 
 import { Component } from '@angular/core';
 import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { MatSnackBarConfig, MatSnackBarModule } from '@angular/material/snack-bar';
+import { MatLegacySnackBarConfig as MatSnackBarConfig, MatLegacySnackBarModule as MatSnackBarModule } from '@angular/material/legacy-snack-bar';
 import { NotificationService } from './notification.service';
 import { TranslationService } from '../../translation/translation.service';
 import { CoreTestingModule } from '../../testing/core.testing.module';
 import { HarnessLoader } from '@angular/cdk/testing';
 import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed';
 import { MatIconHarness } from '@angular/material/icon/testing';
-import { MatSnackBarHarness } from '@angular/material/snack-bar/testing';
+import { MatLegacySnackBarHarness as MatSnackBarHarness } from '@angular/material/legacy-snack-bar/testing';
 
 @Component({
     template: '',

lib/core/src/lib/notifications/services/notification.service.ts

@@ -16,7 +16,7 @@
  */
 
 import { Injectable } from '@angular/core';
-import { MatSnackBar, MatSnackBarRef, MatSnackBarConfig } from '@angular/material/snack-bar';
+import { MatLegacySnackBar as MatSnackBar, MatLegacySnackBarRef as MatSnackBarRef, MatLegacySnackBarConfig as MatSnackBarConfig } from '@angular/material/legacy-snack-bar';
 import { TranslationService } from '../../translation/translation.service';
 import { Subject } from 'rxjs';
 import { NotificationModel } from '../models/notification.model';

lib/core/src/lib/snackbar-content/snackbar-content.component.spec.ts

@@ -17,8 +17,8 @@
 
 import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { MatIcon, MatIconModule } from '@angular/material/icon';
-import { MAT_SNACK_BAR_DATA, MatSnackBarModule, MatSnackBarRef } from '@angular/material/snack-bar';
-import { MatButtonModule } from '@angular/material/button';
+import { MAT_LEGACY_SNACK_BAR_DATA as MAT_SNACK_BAR_DATA, MatLegacySnackBarModule as MatSnackBarModule, MatLegacySnackBarRef as MatSnackBarRef } from '@angular/material/legacy-snack-bar';
+import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
 import { By } from '@angular/platform-browser';
 import { SnackbarContentComponent } from './snackbar-content.component';
 import { CoreTestingModule } from '@alfresco/adf-core';

lib/core/src/lib/snackbar-content/snackbar-content.component.ts

@@ -16,7 +16,7 @@
  */
 
 import { Component, Inject } from '@angular/core';
-import { MAT_SNACK_BAR_DATA, MatSnackBarRef } from '@angular/material/snack-bar';
+import { MAT_LEGACY_SNACK_BAR_DATA as MAT_SNACK_BAR_DATA, MatLegacySnackBarRef as MatSnackBarRef } from '@angular/material/legacy-snack-bar';
 import { SnackBarData } from './snack-bar-data';
 
 @Component({

lib/core/src/lib/snackbar-content/snackbar-content.module.ts

@@ -19,8 +19,8 @@ import { NgModule } from '@angular/core';
 import { MatIconModule } from '@angular/material/icon';
 import { CommonModule } from '@angular/common';
 import { SnackbarContentComponent } from './snackbar-content.component';
-import { MatSnackBarModule } from '@angular/material/snack-bar';
-import { MatButtonModule } from '@angular/material/button';
+import { MatLegacySnackBarModule as MatSnackBarModule } from '@angular/material/legacy-snack-bar';
+import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
 import { TranslateModule } from '@ngx-translate/core';
 
 @NgModule({

lib/core/src/lib/sorting-picker/sorting-picker.component.ts

@@ -16,7 +16,7 @@
  */
 
 import { Component, ViewEncapsulation, Input, EventEmitter, Output } from '@angular/core';
-import { MatSelectChange } from '@angular/material/select';
+import { MatLegacySelectChange as MatSelectChange } from '@angular/material/legacy-select';
 
 @Component({
     selector: 'adf-sorting-picker',

lib/core/src/lib/sorting-picker/sorting-picker.module.ts

@@ -20,8 +20,8 @@ import { NgModule } from '@angular/core';
 import { TranslateModule } from '@ngx-translate/core';
 import { SortingPickerComponent } from './sorting-picker.component';
 import { MatIconModule } from '@angular/material/icon';
-import { MatButtonModule } from '@angular/material/button';
-import { MatSelectModule } from '@angular/material/select';
+import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
+import { MatLegacySelectModule as MatSelectModule } from '@angular/material/legacy-select';
 
 @NgModule({
     imports: [

lib/core/src/lib/styles/_typography.scss

@@ -1,6 +1,6 @@
 @use '@angular/material' as mat;
 
-$alfresco-typography: mat.define-typography-config(
+$alfresco-typography: mat.define-legacy-typography-config(
     $font-family: 'Muli, Roboto, "Helvetica Neue", sans-serif',
     $display-4:     mat.define-typography-level(112px, 112px, 300),
     $display-3:     mat.define-typography-level(56px, 56px, 400),

lib/core/src/lib/styles/prebuilt/adf-blue-orange.scss

@@ -1,7 +1,16 @@
 @use '@angular/material' as mat;
 @import '../theming';
 @import './all-theme';
-@include mat.core;
+// TODO(v15): As of v15 mat.legacy-core no longer includes default typography styles.
+//  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();
 
 $primary: mat.define-palette($alfresco-ecm-blue);
 $accent: mat.define-palette($alfresco-accent-orange);
@@ -16,5 +25,5 @@ $theme: mat.define-light-theme(
     )
 );
 
-@include mat.all-component-themes($theme);
+@include mat.all-legacy-component-themes($theme);
 @include alfresco-material-theme($theme);

lib/core/src/lib/styles/prebuilt/adf-blue-purple.scss

@@ -1,7 +1,16 @@
 @use '@angular/material' as mat;
 @import '../theming';
 @import './all-theme';
-@include mat.core;
+// TODO(v15): As of v15 mat.legacy-core no longer includes default typography styles.
+//  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();
 
 $primary: mat.define-palette(mat.$pink-palette, 700, 500, 900);
 $accent: mat.define-palette($alfresco-accent-purple);
@@ -16,5 +25,5 @@ $theme: mat.define-light-theme(
     )
 );
 
-@include mat.all-component-themes($theme);
+@include mat.all-legacy-component-themes($theme);
 @include alfresco-material-theme($theme);

lib/core/src/lib/styles/prebuilt/adf-cyan-orange.scss

@@ -1,7 +1,16 @@
 @use '@angular/material' as mat;
 @import '../theming';
 @import './all-theme';
-@include mat.core;
+// TODO(v15): As of v15 mat.legacy-core no longer includes default typography styles.
+//  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();
 
 $primary: mat.define-palette($alfresco-ecm-cyan);
 $accent: mat.define-palette($alfresco-accent-orange);
@@ -16,5 +25,5 @@ $theme: mat.define-light-theme(
     )
 );
 
-@include mat.all-component-themes($theme);
+@include mat.all-legacy-component-themes($theme);
 @include alfresco-material-theme($theme);

lib/core/src/lib/styles/prebuilt/adf-cyan-purple.scss

@@ -1,7 +1,16 @@
 @use '@angular/material' as mat;
 @import '../theming';
 @import './all-theme';
-@include mat.core;
+// TODO(v15): As of v15 mat.legacy-core no longer includes default typography styles.
+//  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();
 
 $primary: mat.define-palette($alfresco-ecm-cyan);
 $accent: mat.define-palette($alfresco-accent-purple);
@@ -16,5 +25,5 @@ $theme: mat.define-light-theme(
     )
 );
 
-@include mat.all-component-themes($theme);
+@include mat.all-legacy-component-themes($theme);
 @include alfresco-material-theme($theme);

lib/core/src/lib/styles/prebuilt/adf-green-orange.scss

@@ -1,7 +1,16 @@
 @use '@angular/material' as mat;
 @import '../theming';
 @import './all-theme';
-@include mat.core;
+// TODO(v15): As of v15 mat.legacy-core no longer includes default typography styles.
+//  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();
 
 $primary: mat.define-palette($alfresco-bpm-green);
 $accent: mat.define-palette($alfresco-accent-orange);
@@ -16,5 +25,5 @@ $theme: mat.define-light-theme(
     )
 );
 
-@include mat.all-component-themes($theme);
+@include mat.all-legacy-component-themes($theme);
 @include alfresco-material-theme($theme);

lib/core/src/lib/styles/prebuilt/adf-green-purple.scss

@@ -1,7 +1,16 @@
 @use '@angular/material' as mat;
 @import '../theming';
 @import './all-theme';
-@include mat.core;
+// TODO(v15): As of v15 mat.legacy-core no longer includes default typography styles.
+//  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();
 
 $primary: mat.define-palette($alfresco-bpm-green);
 $accent: mat.define-palette($alfresco-accent-purple);
@@ -16,5 +25,5 @@ $theme: mat.define-light-theme(
     )
 );
 
-@include mat.all-component-themes($theme);
+@include mat.all-legacy-component-themes($theme);
 @include alfresco-material-theme($theme);

lib/core/src/lib/styles/prebuilt/adf-indigo-pink.scss

@@ -2,7 +2,16 @@
 @use '@angular/material' as mat;
 @import '../theming';
 @import './all-theme';
-@include mat.core;
+// TODO(v15): As of v15 mat.legacy-core no longer includes default typography styles.
+//  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();
 
 $primary: mat.define-palette(mat.$indigo-palette);
 $accent: mat.define-palette(mat.$pink-palette, A200, A100, A400);
@@ -17,5 +26,5 @@ $theme: mat.define-light-theme(
     )
 );
 
-@include mat.all-component-themes($theme);
+@include mat.all-legacy-component-themes($theme);
 @include alfresco-material-theme($theme);

lib/core/src/lib/styles/prebuilt/adf-pink-bluegrey.scss

@@ -2,7 +2,16 @@
 @use '@angular/material' as mat;
 @import '../theming';
 @import './all-theme';
-@include mat.core;
+// TODO(v15): As of v15 mat.legacy-core no longer includes default typography styles.
+//  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();
 
 $primary: mat.define-palette(mat.$pink-palette, 700, 500, 900);
 $accent: mat.define-palette(mat.$blue-grey-palette, A200, A100, A400);
@@ -17,5 +26,5 @@ $theme: mat.define-dark-theme(
     )
 );
 
-@include mat.all-component-themes($theme);
+@include mat.all-legacy-component-themes($theme);
 @include alfresco-material-theme($theme);

lib/core/src/lib/styles/prebuilt/adf-purple-green.scss

@@ -2,7 +2,16 @@
 @use '@angular/material' as mat;
 @import '../theming';
 @import './all-theme';
-@include mat.core;
+// TODO(v15): As of v15 mat.legacy-core no longer includes default typography styles.
+//  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();
 
 $primary: mat.define-palette(mat.$purple-palette, 700, 500, 800);
 $accent: mat.define-palette(mat.$green-palette, A200, A100, A400);
@@ -17,5 +26,5 @@ $theme: mat.define-dark-theme(
     )
 );
 
-@include mat.all-component-themes($theme);
+@include mat.all-legacy-component-themes($theme);
 @include alfresco-material-theme($theme);

lib/core/src/lib/templates/template.module.ts

@@ -18,6 +18,8 @@
 import { NgModule } from '@angular/core';
 import { ErrorContentComponent } from './error-content/error-content.component';
 import { EmptyContentComponent } from './empty-content/empty-content.component';
+import { IconModule } from '../icon/icon.module';
+import { MatButtonModule } from '@angular/material/button';
 
 /**
  * @deprecated this Module is deprecated and should no longer be used.