1. Move src/material/<component> to src/material/legacy-<component>

Perform the following steps to complete the move and fix all references:
1. Move directory `src/material/<component>` to `src/material/legacy-<component>`
2. Move file `tools/public_api_guard/material/<component>.md` to `tools/public_api_guard/material/legacy-<component>.md`
3. Move file `tools/public_api_guard/material/<component>-testing.md` to `tools/public_api_guard/material/legacy-<component>-testing.md`
4. Global find & replace `@angular/material/<component>` with `@angular/material/legacy-<component>`
5. Global find & replace `src/material/<component>` with `src/material/legacy-<component>`
6. Under `src/material`, find & replace `/<component>/` with `/legacy-<component>/`
7. In `src/material/legacy-<component>/BUILD`, change the rule named `<component>` to `legacy-<component>` and the rule named `<component>_scss_lib` to `legacy_<component>_scss_lib`
8. In `src/material/config.bzl` change `<component>` and `<component>/testing` in the entryPoints list to `legacy-<component>` and `legacy-<component>/testing`
9. In `.github/CODEOWNERS` change `/tools/public_api_guard/material/<component>**` to `/tools/public_api_guard/material/legacy-<component>**`
10. In `.ng-dev/commit-message.mts` change `material/<component>` to `material/legacy-<component>`
11. Run `yarn format`

Author: mmalerba

.github/CODEOWNERS

