chore: switch dev-app to secondary entry-points (angular#15983)

Since the primary entry-point @angular/material is now deprecated
with V8, we should no longer use the deprecated entry-point in
our dev-app.

Author: devversion

src/dev-app/autocomplete/autocomplete-demo-module.ts

@@ -9,13 +9,11 @@
 import {CommonModule} from '@angular/common';
 import {NgModule} from '@angular/core';
 import {FormsModule, ReactiveFormsModule} from '@angular/forms';
-import {
-  MatAutocompleteModule,
-  MatButtonModule,
-  MatCardModule,
-  MatFormFieldModule,
-  MatInputModule
-} from '@angular/material';
+import {MatAutocompleteModule} from '@angular/material/autocomplete';
+import {MatButtonModule} from '@angular/material/button';
+import {MatCardModule} from '@angular/material/card';
+import {MatFormFieldModule} from '@angular/material/form-field';
+import {MatInputModule} from '@angular/material/input';
 import {RouterModule} from '@angular/router';
 import {AutocompleteDemo} from './autocomplete-demo';
 

src/dev-app/badge/badge-demo-module.ts

@@ -9,7 +9,9 @@
 import {CommonModule} from '@angular/common';
 import {NgModule} from '@angular/core';
 import {FormsModule} from '@angular/forms';
-import {MatBadgeModule, MatButtonModule, MatIconModule} from '@angular/material';
+import {MatBadgeModule} from '@angular/material/badge';
+import {MatButtonModule} from '@angular/material/button';
+import {MatIconModule} from '@angular/material/icon';
 import {RouterModule} from '@angular/router';
 import {BadgeDemo} from './badge-demo';
 

src/dev-app/baseline/baseline-demo-module.ts

@@ -8,15 +8,13 @@
 
 import {CommonModule} from '@angular/common';
 import {NgModule} from '@angular/core';
-import {
-  MatCardModule,
-  MatCheckboxModule,
-  MatFormFieldModule,
-  MatInputModule,
-  MatRadioModule,
-  MatSelectModule,
-  MatToolbarModule
-} from '@angular/material';
+import {MatCardModule} from '@angular/material/card';
+import {MatCheckboxModule} from '@angular/material/checkbox';
+import {MatFormFieldModule} from '@angular/material/form-field';
+import {MatInputModule} from '@angular/material/input';
+import {MatRadioModule} from '@angular/material/radio';
+import {MatSelectModule} from '@angular/material/select';
+import {MatToolbarModule} from '@angular/material/toolbar';
 import {RouterModule} from '@angular/router';
 import {BaselineDemo} from './baseline-demo';
 

src/dev-app/bottom-sheet/bottom-sheet-demo-module.ts

@@ -9,17 +9,15 @@
 import {CommonModule} from '@angular/common';
 import {NgModule} from '@angular/core';
 import {FormsModule} from '@angular/forms';
-import {
-  MatBottomSheetModule,
-  MatButtonModule,
-  MatCardModule,
-  MatCheckboxModule,
-  MatFormFieldModule,
-  MatIconModule,
-  MatInputModule,
-  MatListModule,
-  MatSelectModule
-} from '@angular/material';
+import {MatBottomSheetModule} from '@angular/material/bottom-sheet';
+import {MatButtonModule} from '@angular/material/button';
+import {MatCardModule} from '@angular/material/card';
+import {MatCheckboxModule} from '@angular/material/checkbox';
+import {MatFormFieldModule} from '@angular/material/form-field';
+import {MatIconModule} from '@angular/material/icon';
+import {MatInputModule} from '@angular/material/input';
+import {MatListModule} from '@angular/material/list';
+import {MatSelectModule} from '@angular/material/select';
 import {RouterModule} from '@angular/router';
 import {BottomSheetDemo, ExampleBottomSheet} from './bottom-sheet-demo';
 

src/dev-app/button-toggle/button-toggle-demo-module.ts

@@ -9,7 +9,9 @@
 import {CommonModule} from '@angular/common';
 import {NgModule} from '@angular/core';
 import {FormsModule} from '@angular/forms';
-import {MatButtonToggleModule, MatCheckboxModule, MatIconModule} from '@angular/material';
+import {MatButtonToggleModule} from '@angular/material/button-toggle';
+import {MatCheckboxModule} from '@angular/material/checkbox';
+import {MatIconModule} from '@angular/material/icon';
 import {RouterModule} from '@angular/router';
 import {ButtonToggleDemo} from './button-toggle-demo';
 

src/dev-app/button/button-demo-module.ts

@@ -7,7 +7,8 @@
  */
 
 import {NgModule} from '@angular/core';
-import {MatButtonModule, MatIconModule} from '@angular/material';
+import {MatButtonModule} from '@angular/material/button';
+import {MatIconModule} from '@angular/material/icon';
 import {RouterModule} from '@angular/router';
 import {ButtonDemo} from './button-demo';
 

src/dev-app/card/card-demo-module.ts

@@ -7,12 +7,10 @@
  */
 
 import {NgModule} from '@angular/core';
-import {
-  MatButtonModule,
-  MatCardModule,
-  MatDividerModule,
-  MatProgressBarModule
-} from '@angular/material';
+import {MatButtonModule} from '@angular/material/button';
+import {MatCardModule} from '@angular/material/card';
+import {MatDividerModule} from '@angular/material/divider';
+import {MatProgressBarModule} from '@angular/material/progress-bar';
 import {RouterModule} from '@angular/router';
 import {CardDemo} from './card-demo';
 

src/dev-app/checkbox/checkbox-demo-module.ts

@@ -9,13 +9,11 @@
 import {CommonModule} from '@angular/common';
 import {NgModule} from '@angular/core';
 import {FormsModule, ReactiveFormsModule} from '@angular/forms';
-import {
-  MatCheckboxModule,
-  MatFormFieldModule,
-  MatInputModule,
-  MatPseudoCheckboxModule,
-  MatSelectModule
-} from '@angular/material';
+import {MatCheckboxModule} from '@angular/material/checkbox';
+import {MatPseudoCheckboxModule} from '@angular/material/core';
+import {MatFormFieldModule} from '@angular/material/form-field';
+import {MatInputModule} from '@angular/material/input';
+import {MatSelectModule} from '@angular/material/select';
 import {RouterModule} from '@angular/router';
 import {
   AnimationsNoop,

src/dev-app/checkbox/checkbox-demo.ts

@@ -7,7 +7,7 @@
  */
 
 import {Component, Directive} from '@angular/core';
-import {MAT_CHECKBOX_CLICK_ACTION} from '@angular/material';
+import {MAT_CHECKBOX_CLICK_ACTION} from '@angular/material/checkbox';
 import {ANIMATION_MODULE_TYPE} from '@angular/platform-browser/animations';
 
 

src/dev-app/chips/chips-demo-module.ts

@@ -9,15 +9,13 @@
 import {CommonModule} from '@angular/common';
 import {NgModule} from '@angular/core';
 import {FormsModule} from '@angular/forms';
-import {
-  MatButtonModule,
-  MatCardModule,
-  MatCheckboxModule,
-  MatChipsModule,
-  MatFormFieldModule,
-  MatIconModule,
-  MatToolbarModule
-} from '@angular/material';
+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 {MatFormFieldModule} from '@angular/material/form-field';
+import {MatIconModule} from '@angular/material/icon';
+import {MatToolbarModule} from '@angular/material/toolbar';
 import {RouterModule} from '@angular/router';
 import {ChipsDemo} from './chips-demo';
 

src/dev-app/chips/chips-demo.ts

@@ -8,7 +8,8 @@
 
 import {COMMA, ENTER} from '@angular/cdk/keycodes';
 import {Component} from '@angular/core';
-import {MatChipInputEvent, ThemePalette} from '@angular/material';
+import {MatChipInputEvent} from '@angular/material/chips';
+import {ThemePalette} from '@angular/material/core';
 
 
 export interface Person {

src/dev-app/connected-overlay/connected-overlay-demo-module.ts

@@ -10,7 +10,9 @@ import {OverlayModule} from '@angular/cdk/overlay';
 import {CommonModule} from '@angular/common';
 import {NgModule} from '@angular/core';
 import {FormsModule} from '@angular/forms';
-import {MatButtonModule, MatCheckboxModule, MatRadioModule} from '@angular/material';
+import {MatButtonModule} from '@angular/material/button';
+import {MatCheckboxModule} from '@angular/material/checkbox';
+import {MatRadioModule} from '@angular/material/radio';
 import {RouterModule} from '@angular/router';
 import {ConnectedOverlayDemo} from './connected-overlay-demo';
 

src/dev-app/datepicker/datepicker-demo-module.ts

@@ -9,16 +9,14 @@
 import {CommonModule} from '@angular/common';
 import {NgModule} from '@angular/core';
 import {FormsModule, ReactiveFormsModule} from '@angular/forms';
-import {
-  MatButtonModule,
-  MatCheckboxModule,
-  MatDatepickerModule,
-  MatFormFieldModule,
-  MatIconModule,
-  MatInputModule,
-  MatNativeDateModule,
-  MatSelectModule
-} from '@angular/material';
+import {MatButtonModule} from '@angular/material/button';
+import {MatCheckboxModule} from '@angular/material/checkbox';
+import {MatNativeDateModule} from '@angular/material/core';
+import {MatDatepickerModule} from '@angular/material/datepicker';
+import {MatFormFieldModule} from '@angular/material/form-field';
+import {MatIconModule} from '@angular/material/icon';
+import {MatInputModule} from '@angular/material/input';
+import {MatSelectModule} from '@angular/material/select';
 import {RouterModule} from '@angular/router';
 import {CustomHeader, CustomHeaderNgContent, DatepickerDemo} from './datepicker-demo';
 

src/dev-app/datepicker/datepicker-demo.ts

@@ -11,14 +11,17 @@ import {
   ChangeDetectorRef,
   Component,
   Inject,
-  ViewChild,
+  OnDestroy,
   Optional,
-  OnDestroy
+  ViewChild
 } from '@angular/core';
 import {FormControl} from '@angular/forms';
-import {MatCalendar, MatCalendarHeader} from '@angular/material';
 import {DateAdapter, MAT_DATE_FORMATS, MatDateFormats, ThemePalette} from '@angular/material/core';
-import {MatDatepickerInputEvent} from '@angular/material/datepicker';
+import {
+  MatCalendar,
+  MatCalendarHeader,
+  MatDatepickerInputEvent
+} from '@angular/material/datepicker';
 import {Subject} from 'rxjs';
 import {takeUntil} from 'rxjs/operators';
 

src/dev-app/dev-app/dev-app-module.ts

@@ -8,16 +8,14 @@
 
 import {CommonModule} from '@angular/common';
 import {NgModule} from '@angular/core';
-import {
-  MatButtonModule,
-  MatIconModule,
-  MatListModule,
-  MatSidenavModule,
-  MatToolbarModule,
-  GestureConfig
-} from '@angular/material';
-import {RouterModule} from '@angular/router';
+import {MatButtonModule} from '@angular/material/button';
+import {GestureConfig} from '@angular/material/core';
+import {MatIconModule} from '@angular/material/icon';
+import {MatListModule} from '@angular/material/list';
+import {MatSidenavModule} from '@angular/material/sidenav';
+import {MatToolbarModule} from '@angular/material/toolbar';
 import {HAMMER_GESTURE_CONFIG} from '@angular/platform-browser';
+import {RouterModule} from '@angular/router';
 import {DevApp404} from './dev-app-404';
 import {DevAppHome} from './dev-app-home';
 import {DevAppLayout} from './dev-app-layout';

src/dev-app/dialog/dialog-demo-module.ts

@@ -8,15 +8,13 @@
 
 import {NgModule} from '@angular/core';
 import {FormsModule} from '@angular/forms';
-import {
-  MatButtonModule,
-  MatCardModule,
-  MatCheckboxModule,
-  MatDialogModule,
-  MatFormFieldModule,
-  MatInputModule,
-  MatSelectModule
-} from '@angular/material';
+import {MatButtonModule} from '@angular/material/button';
+import {MatCardModule} from '@angular/material/card';
+import {MatCheckboxModule} from '@angular/material/checkbox';
+import {MatDialogModule} from '@angular/material/dialog';
+import {MatFormFieldModule} from '@angular/material/form-field';
+import {MatInputModule} from '@angular/material/input';
+import {MatSelectModule} from '@angular/material/select';
 import {RouterModule} from '@angular/router';
 import {ContentElementDialog, DialogDemo, IFrameDialog, JazzDialog} from './dialog-demo';
 

src/dev-app/dialog/dialog-demo.ts

@@ -8,7 +8,7 @@
 
 import {DOCUMENT} from '@angular/common';
 import {Component, Inject, TemplateRef, ViewChild, ViewEncapsulation} from '@angular/core';
-import {MAT_DIALOG_DATA, MatDialog, MatDialogConfig, MatDialogRef} from '@angular/material';
+import {MAT_DIALOG_DATA, MatDialog, MatDialogConfig, MatDialogRef} from '@angular/material/dialog';
 
 
 const defaultDialogConfig = new MatDialogConfig();

src/dev-app/drag-drop/drag-drop-demo-module.ts

@@ -10,7 +10,9 @@ import {DragDropModule} from '@angular/cdk/drag-drop';
 import {CommonModule} from '@angular/common';
 import {NgModule} from '@angular/core';
 import {FormsModule} from '@angular/forms';
-import {MatFormFieldModule, MatIconModule, MatSelectModule} from '@angular/material';
+import {MatFormFieldModule} from '@angular/material/form-field';
+import {MatIconModule} from '@angular/material/icon';
+import {MatSelectModule} from '@angular/material/select';
 import {RouterModule} from '@angular/router';
 import {DragAndDropDemo} from './drag-drop-demo';
 

src/dev-app/drawer/drawer-demo-module.ts

@@ -7,7 +7,9 @@
  */
 
 import {NgModule} from '@angular/core';
-import {MatButtonModule, MatListModule, MatSidenavModule} from '@angular/material';
+import {MatButtonModule} from '@angular/material/button';
+import {MatListModule} from '@angular/material/list';
+import {MatSidenavModule} from '@angular/material/sidenav';
 import {RouterModule} from '@angular/router';
 import {DrawerDemo} from './drawer-demo';
 

src/dev-app/example/example-module.ts

@@ -8,7 +8,7 @@
 
 import {CommonModule} from '@angular/common';
 import {NgModule} from '@angular/core';
-import {MatExpansionModule} from '@angular/material';
+import {MatExpansionModule} from '@angular/material/expansion';
 import {ExampleModule as ExampleDataModule} from '@angular/material-examples';
 import {Example} from './example';
 

src/dev-app/expansion/expansion-demo-module.ts

@@ -10,15 +10,13 @@ import {CdkAccordionModule} from '@angular/cdk/accordion';
 import {CommonModule} from '@angular/common';
 import {NgModule} from '@angular/core';
 import {FormsModule} from '@angular/forms';
-import {
-  MatButtonModule,
-  MatCheckboxModule,
-  MatExpansionModule,
-  MatFormFieldModule,
-  MatInputModule,
-  MatRadioModule,
-  MatSlideToggleModule
-} from '@angular/material';
+import {MatButtonModule} from '@angular/material/button';
+import {MatCheckboxModule} from '@angular/material/checkbox';
+import {MatExpansionModule} from '@angular/material/expansion';
+import {MatFormFieldModule} from '@angular/material/form-field';
+import {MatInputModule} from '@angular/material/input';
+import {MatRadioModule} from '@angular/material/radio';
+import {MatSlideToggleModule} from '@angular/material/slide-toggle';
 import {RouterModule} from '@angular/router';
 import {ExpansionDemo} from './expansion-demo';
 

src/dev-app/expansion/expansion-demo.ts

@@ -7,7 +7,7 @@
  */
 
 import {Component, ViewChild} from '@angular/core';
-import {MatAccordion} from '@angular/material';
+import {MatAccordion} from '@angular/material/expansion';
 
 
 @Component({

src/dev-app/grid-list/grid-list-demo-module.ts

@@ -9,7 +9,10 @@
 import {CommonModule} from '@angular/common';
 import {NgModule} from '@angular/core';
 import {FormsModule} from '@angular/forms';
-import {MatButtonModule, MatCardModule, MatGridListModule, MatIconModule} from '@angular/material';
+import {MatButtonModule} from '@angular/material/button';
+import {MatCardModule} from '@angular/material/card';
+import {MatGridListModule} from '@angular/material/grid-list';
+import {MatIconModule} from '@angular/material/icon';
 import {RouterModule} from '@angular/router';
 import {GridListDemo} from './grid-list-demo';
 

src/dev-app/icon/icon-demo-module.ts

@@ -7,7 +7,7 @@
  */
 
 import {NgModule} from '@angular/core';
-import {MatIconModule} from '@angular/material';
+import {MatIconModule} from '@angular/material/icon';
 import {RouterModule} from '@angular/router';
 import {IconDemo} from './icon-demo';
 

src/dev-app/icon/icon-demo.ts

@@ -7,7 +7,7 @@
  */
 
 import {Component} from '@angular/core';
-import {MatIconRegistry} from '@angular/material';
+import {MatIconRegistry} from '@angular/material/icon';
 import {DomSanitizer} from '@angular/platform-browser';