@@ -5,7 +5,7 @@
 /src/material/bottom-sheet/**                      @jelbourn @crisbeto
 /src/material/button-toggle/**                     @andrewseguin
 /src/material/button/**                            @andrewseguin
-/src/material/card/**                              @andrewseguin
+/src/material/legacy-card/**                              @andrewseguin
 /src/material/checkbox/**                          @andrewseguin @devversion
 /src/material/chips/**                             @andrewseguin
 /src/material/datepicker/**                        @mmalerba @crisbeto @zarend
@@ -316,7 +316,7 @@
 /tools/public_api_guard/material/bottom-sheet**    @andrewseguin @crisbeto
 /tools/public_api_guard/material/button-toggle**   @andrewseguin
 /tools/public_api_guard/material/button**          @andrewseguin
-/tools/public_api_guard/material/card**            @andrewseguin
+/tools/public_api_guard/material/legacy-card**     @andrewseguin
 /tools/public_api_guard/material/checkbox**        @andrewseguin @devversion
 /tools/public_api_guard/material/chips**           @andrewseguin
 /tools/public_api_guard/material/chips/testing**   @andrewseguin

.ng-dev/commit-message.mts

@@ -73,7 +73,7 @@ export const commitMessage: CommitMessageConfig = {
     'material/bottom-sheet',
     'material/button',
     'material/button-toggle',
-    'material/card',
+    'material/legacy-card',
     'material/checkbox',
     'material/chips',
     'material/core',

src/components-examples/material/card/BUILD.bazel

@@ -17,9 +17,9 @@ ng_module(
         "//src/cdk/testing/testbed",
         "//src/material/button",
         "//src/material/button/testing",
-        "//src/material/card",
-        "//src/material/card/testing",
         "//src/material/divider",
+        "//src/material/legacy-card",
+        "//src/material/legacy-card/testing",
         "//src/material/progress-bar",
         "@npm//@angular/platform-browser",
         "@npm//@angular/platform-browser-dynamic",
@@ -44,8 +44,8 @@ ng_test_library(
         "//src/cdk/testing",
         "//src/cdk/testing/testbed",
         "//src/material/button/testing",
-        "//src/material/card",
-        "//src/material/card/testing",
+        "//src/material/legacy-card",
+        "//src/material/legacy-card/testing",
         "@npm//@angular/platform-browser-dynamic",
     ],
 )

src/components-examples/material/card/card-harness/card-harness-example.spec.ts

@@ -1,9 +1,9 @@
 import {ComponentFixture, TestBed} from '@angular/core/testing';
 import {TestbedHarnessEnvironment} from '@angular/cdk/testing/testbed';
 import {MatButtonHarness} from '@angular/material/button/testing';
-import {MatCardHarness} from '@angular/material/card/testing';
+import {MatCardHarness} from '@angular/material/legacy-card/testing';
 import {HarnessLoader, parallel} from '@angular/cdk/testing';
-import {MatCardModule} from '@angular/material/card';
+import {MatCardModule} from '@angular/material/legacy-card';
 import {CardHarnessExample} from './card-harness-example';
 
 describe('CardHarnessExample', () => {

src/components-examples/material/card/index.ts

@@ -1,6 +1,6 @@
 import {NgModule} from '@angular/core';
 import {MatButtonModule} from '@angular/material/button';
-import {MatCardModule} from '@angular/material/card';
+import {MatCardModule} from '@angular/material/legacy-card';
 import {MatDividerModule} from '@angular/material/divider';
 import {MatProgressBarModule} from '@angular/material/progress-bar';
 import {CardFancyExample} from './card-fancy/card-fancy-example';

src/components-examples/material/checkbox/BUILD.bazel

@@ -15,9 +15,9 @@ ng_module(
     deps = [
         "//src/cdk/testing",
         "//src/cdk/testing/testbed",
-        "//src/material/card",
         "//src/material/checkbox",
         "//src/material/checkbox/testing",
+        "//src/material/legacy-card",
         "//src/material/radio",
         "@npm//@angular/forms",
         "@npm//@angular/platform-browser",

src/components-examples/material/checkbox/index.ts

@@ -1,7 +1,7 @@
 import {CommonModule} from '@angular/common';
 import {NgModule} from '@angular/core';
 import {FormsModule, ReactiveFormsModule} from '@angular/forms';
-import {MatCardModule} from '@angular/material/card';
+import {MatCardModule} from '@angular/material/legacy-card';
 import {MatCheckboxModule} from '@angular/material/checkbox';
 import {MatRadioModule} from '@angular/material/radio';
 import {CheckboxConfigurableExample} from './checkbox-configurable/checkbox-configurable-example';

src/components-examples/material/datepicker/BUILD.bazel

@@ -17,12 +17,12 @@ ng_module(
         "//src/cdk/testing/testbed",
         "//src/material-moment-adapter",
         "//src/material/button",
-        "//src/material/card",
         "//src/material/core",
         "//src/material/datepicker",
         "//src/material/datepicker/testing",
         "//src/material/icon",
         "//src/material/input",
+        "//src/material/legacy-card",
         "@npm//@angular/forms",
         "@npm//@angular/platform-browser",
         "@npm//@angular/platform-browser-dynamic",

src/components-examples/material/datepicker/index.ts

@@ -2,7 +2,7 @@ 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 {MatCardModule} from '@angular/material/legacy-card';
 import {MatNativeDateModule, MAT_DATE_LOCALE} from '@angular/material/core';
 import {MatDatepickerModule} from '@angular/material/datepicker';
 import {MatIconModule} from '@angular/material/icon';

src/components-examples/material/progress-bar/BUILD.bazel

@@ -15,7 +15,7 @@ ng_module(
     deps = [
         "//src/cdk/testing",
         "//src/cdk/testing/testbed",
-        "//src/material/card",
+        "//src/material/legacy-card",
         "//src/material/progress-bar",
         "//src/material/progress-bar/testing",
         "//src/material/radio",

src/components-examples/material/progress-bar/index.ts

@@ -1,7 +1,7 @@
 import {CommonModule} from '@angular/common';
 import {NgModule} from '@angular/core';
 import {FormsModule} from '@angular/forms';
-import {MatCardModule} from '@angular/material/card';
+import {MatCardModule} from '@angular/material/legacy-card';
 import {MatProgressBarModule} from '@angular/material/progress-bar';
 import {MatRadioModule} from '@angular/material/radio';
 import {MatSliderModule} from '@angular/material/slider';

src/components-examples/material/progress-spinner/BUILD.bazel

@@ -15,7 +15,7 @@ ng_module(
     deps = [
         "//src/cdk/testing",
         "//src/cdk/testing/testbed",
-        "//src/material/card",
+        "//src/material/legacy-card",
         "//src/material/progress-spinner",
         "//src/material/progress-spinner/testing",
         "//src/material/radio",

src/components-examples/material/progress-spinner/index.ts

@@ -1,7 +1,7 @@
 import {CommonModule} from '@angular/common';
 import {NgModule} from '@angular/core';
 import {FormsModule} from '@angular/forms';
-import {MatCardModule} from '@angular/material/card';
+import {MatCardModule} from '@angular/material/legacy-card';
 import {MatProgressSpinnerModule} from '@angular/material/progress-spinner';
 import {MatRadioModule} from '@angular/material/radio';
 import {MatSliderModule} from '@angular/material/slider';

src/components-examples/material/slide-toggle/BUILD.bazel

@@ -16,8 +16,8 @@ ng_module(
         "//src/cdk/testing",
         "//src/cdk/testing/testbed",
         "//src/material/button",
-        "//src/material/card",
         "//src/material/checkbox",
+        "//src/material/legacy-card",
         "//src/material/radio",
         "//src/material/slide-toggle",
         "//src/material/slide-toggle/testing",

src/components-examples/material/slide-toggle/index.ts

@@ -1,7 +1,7 @@
 import {NgModule} from '@angular/core';
 import {FormsModule, ReactiveFormsModule} from '@angular/forms';
 import {MatButtonModule} from '@angular/material/button';
-import {MatCardModule} from '@angular/material/card';
+import {MatCardModule} from '@angular/material/legacy-card';
 import {MatCheckboxModule} from '@angular/material/checkbox';
 import {MatRadioModule} from '@angular/material/radio';
 import {MatSlideToggleModule} from '@angular/material/slide-toggle';

src/components-examples/material/slider/BUILD.bazel

@@ -15,9 +15,9 @@ ng_module(
     deps = [
         "//src/cdk/testing",
         "//src/cdk/testing/testbed",
-        "//src/material/card",
         "//src/material/checkbox",
         "//src/material/input",
+        "//src/material/legacy-card",
         "//src/material/slider",
         "//src/material/slider/testing",
         "@npm//@angular/forms",

src/components-examples/material/slider/index.ts

@@ -1,7 +1,7 @@
 import {CommonModule} from '@angular/common';
 import {NgModule} from '@angular/core';
 import {FormsModule} from '@angular/forms';
-import {MatCardModule} from '@angular/material/card';
+import {MatCardModule} from '@angular/material/legacy-card';
 import {MatCheckboxModule} from '@angular/material/checkbox';
 import {MatInputModule} from '@angular/material/input';
 import {MatSliderModule} from '@angular/material/slider';

src/dev-app/autocomplete/BUILD.bazel

@@ -12,9 +12,9 @@ ng_module(
     deps = [
         "//src/material/autocomplete",
         "//src/material/button",
-        "//src/material/card",
         "//src/material/form-field",
         "//src/material/input",
+        "//src/material/legacy-card",
         "@npm//@angular/forms",
     ],
 )

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

@@ -11,7 +11,7 @@ import {CommonModule} from '@angular/common';
 import {FormControl, FormsModule, NgModel, ReactiveFormsModule} from '@angular/forms';
 import {MatAutocompleteModule} from '@angular/material/autocomplete';
 import {MatButtonModule} from '@angular/material/button';
-import {MatCardModule} from '@angular/material/card';
+import {MatCardModule} from '@angular/material/legacy-card';
 import {MatFormFieldModule} from '@angular/material/form-field';
 import {MatInputModule} from '@angular/material/input';
 import {Observable} from 'rxjs';

src/dev-app/baseline/BUILD.bazel

@@ -10,10 +10,10 @@ ng_module(
         ":baseline_demo_scss",
     ],
     deps = [
-        "//src/material/card",
         "//src/material/checkbox",
         "//src/material/form-field",
         "//src/material/input",
+        "//src/material/legacy-card",
         "//src/material/radio",
         "//src/material/select",
         "//src/material/toolbar",

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

@@ -8,7 +8,7 @@
 
 import {Component} from '@angular/core';
 import {CommonModule} from '@angular/common';
-import {MatCardModule} from '@angular/material/card';
+import {MatCardModule} from '@angular/material/legacy-card';
 import {MatCheckboxModule} from '@angular/material/checkbox';
 import {MatFormFieldModule} from '@angular/material/form-field';
 import {MatInputModule} from '@angular/material/input';

src/dev-app/bottom-sheet/BUILD.bazel

@@ -12,11 +12,11 @@ ng_module(
     deps = [
         "//src/material/bottom-sheet",
         "//src/material/button",
-        "//src/material/card",
         "//src/material/checkbox",
         "//src/material/form-field",
         "//src/material/icon",
         "//src/material/input",
+        "//src/material/legacy-card",
         "//src/material/list",
         "//src/material/select",
         "@npm//@angular/forms",

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

@@ -16,7 +16,7 @@ import {
   MatBottomSheetRef,
 } from '@angular/material/bottom-sheet';
 import {MatButtonModule} from '@angular/material/button';
-import {MatCardModule} from '@angular/material/card';
+import {MatCardModule} from '@angular/material/legacy-card';
 import {MatCheckboxModule} from '@angular/material/checkbox';
 import {MatFormFieldModule} from '@angular/material/form-field';
 import {MatIconModule} from '@angular/material/icon';

src/dev-app/card/BUILD.bazel

@@ -11,8 +11,8 @@ ng_module(
     ],
     deps = [
         "//src/material/button",
-        "//src/material/card",
         "//src/material/divider",
+        "//src/material/legacy-card",
         "//src/material/progress-bar",
     ],
 )

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

@@ -8,7 +8,7 @@
 
 import {Component} from '@angular/core';
 import {MatButtonModule} from '@angular/material/button';
-import {MatCardModule} from '@angular/material/card';
+import {MatCardModule} from '@angular/material/legacy-card';
 import {MatDividerModule} from '@angular/material/divider';
 import {MatProgressBarModule} from '@angular/material/progress-bar';
 

src/dev-app/chips/BUILD.bazel

@@ -11,11 +11,11 @@ ng_module(
     ],
     deps = [
         "//src/material/button",
-        "//src/material/card",
         "//src/material/checkbox",
         "//src/material/chips",
         "//src/material/form-field",
         "//src/material/icon",
+        "//src/material/legacy-card",
         "//src/material/toolbar",
     ],
 )

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

@@ -11,7 +11,7 @@ import {COMMA, ENTER} from '@angular/cdk/keycodes';
 import {CommonModule} from '@angular/common';
 import {FormsModule} from '@angular/forms';
 import {MatButtonModule} from '@angular/material/button';
-import {MatCardModule} from '@angular/material/card';
+import {MatCardModule} from '@angular/material/legacy-card';
 import {MatCheckboxModule} from '@angular/material/checkbox';
 import {MatChipInputEvent, MatChipsModule} from '@angular/material/chips';
 import {ThemePalette} from '@angular/material/core';

src/dev-app/dialog/BUILD.bazel

@@ -12,11 +12,11 @@ ng_module(
     deps = [
         "//src/cdk/drag-drop",
         "//src/material/button",
-        "//src/material/card",
         "//src/material/checkbox",
         "//src/material/dialog",
         "//src/material/form-field",
         "//src/material/input",
+        "//src/material/legacy-card",
         "//src/material/select",
     ],
 )

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

@@ -11,7 +11,7 @@ import {DOCUMENT} from '@angular/common';
 import {DragDropModule} from '@angular/cdk/drag-drop';
 import {FormsModule} from '@angular/forms';
 import {MatButtonModule} from '@angular/material/button';
-import {MatCardModule} from '@angular/material/card';
+import {MatCardModule} from '@angular/material/legacy-card';
 import {MatCheckboxModule} from '@angular/material/checkbox';
 import {
   MAT_DIALOG_DATA,

src/dev-app/focus-trap/BUILD.bazel

@@ -15,8 +15,8 @@ ng_module(
         "//src/cdk/a11y",
         "//src/cdk/platform",
         "//src/material/button",
-        "//src/material/card",
         "//src/material/dialog",
+        "//src/material/legacy-card",
         "//src/material/toolbar",
     ],
 )

src/dev-app/focus-trap/focus-trap-demo.ts

@@ -20,7 +20,7 @@ import {MatDialog, MatDialogModule} from '@angular/material/dialog';
 import {_supportsShadowDom} from '@angular/cdk/platform';
 import {CommonModule} from '@angular/common';
 import {MatButtonModule} from '@angular/material/button';
-import {MatCardModule} from '@angular/material/card';
+import {MatCardModule} from '@angular/material/legacy-card';
 import {MatToolbarModule} from '@angular/material/toolbar';
 
 @Component({

src/dev-app/grid-list/BUILD.bazel

@@ -11,9 +11,9 @@ ng_module(
     ],
     deps = [
         "//src/material/button",
-        "//src/material/card",
         "//src/material/grid-list",
         "//src/material/icon",
+        "//src/material/legacy-card",
     ],
 )
 

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

@@ -10,7 +10,7 @@ import {Component} from '@angular/core';
 import {CommonModule} from '@angular/common';
 import {FormsModule} from '@angular/forms';
 import {MatButtonModule} from '@angular/material/button';
-import {MatCardModule} from '@angular/material/card';
+import {MatCardModule} from '@angular/material/legacy-card';
 import {MatGridListModule} from '@angular/material/grid-list';
 import {MatIconModule} from '@angular/material/icon';
 

src/dev-app/input/BUILD.bazel

@@ -12,11 +12,11 @@ ng_module(
     deps = [
         "//src/material/button",
         "//src/material/button-toggle",
-        "//src/material/card",
         "//src/material/checkbox",
         "//src/material/form-field",
         "//src/material/icon",
         "//src/material/input",
+        "//src/material/legacy-card",
         "//src/material/select",
         "//src/material/tabs",
         "//src/material/toolbar",

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

@@ -11,7 +11,7 @@ import {CommonModule} from '@angular/common';
 import {FormControl, FormsModule, ReactiveFormsModule, Validators} from '@angular/forms';
 import {MatButtonModule} from '@angular/material/button';
 import {MatButtonToggleModule} from '@angular/material/button-toggle';
-import {MatCardModule} from '@angular/material/card';
+import {MatCardModule} from '@angular/material/legacy-card';
 import {MatCheckboxModule} from '@angular/material/checkbox';
 import {ErrorStateMatcher} from '@angular/material/core';
 import {FloatLabelType, MatFormFieldModule} from '@angular/material/form-field';

src/dev-app/paginator/BUILD.bazel

@@ -10,9 +10,9 @@ ng_module(
         ":paginator_demo_scss",
     ],
     deps = [
-        "//src/material/card",
         "//src/material/form-field",
         "//src/material/input",
+        "//src/material/legacy-card",
         "//src/material/paginator",
         "//src/material/slide-toggle",
         "@npm//@angular/forms",

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

@@ -10,7 +10,7 @@ import {Component} from '@angular/core';
 import {MatPaginatorModule, PageEvent} from '@angular/material/paginator';
 import {CommonModule} from '@angular/common';
 import {FormsModule} from '@angular/forms';
-import {MatCardModule} from '@angular/material/card';
+import {MatCardModule} from '@angular/material/legacy-card';
 import {MatFormFieldModule} from '@angular/material/form-field';
 import {MatInputModule} from '@angular/material/input';
 import {MatSlideToggleModule} from '@angular/material/slide-toggle';