diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS
index c5b67a5e4a3a..c6c6016711e2 100644
--- a/.github/CODEOWNERS
+++ b/.github/CODEOWNERS
@@ -205,7 +205,7 @@
/src/dev-app/mdc-snack-bar/** @andrewseguin
/src/dev-app/mdc-slide-toggle/** @crisbeto
/src/dev-app/mdc-slider/** @devversion
-/src/dev-app/mdc-table/** @andrewseguin
+/src/dev-app/legacy-table/** @andrewseguin
/src/dev-app/mdc-tabs/** @crisbeto
/src/dev-app/mdc-tooltip/** @crisbeto
/src/dev-app/menu/** @crisbeto
diff --git a/src/components-examples/material-experimental/mdc-table/index.ts b/src/components-examples/material/index.ts
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/index.ts
rename to src/components-examples/material/index.ts
diff --git a/src/components-examples/material-experimental/mdc-table/BUILD.bazel b/src/components-examples/material/legacy-table/BUILD.bazel
similarity index 96%
rename from src/components-examples/material-experimental/mdc-table/BUILD.bazel
rename to src/components-examples/material/legacy-table/BUILD.bazel
index 112d166812b2..d298b884ab71 100644
--- a/src/components-examples/material-experimental/mdc-table/BUILD.bazel
+++ b/src/components-examples/material/legacy-table/BUILD.bazel
@@ -3,7 +3,7 @@ load("//tools:defaults.bzl", "ng_module", "ng_test_library", "ng_web_test_suite"
package(default_visibility = ["//visibility:public"])
ng_module(
- name = "mdc-table",
+ name = "legacy-table",
srcs = glob(
["**/*.ts"],
exclude = ["**/*.spec.ts"],
@@ -47,7 +47,7 @@ ng_test_library(
name = "unit_tests_lib",
srcs = glob(["**/*.spec.ts"]),
deps = [
- ":mdc-table",
+ ":legacy-table",
"//src/cdk/testing",
"//src/cdk/testing/testbed",
"//src/material/legacy-table",
diff --git a/src/components-examples/material/legacy-table/index.ts b/src/components-examples/material/legacy-table/index.ts
new file mode 100644
index 000000000000..385829e894b9
--- /dev/null
+++ b/src/components-examples/material/legacy-table/index.ts
@@ -0,0 +1,134 @@
+import {CommonModule} from '@angular/common';
+import {NgModule} from '@angular/core';
+import {MatRippleModule} from '@angular/material/core';
+import {MatLegacyButtonModule} from '@angular/material/legacy-button';
+import {MatButtonToggleModule} from '@angular/material/button-toggle';
+import {MatLegacyCheckboxModule} from '@angular/material/legacy-checkbox';
+import {MatIconModule} from '@angular/material/icon';
+import {MatLegacyInputModule} from '@angular/material/legacy-input';
+import {MatLegacyPaginatorModule} from '@angular/material/legacy-paginator';
+import {MatLegacyProgressSpinnerModule} from '@angular/material/legacy-progress-spinner';
+import {MatSortModule} from '@angular/material/sort';
+import {MatLegacyTableModule} from '@angular/material/legacy-table';
+import {DragDropModule} from '@angular/cdk/drag-drop';
+import {CdkTableModule} from '@angular/cdk/table';
+
+import {TableFlexBasicExample} from './table-flex-basic/table-flex-basic-example';
+import {TableBasicExample} from './table-basic/table-basic-example';
+import {TableDynamicColumnsExample} from './table-dynamic-columns/table-dynamic-columns-example';
+import {TableExpandableRowsExample} from './table-expandable-rows/table-expandable-rows-example';
+import {TableFilteringExample} from './table-filtering/table-filtering-example';
+import {TableFooterRowExample} from './table-footer-row/table-footer-row-example';
+import {TableHttpExample} from './table-http/table-http-example';
+import {TableMultipleHeaderFooterExample} from './table-multiple-header-footer/table-multiple-header-footer-example';
+import {TableOverviewExample} from './table-overview/table-overview-example';
+import {TablePaginationExample} from './table-pagination/table-pagination-example';
+import {TableRowContextExample} from './table-row-context/table-row-context-example';
+import {TableSelectionExample} from './table-selection/table-selection-example';
+import {TableSortingExample} from './table-sorting/table-sorting-example';
+import {TableStickyColumnsExample} from './table-sticky-columns/table-sticky-columns-example';
+import {TableStickyComplexFlexExample} from './table-sticky-complex-flex/table-sticky-complex-flex-example';
+import {TableStickyComplexExample} from './table-sticky-complex/table-sticky-complex-example';
+import {TableStickyFooterExample} from './table-sticky-footer/table-sticky-footer-example';
+import {TableStickyHeaderExample} from './table-sticky-header/table-sticky-header-example';
+import {TableTextColumnAdvancedExample} from './table-text-column-advanced/table-text-column-advanced-example';
+import {TableTextColumnExample} from './table-text-column/table-text-column-example';
+import {TableWrappedExample, WrapperTable} from './table-wrapped/table-wrapped-example';
+import {TableReorderableExample} from './table-reorderable/table-reorderable-example';
+import {TableRecycleRowsExample} from './table-recycle-rows/table-recycle-rows-example';
+import {TableHarnessExample} from './table-harness/table-harness-example';
+import {TableWithRipplesExample} from './table-with-ripples/table-with-ripples-example';
+import {TableColumnStylingExample} from './table-column-styling/table-column-styling-example';
+import {TableRowBindingExample} from './table-row-binding/table-row-binding-example';
+import {TableDynamicArrayDataExample} from './table-dynamic-array-data/table-dynamic-array-data-example';
+import {TableDynamicObservableDataExample} from './table-dynamic-observable-data/table-dynamic-observable-data-example';
+import {TableGeneratedColumnsExample} from './table-generated-columns/table-generated-columns-example';
+
+export {
+ TableBasicExample,
+ TableColumnStylingExample,
+ TableDynamicArrayDataExample,
+ TableDynamicColumnsExample,
+ TableDynamicObservableDataExample,
+ TableExpandableRowsExample,
+ TableFilteringExample,
+ TableFlexBasicExample,
+ TableFooterRowExample,
+ TableGeneratedColumnsExample,
+ TableHarnessExample,
+ TableHttpExample,
+ TableMultipleHeaderFooterExample,
+ TableOverviewExample,
+ TablePaginationExample,
+ TableRecycleRowsExample,
+ TableReorderableExample,
+ TableRowBindingExample,
+ TableRowContextExample,
+ TableSelectionExample,
+ TableSortingExample,
+ TableStickyColumnsExample,
+ TableStickyComplexExample,
+ TableStickyComplexFlexExample,
+ TableStickyFooterExample,
+ TableStickyHeaderExample,
+ TableTextColumnAdvancedExample,
+ TableTextColumnExample,
+ TableWithRipplesExample,
+ TableWrappedExample,
+ WrapperTable,
+};
+
+const EXAMPLES = [
+ TableBasicExample,
+ TableColumnStylingExample,
+ TableDynamicArrayDataExample,
+ TableDynamicColumnsExample,
+ TableDynamicObservableDataExample,
+ TableExpandableRowsExample,
+ TableFilteringExample,
+ TableFlexBasicExample,
+ TableFooterRowExample,
+ TableGeneratedColumnsExample,
+ TableHarnessExample,
+ TableHttpExample,
+ TableMultipleHeaderFooterExample,
+ TableOverviewExample,
+ TablePaginationExample,
+ TableRecycleRowsExample,
+ TableReorderableExample,
+ TableRowBindingExample,
+ TableRowContextExample,
+ TableSelectionExample,
+ TableSortingExample,
+ TableStickyColumnsExample,
+ TableStickyComplexExample,
+ TableStickyComplexFlexExample,
+ TableStickyFooterExample,
+ TableStickyHeaderExample,
+ TableTextColumnAdvancedExample,
+ TableTextColumnExample,
+ TableWithRipplesExample,
+ TableWrappedExample,
+ WrapperTable,
+];
+
+@NgModule({
+ imports: [
+ CommonModule,
+ MatLegacyButtonModule,
+ MatButtonToggleModule,
+ MatLegacyCheckboxModule,
+ MatIconModule,
+ MatLegacyInputModule,
+ MatLegacyPaginatorModule,
+ MatLegacyProgressSpinnerModule,
+ MatRippleModule,
+ MatSortModule,
+ MatLegacyTableModule,
+ CdkTableModule,
+ DragDropModule,
+ ],
+ declarations: EXAMPLES,
+ exports: EXAMPLES,
+})
+export class TableExamplesModule {}
diff --git a/src/components-examples/material-experimental/mdc-table/table-basic/table-basic-example.css b/src/components-examples/material/legacy-table/table-basic/table-basic-example.css
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-basic/table-basic-example.css
rename to src/components-examples/material/legacy-table/table-basic/table-basic-example.css
diff --git a/src/components-examples/material-experimental/mdc-table/table-basic/table-basic-example.html b/src/components-examples/material/legacy-table/table-basic/table-basic-example.html
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-basic/table-basic-example.html
rename to src/components-examples/material/legacy-table/table-basic/table-basic-example.html
diff --git a/src/components-examples/material-experimental/mdc-table/table-basic/table-basic-example.ts b/src/components-examples/material/legacy-table/table-basic/table-basic-example.ts
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-basic/table-basic-example.ts
rename to src/components-examples/material/legacy-table/table-basic/table-basic-example.ts
diff --git a/src/components-examples/material-experimental/mdc-table/table-column-styling/table-column-styling-example.css b/src/components-examples/material/legacy-table/table-column-styling/table-column-styling-example.css
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-column-styling/table-column-styling-example.css
rename to src/components-examples/material/legacy-table/table-column-styling/table-column-styling-example.css
diff --git a/src/components-examples/material-experimental/mdc-table/table-column-styling/table-column-styling-example.html b/src/components-examples/material/legacy-table/table-column-styling/table-column-styling-example.html
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-column-styling/table-column-styling-example.html
rename to src/components-examples/material/legacy-table/table-column-styling/table-column-styling-example.html
diff --git a/src/components-examples/material-experimental/mdc-table/table-column-styling/table-column-styling-example.ts b/src/components-examples/material/legacy-table/table-column-styling/table-column-styling-example.ts
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-column-styling/table-column-styling-example.ts
rename to src/components-examples/material/legacy-table/table-column-styling/table-column-styling-example.ts
diff --git a/src/components-examples/material-experimental/mdc-table/table-dynamic-array-data/table-dynamic-array-data-example.css b/src/components-examples/material/legacy-table/table-dynamic-array-data/table-dynamic-array-data-example.css
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-dynamic-array-data/table-dynamic-array-data-example.css
rename to src/components-examples/material/legacy-table/table-dynamic-array-data/table-dynamic-array-data-example.css
diff --git a/src/components-examples/material-experimental/mdc-table/table-dynamic-array-data/table-dynamic-array-data-example.html b/src/components-examples/material/legacy-table/table-dynamic-array-data/table-dynamic-array-data-example.html
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-dynamic-array-data/table-dynamic-array-data-example.html
rename to src/components-examples/material/legacy-table/table-dynamic-array-data/table-dynamic-array-data-example.html
diff --git a/src/components-examples/material-experimental/mdc-table/table-dynamic-array-data/table-dynamic-array-data-example.ts b/src/components-examples/material/legacy-table/table-dynamic-array-data/table-dynamic-array-data-example.ts
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-dynamic-array-data/table-dynamic-array-data-example.ts
rename to src/components-examples/material/legacy-table/table-dynamic-array-data/table-dynamic-array-data-example.ts
diff --git a/src/components-examples/material-experimental/mdc-table/table-dynamic-columns/table-dynamic-columns-example.css b/src/components-examples/material/legacy-table/table-dynamic-columns/table-dynamic-columns-example.css
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-dynamic-columns/table-dynamic-columns-example.css
rename to src/components-examples/material/legacy-table/table-dynamic-columns/table-dynamic-columns-example.css
diff --git a/src/components-examples/material-experimental/mdc-table/table-dynamic-columns/table-dynamic-columns-example.html b/src/components-examples/material/legacy-table/table-dynamic-columns/table-dynamic-columns-example.html
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-dynamic-columns/table-dynamic-columns-example.html
rename to src/components-examples/material/legacy-table/table-dynamic-columns/table-dynamic-columns-example.html
diff --git a/src/components-examples/material-experimental/mdc-table/table-dynamic-columns/table-dynamic-columns-example.ts b/src/components-examples/material/legacy-table/table-dynamic-columns/table-dynamic-columns-example.ts
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-dynamic-columns/table-dynamic-columns-example.ts
rename to src/components-examples/material/legacy-table/table-dynamic-columns/table-dynamic-columns-example.ts
diff --git a/src/components-examples/material-experimental/mdc-table/table-dynamic-observable-data/table-dynamic-observable-data-example.css b/src/components-examples/material/legacy-table/table-dynamic-observable-data/table-dynamic-observable-data-example.css
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-dynamic-observable-data/table-dynamic-observable-data-example.css
rename to src/components-examples/material/legacy-table/table-dynamic-observable-data/table-dynamic-observable-data-example.css
diff --git a/src/components-examples/material-experimental/mdc-table/table-dynamic-observable-data/table-dynamic-observable-data-example.html b/src/components-examples/material/legacy-table/table-dynamic-observable-data/table-dynamic-observable-data-example.html
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-dynamic-observable-data/table-dynamic-observable-data-example.html
rename to src/components-examples/material/legacy-table/table-dynamic-observable-data/table-dynamic-observable-data-example.html
diff --git a/src/components-examples/material-experimental/mdc-table/table-dynamic-observable-data/table-dynamic-observable-data-example.ts b/src/components-examples/material/legacy-table/table-dynamic-observable-data/table-dynamic-observable-data-example.ts
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-dynamic-observable-data/table-dynamic-observable-data-example.ts
rename to src/components-examples/material/legacy-table/table-dynamic-observable-data/table-dynamic-observable-data-example.ts
diff --git a/src/components-examples/material-experimental/mdc-table/table-expandable-rows/table-expandable-rows-example.css b/src/components-examples/material/legacy-table/table-expandable-rows/table-expandable-rows-example.css
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-expandable-rows/table-expandable-rows-example.css
rename to src/components-examples/material/legacy-table/table-expandable-rows/table-expandable-rows-example.css
diff --git a/src/components-examples/material-experimental/mdc-table/table-expandable-rows/table-expandable-rows-example.html b/src/components-examples/material/legacy-table/table-expandable-rows/table-expandable-rows-example.html
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-expandable-rows/table-expandable-rows-example.html
rename to src/components-examples/material/legacy-table/table-expandable-rows/table-expandable-rows-example.html
diff --git a/src/components-examples/material-experimental/mdc-table/table-expandable-rows/table-expandable-rows-example.ts b/src/components-examples/material/legacy-table/table-expandable-rows/table-expandable-rows-example.ts
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-expandable-rows/table-expandable-rows-example.ts
rename to src/components-examples/material/legacy-table/table-expandable-rows/table-expandable-rows-example.ts
diff --git a/src/components-examples/material-experimental/mdc-table/table-filtering/table-filtering-example.css b/src/components-examples/material/legacy-table/table-filtering/table-filtering-example.css
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-filtering/table-filtering-example.css
rename to src/components-examples/material/legacy-table/table-filtering/table-filtering-example.css
diff --git a/src/components-examples/material-experimental/mdc-table/table-filtering/table-filtering-example.html b/src/components-examples/material/legacy-table/table-filtering/table-filtering-example.html
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-filtering/table-filtering-example.html
rename to src/components-examples/material/legacy-table/table-filtering/table-filtering-example.html
diff --git a/src/components-examples/material-experimental/mdc-table/table-filtering/table-filtering-example.ts b/src/components-examples/material/legacy-table/table-filtering/table-filtering-example.ts
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-filtering/table-filtering-example.ts
rename to src/components-examples/material/legacy-table/table-filtering/table-filtering-example.ts
diff --git a/src/components-examples/material-experimental/mdc-table/table-flex-basic/table-flex-basic-example.css b/src/components-examples/material/legacy-table/table-flex-basic/table-flex-basic-example.css
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-flex-basic/table-flex-basic-example.css
rename to src/components-examples/material/legacy-table/table-flex-basic/table-flex-basic-example.css
diff --git a/src/components-examples/material-experimental/mdc-table/table-flex-basic/table-flex-basic-example.html b/src/components-examples/material/legacy-table/table-flex-basic/table-flex-basic-example.html
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-flex-basic/table-flex-basic-example.html
rename to src/components-examples/material/legacy-table/table-flex-basic/table-flex-basic-example.html
diff --git a/src/components-examples/material-experimental/mdc-table/table-flex-basic/table-flex-basic-example.ts b/src/components-examples/material/legacy-table/table-flex-basic/table-flex-basic-example.ts
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-flex-basic/table-flex-basic-example.ts
rename to src/components-examples/material/legacy-table/table-flex-basic/table-flex-basic-example.ts
diff --git a/src/components-examples/material-experimental/mdc-table/table-footer-row/table-footer-row-example.css b/src/components-examples/material/legacy-table/table-footer-row/table-footer-row-example.css
similarity index 64%
rename from src/components-examples/material-experimental/mdc-table/table-footer-row/table-footer-row-example.css
rename to src/components-examples/material/legacy-table/table-footer-row/table-footer-row-example.css
index 53ef90725254..de64c6e53694 100644
--- a/src/components-examples/material-experimental/mdc-table/table-footer-row/table-footer-row-example.css
+++ b/src/components-examples/material/legacy-table/table-footer-row/table-footer-row-example.css
@@ -2,6 +2,6 @@ table {
width: 100%;
}
-tr.mat-mdc-footer-row td {
+tr.mat-footer-row {
font-weight: bold;
}
diff --git a/src/components-examples/material-experimental/mdc-table/table-footer-row/table-footer-row-example.html b/src/components-examples/material/legacy-table/table-footer-row/table-footer-row-example.html
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-footer-row/table-footer-row-example.html
rename to src/components-examples/material/legacy-table/table-footer-row/table-footer-row-example.html
diff --git a/src/components-examples/material-experimental/mdc-table/table-footer-row/table-footer-row-example.ts b/src/components-examples/material/legacy-table/table-footer-row/table-footer-row-example.ts
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-footer-row/table-footer-row-example.ts
rename to src/components-examples/material/legacy-table/table-footer-row/table-footer-row-example.ts
diff --git a/src/components-examples/material-experimental/mdc-table/table-generated-columns/table-generated-columns-example.css b/src/components-examples/material/legacy-table/table-generated-columns/table-generated-columns-example.css
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-generated-columns/table-generated-columns-example.css
rename to src/components-examples/material/legacy-table/table-generated-columns/table-generated-columns-example.css
diff --git a/src/components-examples/material-experimental/mdc-table/table-generated-columns/table-generated-columns-example.html b/src/components-examples/material/legacy-table/table-generated-columns/table-generated-columns-example.html
similarity index 70%
rename from src/components-examples/material-experimental/mdc-table/table-generated-columns/table-generated-columns-example.html
rename to src/components-examples/material/legacy-table/table-generated-columns/table-generated-columns-example.html
index 3d5013802268..c1b5fa29128f 100644
--- a/src/components-examples/material-experimental/mdc-table/table-generated-columns/table-generated-columns-example.html
+++ b/src/components-examples/material/legacy-table/table-generated-columns/table-generated-columns-example.html
@@ -8,6 +8,6 @@
-
-
+
+
diff --git a/src/components-examples/material-experimental/mdc-table/table-generated-columns/table-generated-columns-example.ts b/src/components-examples/material/legacy-table/table-generated-columns/table-generated-columns-example.ts
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-generated-columns/table-generated-columns-example.ts
rename to src/components-examples/material/legacy-table/table-generated-columns/table-generated-columns-example.ts
diff --git a/src/components-examples/material-experimental/mdc-table/table-harness/table-harness-example.html b/src/components-examples/material/legacy-table/table-harness/table-harness-example.html
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-harness/table-harness-example.html
rename to src/components-examples/material/legacy-table/table-harness/table-harness-example.html
diff --git a/src/components-examples/material-experimental/mdc-table/table-harness/table-harness-example.spec.ts b/src/components-examples/material/legacy-table/table-harness/table-harness-example.spec.ts
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-harness/table-harness-example.spec.ts
rename to src/components-examples/material/legacy-table/table-harness/table-harness-example.spec.ts
diff --git a/src/components-examples/material-experimental/mdc-table/table-harness/table-harness-example.ts b/src/components-examples/material/legacy-table/table-harness/table-harness-example.ts
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-harness/table-harness-example.ts
rename to src/components-examples/material/legacy-table/table-harness/table-harness-example.ts
diff --git a/src/components-examples/material-experimental/mdc-table/table-http/table-http-example.css b/src/components-examples/material/legacy-table/table-http/table-http-example.css
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-http/table-http-example.css
rename to src/components-examples/material/legacy-table/table-http/table-http-example.css
diff --git a/src/components-examples/material-experimental/mdc-table/table-http/table-http-example.html b/src/components-examples/material/legacy-table/table-http/table-http-example.html
similarity index 92%
rename from src/components-examples/material-experimental/mdc-table/table-http/table-http-example.html
rename to src/components-examples/material/legacy-table/table-http/table-http-example.html
index 9c88d204de87..355ae60b0ff2 100644
--- a/src/components-examples/material-experimental/mdc-table/table-http/table-http-example.html
+++ b/src/components-examples/material/legacy-table/table-http/table-http-example.html
@@ -42,5 +42,5 @@
-
+
diff --git a/src/components-examples/material-experimental/mdc-table/table-http/table-http-example.ts b/src/components-examples/material/legacy-table/table-http/table-http-example.ts
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-http/table-http-example.ts
rename to src/components-examples/material/legacy-table/table-http/table-http-example.ts
diff --git a/src/components-examples/material-experimental/mdc-table/table-multiple-header-footer/table-multiple-header-footer-example.css b/src/components-examples/material/legacy-table/table-multiple-header-footer/table-multiple-header-footer-example.css
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-multiple-header-footer/table-multiple-header-footer-example.css
rename to src/components-examples/material/legacy-table/table-multiple-header-footer/table-multiple-header-footer-example.css
diff --git a/src/components-examples/material-experimental/mdc-table/table-multiple-header-footer/table-multiple-header-footer-example.html b/src/components-examples/material/legacy-table/table-multiple-header-footer/table-multiple-header-footer-example.html
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-multiple-header-footer/table-multiple-header-footer-example.html
rename to src/components-examples/material/legacy-table/table-multiple-header-footer/table-multiple-header-footer-example.html
diff --git a/src/components-examples/material-experimental/mdc-table/table-multiple-header-footer/table-multiple-header-footer-example.ts b/src/components-examples/material/legacy-table/table-multiple-header-footer/table-multiple-header-footer-example.ts
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-multiple-header-footer/table-multiple-header-footer-example.ts
rename to src/components-examples/material/legacy-table/table-multiple-header-footer/table-multiple-header-footer-example.ts
diff --git a/src/components-examples/material-experimental/mdc-table/table-overview/table-overview-example.css b/src/components-examples/material/legacy-table/table-overview/table-overview-example.css
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-overview/table-overview-example.css
rename to src/components-examples/material/legacy-table/table-overview/table-overview-example.css
diff --git a/src/components-examples/material-experimental/mdc-table/table-overview/table-overview-example.html b/src/components-examples/material/legacy-table/table-overview/table-overview-example.html
similarity index 93%
rename from src/components-examples/material-experimental/mdc-table/table-overview/table-overview-example.html
rename to src/components-examples/material/legacy-table/table-overview/table-overview-example.html
index 601acbfe9675..880c07608504 100644
--- a/src/components-examples/material-experimental/mdc-table/table-overview/table-overview-example.html
+++ b/src/components-examples/material/legacy-table/table-overview/table-overview-example.html
@@ -39,6 +39,5 @@
-
+
-
diff --git a/src/components-examples/material-experimental/mdc-table/table-overview/table-overview-example.ts b/src/components-examples/material/legacy-table/table-overview/table-overview-example.ts
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-overview/table-overview-example.ts
rename to src/components-examples/material/legacy-table/table-overview/table-overview-example.ts
diff --git a/src/components-examples/material-experimental/mdc-table/table-pagination/table-pagination-example.css b/src/components-examples/material/legacy-table/table-pagination/table-pagination-example.css
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-pagination/table-pagination-example.css
rename to src/components-examples/material/legacy-table/table-pagination/table-pagination-example.css
diff --git a/src/components-examples/material-experimental/mdc-table/table-pagination/table-pagination-example.html b/src/components-examples/material/legacy-table/table-pagination/table-pagination-example.html
similarity index 86%
rename from src/components-examples/material-experimental/mdc-table/table-pagination/table-pagination-example.html
rename to src/components-examples/material/legacy-table/table-pagination/table-pagination-example.html
index a410ebbe9d05..c7c5e005baa5 100644
--- a/src/components-examples/material-experimental/mdc-table/table-pagination/table-pagination-example.html
+++ b/src/components-examples/material/legacy-table/table-pagination/table-pagination-example.html
@@ -29,5 +29,8 @@
-
+
+
diff --git a/src/components-examples/material-experimental/mdc-table/table-pagination/table-pagination-example.ts b/src/components-examples/material/legacy-table/table-pagination/table-pagination-example.ts
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-pagination/table-pagination-example.ts
rename to src/components-examples/material/legacy-table/table-pagination/table-pagination-example.ts
diff --git a/src/components-examples/material-experimental/mdc-table/table-recycle-rows/table-recycle-rows-example.css b/src/components-examples/material/legacy-table/table-recycle-rows/table-recycle-rows-example.css
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-recycle-rows/table-recycle-rows-example.css
rename to src/components-examples/material/legacy-table/table-recycle-rows/table-recycle-rows-example.css
diff --git a/src/components-examples/material-experimental/mdc-table/table-recycle-rows/table-recycle-rows-example.html b/src/components-examples/material/legacy-table/table-recycle-rows/table-recycle-rows-example.html
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-recycle-rows/table-recycle-rows-example.html
rename to src/components-examples/material/legacy-table/table-recycle-rows/table-recycle-rows-example.html
diff --git a/src/components-examples/material-experimental/mdc-table/table-recycle-rows/table-recycle-rows-example.ts b/src/components-examples/material/legacy-table/table-recycle-rows/table-recycle-rows-example.ts
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-recycle-rows/table-recycle-rows-example.ts
rename to src/components-examples/material/legacy-table/table-recycle-rows/table-recycle-rows-example.ts
diff --git a/src/components-examples/material-experimental/mdc-table/table-reorderable/table-reorderable-example.css b/src/components-examples/material/legacy-table/table-reorderable/table-reorderable-example.css
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-reorderable/table-reorderable-example.css
rename to src/components-examples/material/legacy-table/table-reorderable/table-reorderable-example.css
diff --git a/src/components-examples/material-experimental/mdc-table/table-reorderable/table-reorderable-example.html b/src/components-examples/material/legacy-table/table-reorderable/table-reorderable-example.html
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-reorderable/table-reorderable-example.html
rename to src/components-examples/material/legacy-table/table-reorderable/table-reorderable-example.html
diff --git a/src/components-examples/material-experimental/mdc-table/table-reorderable/table-reorderable-example.ts b/src/components-examples/material/legacy-table/table-reorderable/table-reorderable-example.ts
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-reorderable/table-reorderable-example.ts
rename to src/components-examples/material/legacy-table/table-reorderable/table-reorderable-example.ts
diff --git a/src/components-examples/material-experimental/mdc-table/table-row-binding/table-row-binding-example.css b/src/components-examples/material/legacy-table/table-row-binding/table-row-binding-example.css
similarity index 76%
rename from src/components-examples/material-experimental/mdc-table/table-row-binding/table-row-binding-example.css
rename to src/components-examples/material/legacy-table/table-row-binding/table-row-binding-example.css
index bfac75fd45c6..76a479d66d07 100644
--- a/src/components-examples/material-experimental/mdc-table/table-row-binding/table-row-binding-example.css
+++ b/src/components-examples/material/legacy-table/table-row-binding/table-row-binding-example.css
@@ -2,13 +2,13 @@
width: 100%;
}
-.mat-mdc-row .mat-mdc-cell {
+.mat-row .mat-cell {
border-bottom: 1px solid transparent;
border-top: 1px solid transparent;
cursor: pointer;
}
-.mat-mdc-row:hover .mat-mdc-cell {
+.mat-row:hover .mat-cell {
border-color: currentColor;
}
diff --git a/src/components-examples/material-experimental/mdc-table/table-row-binding/table-row-binding-example.html b/src/components-examples/material/legacy-table/table-row-binding/table-row-binding-example.html
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-row-binding/table-row-binding-example.html
rename to src/components-examples/material/legacy-table/table-row-binding/table-row-binding-example.html
diff --git a/src/components-examples/material-experimental/mdc-table/table-row-binding/table-row-binding-example.ts b/src/components-examples/material/legacy-table/table-row-binding/table-row-binding-example.ts
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-row-binding/table-row-binding-example.ts
rename to src/components-examples/material/legacy-table/table-row-binding/table-row-binding-example.ts
diff --git a/src/components-examples/material-experimental/mdc-table/table-row-context/table-row-context-example.css b/src/components-examples/material/legacy-table/table-row-context/table-row-context-example.css
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-row-context/table-row-context-example.css
rename to src/components-examples/material/legacy-table/table-row-context/table-row-context-example.css
diff --git a/src/components-examples/material-experimental/mdc-table/table-row-context/table-row-context-example.html b/src/components-examples/material/legacy-table/table-row-context/table-row-context-example.html
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-row-context/table-row-context-example.html
rename to src/components-examples/material/legacy-table/table-row-context/table-row-context-example.html
diff --git a/src/components-examples/material-experimental/mdc-table/table-row-context/table-row-context-example.ts b/src/components-examples/material/legacy-table/table-row-context/table-row-context-example.ts
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-row-context/table-row-context-example.ts
rename to src/components-examples/material/legacy-table/table-row-context/table-row-context-example.ts
diff --git a/src/components-examples/material-experimental/mdc-table/table-selection/table-selection-example.css b/src/components-examples/material/legacy-table/table-selection/table-selection-example.css
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-selection/table-selection-example.css
rename to src/components-examples/material/legacy-table/table-selection/table-selection-example.css
diff --git a/src/components-examples/material-experimental/mdc-table/table-selection/table-selection-example.html b/src/components-examples/material/legacy-table/table-selection/table-selection-example.html
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-selection/table-selection-example.html
rename to src/components-examples/material/legacy-table/table-selection/table-selection-example.html
diff --git a/src/components-examples/material-experimental/mdc-table/table-selection/table-selection-example.ts b/src/components-examples/material/legacy-table/table-selection/table-selection-example.ts
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-selection/table-selection-example.ts
rename to src/components-examples/material/legacy-table/table-selection/table-selection-example.ts
diff --git a/src/components-examples/material-experimental/mdc-table/table-sorting/table-sorting-example.css b/src/components-examples/material/legacy-table/table-sorting/table-sorting-example.css
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-sorting/table-sorting-example.css
rename to src/components-examples/material/legacy-table/table-sorting/table-sorting-example.css
diff --git a/src/components-examples/material-experimental/mdc-table/table-sorting/table-sorting-example.html b/src/components-examples/material/legacy-table/table-sorting/table-sorting-example.html
similarity index 55%
rename from src/components-examples/material-experimental/mdc-table/table-sorting/table-sorting-example.html
rename to src/components-examples/material/legacy-table/table-sorting/table-sorting-example.html
index 977bed07a81f..e11776461d7a 100644
--- a/src/components-examples/material-experimental/mdc-table/table-sorting/table-sorting-example.html
+++ b/src/components-examples/material/legacy-table/table-sorting/table-sorting-example.html
@@ -1,26 +1,35 @@
-
+
- No. |
+
+ No.
+ |
{{element.position}} |
- Name |
+
+ Name
+ |
{{element.name}} |
- Weight |
+
+ Weight
+ |
{{element.weight}} |
- Symbol |
+
+ Symbol
+ |
{{element.symbol}} |
diff --git a/src/components-examples/material-experimental/mdc-table/table-sorting/table-sorting-example.ts b/src/components-examples/material/legacy-table/table-sorting/table-sorting-example.ts
similarity index 66%
rename from src/components-examples/material-experimental/mdc-table/table-sorting/table-sorting-example.ts
rename to src/components-examples/material/legacy-table/table-sorting/table-sorting-example.ts
index 79b42c091a3c..9fd6f3c83514 100644
--- a/src/components-examples/material-experimental/mdc-table/table-sorting/table-sorting-example.ts
+++ b/src/components-examples/material/legacy-table/table-sorting/table-sorting-example.ts
@@ -1,5 +1,6 @@
+import {LiveAnnouncer} from '@angular/cdk/a11y';
import {AfterViewInit, Component, ViewChild} from '@angular/core';
-import {MatSort} from '@angular/material/sort';
+import {MatSort, Sort} from '@angular/material/sort';
import {MatLegacyTableDataSource} from '@angular/material/legacy-table';
export interface PeriodicElement {
@@ -34,9 +35,24 @@ export class TableSortingExample implements AfterViewInit {
displayedColumns: string[] = ['position', 'name', 'weight', 'symbol'];
dataSource = new MatLegacyTableDataSource(ELEMENT_DATA);
+ constructor(private _liveAnnouncer: LiveAnnouncer) {}
+
@ViewChild(MatSort) sort: MatSort;
ngAfterViewInit() {
this.dataSource.sort = this.sort;
}
+
+ /** Announce the change in sort state for assistive technology. */
+ announceSortChange(sortState: Sort) {
+ // This example uses English messages. If your application supports
+ // multiple language, you would internationalize these strings.
+ // Furthermore, you can customize the message to add additional
+ // details about the values being sorted.
+ if (sortState.direction) {
+ this._liveAnnouncer.announce(`Sorted ${sortState.direction}ending`);
+ } else {
+ this._liveAnnouncer.announce('Sorting cleared');
+ }
+ }
}
diff --git a/src/components-examples/material-experimental/mdc-table/table-sticky-columns/table-sticky-columns-example.css b/src/components-examples/material/legacy-table/table-sticky-columns/table-sticky-columns-example.css
similarity index 79%
rename from src/components-examples/material-experimental/mdc-table/table-sticky-columns/table-sticky-columns-example.css
rename to src/components-examples/material/legacy-table/table-sticky-columns/table-sticky-columns-example.css
index b931bfc6acc6..52262aad13cf 100644
--- a/src/components-examples/material-experimental/mdc-table/table-sticky-columns/table-sticky-columns-example.css
+++ b/src/components-examples/material/legacy-table/table-sticky-columns/table-sticky-columns-example.css
@@ -18,10 +18,10 @@ th.mat-column-position, td.mat-column-position {
padding-left: 8px;
}
-.mat-mdc-table-sticky-border-elem-right {
+.mat-table-sticky-border-elem-right {
border-left: 1px solid #e0e0e0;
}
-.mat-mdc-table-sticky-border-elem-left {
+.mat-table-sticky-border-elem-left {
border-right: 1px solid #e0e0e0;
}
diff --git a/src/components-examples/material-experimental/mdc-table/table-sticky-columns/table-sticky-columns-example.html b/src/components-examples/material/legacy-table/table-sticky-columns/table-sticky-columns-example.html
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-sticky-columns/table-sticky-columns-example.html
rename to src/components-examples/material/legacy-table/table-sticky-columns/table-sticky-columns-example.html
diff --git a/src/components-examples/material-experimental/mdc-table/table-sticky-columns/table-sticky-columns-example.ts b/src/components-examples/material/legacy-table/table-sticky-columns/table-sticky-columns-example.ts
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-sticky-columns/table-sticky-columns-example.ts
rename to src/components-examples/material/legacy-table/table-sticky-columns/table-sticky-columns-example.ts
diff --git a/src/components-examples/material-experimental/mdc-table/table-sticky-complex-flex/table-sticky-complex-flex-example.css b/src/components-examples/material/legacy-table/table-sticky-complex-flex/table-sticky-complex-flex-example.css
similarity index 61%
rename from src/components-examples/material-experimental/mdc-table/table-sticky-complex-flex/table-sticky-complex-flex-example.css
rename to src/components-examples/material/legacy-table/table-sticky-complex-flex/table-sticky-complex-flex-example.css
index e1a4540ba09a..32cefbf61d4a 100644
--- a/src/components-examples/material-experimental/mdc-table/table-sticky-complex-flex/table-sticky-complex-flex-example.css
+++ b/src/components-examples/material/legacy-table/table-sticky-complex-flex/table-sticky-complex-flex-example.css
@@ -3,7 +3,7 @@
overflow: auto;
}
-.mat-mdc-table-sticky {
+.mat-table-sticky {
background: #59abfd;
opacity: 1;
}
@@ -18,27 +18,27 @@
text-align: center;
}
-.mat-mdc-header-cell, .mat-mdc-footer-cell, .mat-mdc-cell {
+.mat-header-cell, .mat-footer-cell, .mat-cell {
min-width: 80px;
box-sizing: border-box;
}
-.mat-mdc-header-row, .mat-mdc-footer-row, .mat-mdc-row {
+.mat-header-row, .mat-footer-row, .mat-row {
min-width: 1920px; /* 24 columns, 80px each */
}
-.mat-mdc-table-sticky-border-elem-top {
+.mat-table-sticky-border-elem-top {
border-bottom: 2px solid midnightblue;
}
-.mat-mdc-table-sticky-border-elem-right {
+.mat-table-sticky-border-elem-right {
border-left: 2px solid midnightblue;
}
-.mat-mdc-table-sticky-border-elem-bottom {
+.mat-table-sticky-border-elem-bottom {
border-top: 2px solid midnightblue;
}
-.mat-mdc-table-sticky-border-elem-left {
+.mat-table-sticky-border-elem-left {
border-right: 2px solid midnightblue;
}
diff --git a/src/components-examples/material-experimental/mdc-table/table-sticky-complex-flex/table-sticky-complex-flex-example.html b/src/components-examples/material/legacy-table/table-sticky-complex-flex/table-sticky-complex-flex-example.html
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-sticky-complex-flex/table-sticky-complex-flex-example.html
rename to src/components-examples/material/legacy-table/table-sticky-complex-flex/table-sticky-complex-flex-example.html
diff --git a/src/components-examples/material-experimental/mdc-table/table-sticky-complex-flex/table-sticky-complex-flex-example.ts b/src/components-examples/material/legacy-table/table-sticky-complex-flex/table-sticky-complex-flex-example.ts
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-sticky-complex-flex/table-sticky-complex-flex-example.ts
rename to src/components-examples/material/legacy-table/table-sticky-complex-flex/table-sticky-complex-flex-example.ts
diff --git a/src/components-examples/material-experimental/mdc-table/table-sticky-complex/table-sticky-complex-example.css b/src/components-examples/material/legacy-table/table-sticky-complex/table-sticky-complex-example.css
similarity index 64%
rename from src/components-examples/material-experimental/mdc-table/table-sticky-complex/table-sticky-complex-example.css
rename to src/components-examples/material/legacy-table/table-sticky-complex/table-sticky-complex-example.css
index 8bb485e0dd04..155ce9ef09ec 100644
--- a/src/components-examples/material-experimental/mdc-table/table-sticky-complex/table-sticky-complex-example.css
+++ b/src/components-examples/material/legacy-table/table-sticky-complex/table-sticky-complex-example.css
@@ -3,7 +3,7 @@
overflow: auto;
}
-.mat-mdc-table-sticky {
+.mat-table-sticky {
background: #59abfd;
opacity: 1;
}
@@ -18,23 +18,23 @@
text-align: center;
}
-.mat-mdc-header-cell, .mat-mdc-footer-cell, .mat-mdc-cell {
+.mat-header-cell, .mat-footer-cell, .mat-cell {
min-width: 80px;
box-sizing: border-box;
}
-.mat-mdc-table-sticky-border-elem-top {
+.mat-table-sticky-border-elem-top {
border-bottom: 2px solid midnightblue;
}
-.mat-mdc-table-sticky-border-elem-right {
+.mat-table-sticky-border-elem-right {
border-left: 2px solid midnightblue;
}
-.mat-mdc-table-sticky-border-elem-bottom {
+.mat-table-sticky-border-elem-bottom {
border-top: 2px solid midnightblue;
}
-.mat-mdc-table-sticky-border-elem-left {
+.mat-table-sticky-border-elem-left {
border-right: 2px solid midnightblue;
}
diff --git a/src/components-examples/material-experimental/mdc-table/table-sticky-complex/table-sticky-complex-example.html b/src/components-examples/material/legacy-table/table-sticky-complex/table-sticky-complex-example.html
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-sticky-complex/table-sticky-complex-example.html
rename to src/components-examples/material/legacy-table/table-sticky-complex/table-sticky-complex-example.html
diff --git a/src/components-examples/material-experimental/mdc-table/table-sticky-complex/table-sticky-complex-example.ts b/src/components-examples/material/legacy-table/table-sticky-complex/table-sticky-complex-example.ts
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-sticky-complex/table-sticky-complex-example.ts
rename to src/components-examples/material/legacy-table/table-sticky-complex/table-sticky-complex-example.ts
diff --git a/src/components-examples/material-experimental/mdc-table/table-sticky-footer/table-sticky-footer-example.css b/src/components-examples/material/legacy-table/table-sticky-footer/table-sticky-footer-example.css
similarity index 75%
rename from src/components-examples/material-experimental/mdc-table/table-sticky-footer/table-sticky-footer-example.css
rename to src/components-examples/material/legacy-table/table-sticky-footer/table-sticky-footer-example.css
index 2afe062fed7a..6b5869e7c72b 100644
--- a/src/components-examples/material-experimental/mdc-table/table-sticky-footer/table-sticky-footer-example.css
+++ b/src/components-examples/material/legacy-table/table-sticky-footer/table-sticky-footer-example.css
@@ -7,10 +7,10 @@ table {
width: 100%;
}
-tr.mat-mdc-footer-row {
+tr.mat-footer-row {
font-weight: bold;
}
-.mat-mdc-table-sticky {
+.mat-table-sticky {
border-top: 1px solid #e0e0e0;
}
diff --git a/src/components-examples/material-experimental/mdc-table/table-sticky-footer/table-sticky-footer-example.html b/src/components-examples/material/legacy-table/table-sticky-footer/table-sticky-footer-example.html
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-sticky-footer/table-sticky-footer-example.html
rename to src/components-examples/material/legacy-table/table-sticky-footer/table-sticky-footer-example.html
diff --git a/src/components-examples/material-experimental/mdc-table/table-sticky-footer/table-sticky-footer-example.ts b/src/components-examples/material/legacy-table/table-sticky-footer/table-sticky-footer-example.ts
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-sticky-footer/table-sticky-footer-example.ts
rename to src/components-examples/material/legacy-table/table-sticky-footer/table-sticky-footer-example.ts
diff --git a/src/components-examples/material-experimental/mdc-table/table-sticky-header/table-sticky-header-example.css b/src/components-examples/material/legacy-table/table-sticky-header/table-sticky-header-example.css
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-sticky-header/table-sticky-header-example.css
rename to src/components-examples/material/legacy-table/table-sticky-header/table-sticky-header-example.css
diff --git a/src/components-examples/material-experimental/mdc-table/table-sticky-header/table-sticky-header-example.html b/src/components-examples/material/legacy-table/table-sticky-header/table-sticky-header-example.html
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-sticky-header/table-sticky-header-example.html
rename to src/components-examples/material/legacy-table/table-sticky-header/table-sticky-header-example.html
diff --git a/src/components-examples/material-experimental/mdc-table/table-sticky-header/table-sticky-header-example.ts b/src/components-examples/material/legacy-table/table-sticky-header/table-sticky-header-example.ts
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-sticky-header/table-sticky-header-example.ts
rename to src/components-examples/material/legacy-table/table-sticky-header/table-sticky-header-example.ts
diff --git a/src/components-examples/material-experimental/mdc-table/table-text-column-advanced/table-text-column-advanced-example.css b/src/components-examples/material/legacy-table/table-text-column-advanced/table-text-column-advanced-example.css
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-text-column-advanced/table-text-column-advanced-example.css
rename to src/components-examples/material/legacy-table/table-text-column-advanced/table-text-column-advanced-example.css
diff --git a/src/components-examples/material-experimental/mdc-table/table-text-column-advanced/table-text-column-advanced-example.html b/src/components-examples/material/legacy-table/table-text-column-advanced/table-text-column-advanced-example.html
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-text-column-advanced/table-text-column-advanced-example.html
rename to src/components-examples/material/legacy-table/table-text-column-advanced/table-text-column-advanced-example.html
diff --git a/src/components-examples/material-experimental/mdc-table/table-text-column-advanced/table-text-column-advanced-example.ts b/src/components-examples/material/legacy-table/table-text-column-advanced/table-text-column-advanced-example.ts
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-text-column-advanced/table-text-column-advanced-example.ts
rename to src/components-examples/material/legacy-table/table-text-column-advanced/table-text-column-advanced-example.ts
diff --git a/src/components-examples/material-experimental/mdc-table/table-text-column/table-text-column-example.css b/src/components-examples/material/legacy-table/table-text-column/table-text-column-example.css
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-text-column/table-text-column-example.css
rename to src/components-examples/material/legacy-table/table-text-column/table-text-column-example.css
diff --git a/src/components-examples/material-experimental/mdc-table/table-text-column/table-text-column-example.html b/src/components-examples/material/legacy-table/table-text-column/table-text-column-example.html
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-text-column/table-text-column-example.html
rename to src/components-examples/material/legacy-table/table-text-column/table-text-column-example.html
diff --git a/src/components-examples/material-experimental/mdc-table/table-text-column/table-text-column-example.ts b/src/components-examples/material/legacy-table/table-text-column/table-text-column-example.ts
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-text-column/table-text-column-example.ts
rename to src/components-examples/material/legacy-table/table-text-column/table-text-column-example.ts
diff --git a/src/components-examples/material-experimental/mdc-table/table-with-ripples/table-with-ripples-example.css b/src/components-examples/material/legacy-table/table-with-ripples/table-with-ripples-example.css
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-with-ripples/table-with-ripples-example.css
rename to src/components-examples/material/legacy-table/table-with-ripples/table-with-ripples-example.css
diff --git a/src/components-examples/material-experimental/mdc-table/table-with-ripples/table-with-ripples-example.html b/src/components-examples/material/legacy-table/table-with-ripples/table-with-ripples-example.html
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-with-ripples/table-with-ripples-example.html
rename to src/components-examples/material/legacy-table/table-with-ripples/table-with-ripples-example.html
diff --git a/src/components-examples/material-experimental/mdc-table/table-with-ripples/table-with-ripples-example.ts b/src/components-examples/material/legacy-table/table-with-ripples/table-with-ripples-example.ts
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-with-ripples/table-with-ripples-example.ts
rename to src/components-examples/material/legacy-table/table-with-ripples/table-with-ripples-example.ts
diff --git a/src/components-examples/material-experimental/mdc-table/table-wrapped/table-wrapped-example.css b/src/components-examples/material/legacy-table/table-wrapped/table-wrapped-example.css
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-wrapped/table-wrapped-example.css
rename to src/components-examples/material/legacy-table/table-wrapped/table-wrapped-example.css
diff --git a/src/components-examples/material-experimental/mdc-table/table-wrapped/table-wrapped-example.html b/src/components-examples/material/legacy-table/table-wrapped/table-wrapped-example.html
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-wrapped/table-wrapped-example.html
rename to src/components-examples/material/legacy-table/table-wrapped/table-wrapped-example.html
diff --git a/src/components-examples/material-experimental/mdc-table/table-wrapped/table-wrapped-example.ts b/src/components-examples/material/legacy-table/table-wrapped/table-wrapped-example.ts
similarity index 78%
rename from src/components-examples/material-experimental/mdc-table/table-wrapped/table-wrapped-example.ts
rename to src/components-examples/material/legacy-table/table-wrapped/table-wrapped-example.ts
index f8b049cdb7da..931a5c740261 100644
--- a/src/components-examples/material-experimental/mdc-table/table-wrapped/table-wrapped-example.ts
+++ b/src/components-examples/material/legacy-table/table-wrapped/table-wrapped-example.ts
@@ -11,13 +11,13 @@ import {
} from '@angular/core';
import {MatSort} from '@angular/material/sort';
import {
- MatColumnDef,
- MatHeaderRowDef,
- MatNoDataRow,
- MatRowDef,
- MatTable,
- MatTableDataSource,
-} from '@angular/material/table';
+ MatLegacyColumnDef,
+ MatLegacyHeaderRowDef,
+ MatLegacyNoDataRow,
+ MatLegacyRowDef,
+ MatLegacyTable,
+ MatLegacyTableDataSource,
+} from '@angular/material/legacy-table';
export interface PeriodicElement {
name: string;
@@ -49,7 +49,7 @@ const ELEMENT_DATA: PeriodicElement[] = [
})
export class TableWrappedExample implements AfterViewInit {
displayedColumns: string[] = ['position', 'name', 'weight', 'symbol'];
- dataSource = new MatTableDataSource(ELEMENT_DATA);
+ dataSource = new MatLegacyTableDataSource(ELEMENT_DATA);
@ViewChild('sort') sort: MatSort;
@@ -82,12 +82,12 @@ export class TableWrappedExample implements AfterViewInit {
],
})
export class WrapperTable implements AfterContentInit {
- @ContentChildren(MatHeaderRowDef) headerRowDefs: QueryList;
- @ContentChildren(MatRowDef) rowDefs: QueryList>;
- @ContentChildren(MatColumnDef) columnDefs: QueryList;
- @ContentChild(MatNoDataRow) noDataRow: MatNoDataRow;
+ @ContentChildren(MatLegacyHeaderRowDef) headerRowDefs: QueryList;
+ @ContentChildren(MatLegacyRowDef) rowDefs: QueryList>;
+ @ContentChildren(MatLegacyColumnDef) columnDefs: QueryList;
+ @ContentChild(MatLegacyNoDataRow) noDataRow: MatLegacyNoDataRow;
- @ViewChild(MatTable, {static: true}) table: MatTable;
+ @ViewChild(MatLegacyTable, {static: true}) table: MatLegacyTable;
@Input() columns: string[];
diff --git a/src/components-examples/material-experimental/mdc-table/table-wrapped/wrapper-table.html b/src/components-examples/material/legacy-table/table-wrapped/wrapper-table.html
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-wrapped/wrapper-table.html
rename to src/components-examples/material/legacy-table/table-wrapped/wrapper-table.html
diff --git a/src/components-examples/material/table/BUILD.bazel b/src/components-examples/material/table/BUILD.bazel
index 3ce19289175c..7edfe39c2f6e 100644
--- a/src/components-examples/material/table/BUILD.bazel
+++ b/src/components-examples/material/table/BUILD.bazel
@@ -24,10 +24,10 @@ ng_module(
"//src/material/legacy-checkbox",
"//src/material/legacy-input",
"//src/material/legacy-paginator",
- "//src/material/legacy-progress-spinner",
- "//src/material/legacy-table",
- "//src/material/legacy-table/testing",
+ "//src/material/progress-spinner",
"//src/material/sort",
+ "//src/material/table",
+ "//src/material/table/testing",
"@npm//@angular/platform-browser",
"@npm//@angular/platform-browser-dynamic",
"@npm//@types/jasmine",
@@ -50,8 +50,8 @@ ng_test_library(
":table",
"//src/cdk/testing",
"//src/cdk/testing/testbed",
- "//src/material/legacy-table",
- "//src/material/legacy-table/testing",
+ "//src/material/table",
+ "//src/material/table/testing",
"@npm//@angular/platform-browser-dynamic",
],
)
diff --git a/src/components-examples/material/table/index.ts b/src/components-examples/material/table/index.ts
index 385829e894b9..e7c4e4f1e118 100644
--- a/src/components-examples/material/table/index.ts
+++ b/src/components-examples/material/table/index.ts
@@ -9,7 +9,7 @@ import {MatLegacyInputModule} from '@angular/material/legacy-input';
import {MatLegacyPaginatorModule} from '@angular/material/legacy-paginator';
import {MatLegacyProgressSpinnerModule} from '@angular/material/legacy-progress-spinner';
import {MatSortModule} from '@angular/material/sort';
-import {MatLegacyTableModule} from '@angular/material/legacy-table';
+import {MatTableModule} from '@angular/material/table';
import {DragDropModule} from '@angular/cdk/drag-drop';
import {CdkTableModule} from '@angular/cdk/table';
@@ -43,6 +43,7 @@ import {TableRowBindingExample} from './table-row-binding/table-row-binding-exam
import {TableDynamicArrayDataExample} from './table-dynamic-array-data/table-dynamic-array-data-example';
import {TableDynamicObservableDataExample} from './table-dynamic-observable-data/table-dynamic-observable-data-example';
import {TableGeneratedColumnsExample} from './table-generated-columns/table-generated-columns-example';
+import {TableFlexLargeRowExample} from './table-flex-large-row/table-flex-large-row-example';
export {
TableBasicExample,
@@ -53,6 +54,7 @@ export {
TableExpandableRowsExample,
TableFilteringExample,
TableFlexBasicExample,
+ TableFlexLargeRowExample,
TableFooterRowExample,
TableGeneratedColumnsExample,
TableHarnessExample,
@@ -87,6 +89,7 @@ const EXAMPLES = [
TableExpandableRowsExample,
TableFilteringExample,
TableFlexBasicExample,
+ TableFlexLargeRowExample,
TableFooterRowExample,
TableGeneratedColumnsExample,
TableHarnessExample,
@@ -124,7 +127,7 @@ const EXAMPLES = [
MatLegacyProgressSpinnerModule,
MatRippleModule,
MatSortModule,
- MatLegacyTableModule,
+ MatTableModule,
CdkTableModule,
DragDropModule,
],
diff --git a/src/components-examples/material/table/table-dynamic-array-data/table-dynamic-array-data-example.ts b/src/components-examples/material/table/table-dynamic-array-data/table-dynamic-array-data-example.ts
index 8fde49de360f..bea1ba614316 100644
--- a/src/components-examples/material/table/table-dynamic-array-data/table-dynamic-array-data-example.ts
+++ b/src/components-examples/material/table/table-dynamic-array-data/table-dynamic-array-data-example.ts
@@ -1,5 +1,5 @@
import {Component, ViewChild} from '@angular/core';
-import {MatLegacyTable} from '@angular/material/legacy-table';
+import {MatTable} from '@angular/material/table';
export interface PeriodicElement {
name: string;
@@ -33,7 +33,7 @@ export class TableDynamicArrayDataExample {
displayedColumns: string[] = ['position', 'name', 'weight', 'symbol'];
dataSource = [...ELEMENT_DATA];
- @ViewChild(MatLegacyTable) table: MatLegacyTable;
+ @ViewChild(MatTable) table: MatTable;
addData() {
const randomElementIndex = Math.floor(Math.random() * ELEMENT_DATA.length);
diff --git a/src/components-examples/material/table/table-filtering/table-filtering-example.ts b/src/components-examples/material/table/table-filtering/table-filtering-example.ts
index 400d7e54fd63..f24acf8cdd1f 100644
--- a/src/components-examples/material/table/table-filtering/table-filtering-example.ts
+++ b/src/components-examples/material/table/table-filtering/table-filtering-example.ts
@@ -1,5 +1,5 @@
import {Component} from '@angular/core';
-import {MatLegacyTableDataSource} from '@angular/material/legacy-table';
+import {MatTableDataSource} from '@angular/material/table';
export interface PeriodicElement {
name: string;
@@ -31,7 +31,7 @@ const ELEMENT_DATA: PeriodicElement[] = [
})
export class TableFilteringExample {
displayedColumns: string[] = ['position', 'name', 'weight', 'symbol'];
- dataSource = new MatLegacyTableDataSource(ELEMENT_DATA);
+ dataSource = new MatTableDataSource(ELEMENT_DATA);
applyFilter(event: Event) {
const filterValue = (event.target as HTMLInputElement).value;
diff --git a/src/components-examples/material-experimental/mdc-table/table-flex-large-row/table-flex-large-row-example.css b/src/components-examples/material/table/table-flex-large-row/table-flex-large-row-example.css
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-flex-large-row/table-flex-large-row-example.css
rename to src/components-examples/material/table/table-flex-large-row/table-flex-large-row-example.css
diff --git a/src/components-examples/material-experimental/mdc-table/table-flex-large-row/table-flex-large-row-example.html b/src/components-examples/material/table/table-flex-large-row/table-flex-large-row-example.html
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-flex-large-row/table-flex-large-row-example.html
rename to src/components-examples/material/table/table-flex-large-row/table-flex-large-row-example.html
diff --git a/src/components-examples/material-experimental/mdc-table/table-flex-large-row/table-flex-large-row-example.ts b/src/components-examples/material/table/table-flex-large-row/table-flex-large-row-example.ts
similarity index 100%
rename from src/components-examples/material-experimental/mdc-table/table-flex-large-row/table-flex-large-row-example.ts
rename to src/components-examples/material/table/table-flex-large-row/table-flex-large-row-example.ts
diff --git a/src/components-examples/material/table/table-footer-row/table-footer-row-example.css b/src/components-examples/material/table/table-footer-row/table-footer-row-example.css
index de64c6e53694..53ef90725254 100644
--- a/src/components-examples/material/table/table-footer-row/table-footer-row-example.css
+++ b/src/components-examples/material/table/table-footer-row/table-footer-row-example.css
@@ -2,6 +2,6 @@ table {
width: 100%;
}
-tr.mat-footer-row {
+tr.mat-mdc-footer-row td {
font-weight: bold;
}
diff --git a/src/components-examples/material/table/table-harness/table-harness-example.spec.ts b/src/components-examples/material/table/table-harness/table-harness-example.spec.ts
index 3316435feba7..89d9ded55bf5 100644
--- a/src/components-examples/material/table/table-harness/table-harness-example.spec.ts
+++ b/src/components-examples/material/table/table-harness/table-harness-example.spec.ts
@@ -1,8 +1,8 @@
import {ComponentFixture, TestBed} from '@angular/core/testing';
import {TestbedHarnessEnvironment} from '@angular/cdk/testing/testbed';
-import {MatLegacyTableHarness} from '@angular/material/legacy-table/testing';
+import {MatTableHarness} from '@angular/material/table/testing';
import {HarnessLoader, parallel} from '@angular/cdk/testing';
-import {MatLegacyTableModule} from '@angular/material/legacy-table';
+import {MatTableModule} from '@angular/material/table';
import {TableHarnessExample} from './table-harness-example';
describe('TableHarnessExample', () => {
@@ -11,7 +11,7 @@ describe('TableHarnessExample', () => {
beforeEach(async () => {
await TestBed.configureTestingModule({
- imports: [MatLegacyTableModule],
+ imports: [MatTableModule],
declarations: [TableHarnessExample],
}).compileComponents();
fixture = TestBed.createComponent(TableHarnessExample);
@@ -20,12 +20,12 @@ describe('TableHarnessExample', () => {
});
it('should load harness for a table', async () => {
- const tables = await loader.getAllHarnesses(MatLegacyTableHarness);
+ const tables = await loader.getAllHarnesses(MatTableHarness);
expect(tables.length).toBe(1);
});
it('should get the different kinds of rows in the table', async () => {
- const table = await loader.getHarness(MatLegacyTableHarness);
+ const table = await loader.getHarness(MatTableHarness);
const headerRows = await table.getHeaderRows();
const footerRows = await table.getFooterRows();
const rows = await table.getRows();
@@ -35,7 +35,7 @@ describe('TableHarnessExample', () => {
});
it('should get cells inside a row', async () => {
- const table = await loader.getHarness(MatLegacyTableHarness);
+ const table = await loader.getHarness(MatTableHarness);
const headerRows = await table.getHeaderRows();
const footerRows = await table.getFooterRows();
const rows = await table.getRows();
@@ -53,7 +53,7 @@ describe('TableHarnessExample', () => {
});
it('should be able to get the text of a cell', async () => {
- const table = await loader.getHarness(MatLegacyTableHarness);
+ const table = await loader.getHarness(MatTableHarness);
const secondRow = (await table.getRows())[1];
const cells = await secondRow.getCells();
const cellTexts = await parallel(() => cells.map(cell => cell.getText()));
@@ -61,7 +61,7 @@ describe('TableHarnessExample', () => {
});
it('should be able to get the column name of a cell', async () => {
- const table = await loader.getHarness(MatLegacyTableHarness);
+ const table = await loader.getHarness(MatTableHarness);
const fifthRow = (await table.getRows())[1];
const cells = await fifthRow.getCells();
const cellColumnNames = await parallel(() => cells.map(cell => cell.getColumnName()));
@@ -69,7 +69,7 @@ describe('TableHarnessExample', () => {
});
it('should be able to filter cells by text', async () => {
- const table = await loader.getHarness(MatLegacyTableHarness);
+ const table = await loader.getHarness(MatTableHarness);
const firstRow = (await table.getRows())[0];
const cells = await firstRow.getCells({text: '1.0079'});
const cellTexts = await parallel(() => cells.map(cell => cell.getText()));
@@ -77,7 +77,7 @@ describe('TableHarnessExample', () => {
});
it('should be able to filter cells by column name', async () => {
- const table = await loader.getHarness(MatLegacyTableHarness);
+ const table = await loader.getHarness(MatTableHarness);
const firstRow = (await table.getRows())[0];
const cells = await firstRow.getCells({columnName: 'symbol'});
const cellTexts = await parallel(() => cells.map(cell => cell.getText()));
diff --git a/src/components-examples/material/table/table-overview/table-overview-example.html b/src/components-examples/material/table/table-overview/table-overview-example.html
index 880c07608504..e91ebfbe2ea1 100644
--- a/src/components-examples/material/table/table-overview/table-overview-example.html
+++ b/src/components-examples/material/table/table-overview/table-overview-example.html
@@ -41,3 +41,4 @@
+
diff --git a/src/components-examples/material/table/table-overview/table-overview-example.ts b/src/components-examples/material/table/table-overview/table-overview-example.ts
index ab58f89960d3..bea833f685b8 100644
--- a/src/components-examples/material/table/table-overview/table-overview-example.ts
+++ b/src/components-examples/material/table/table-overview/table-overview-example.ts
@@ -1,7 +1,7 @@
import {AfterViewInit, Component, ViewChild} from '@angular/core';
import {MatLegacyPaginator} from '@angular/material/legacy-paginator';
import {MatSort} from '@angular/material/sort';
-import {MatLegacyTableDataSource} from '@angular/material/legacy-table';
+import {MatTableDataSource} from '@angular/material/table';
export interface UserData {
id: string;
@@ -53,7 +53,7 @@ const NAMES: string[] = [
})
export class TableOverviewExample implements AfterViewInit {
displayedColumns: string[] = ['id', 'name', 'progress', 'fruit'];
- dataSource: MatLegacyTableDataSource;
+ dataSource: MatTableDataSource;
@ViewChild(MatLegacyPaginator) paginator: MatLegacyPaginator;
@ViewChild(MatSort) sort: MatSort;
@@ -63,7 +63,7 @@ export class TableOverviewExample implements AfterViewInit {
const users = Array.from({length: 100}, (_, k) => createNewUser(k + 1));
// Assign the data to the data source for the table to render
- this.dataSource = new MatLegacyTableDataSource(users);
+ this.dataSource = new MatTableDataSource(users);
}
ngAfterViewInit() {
diff --git a/src/components-examples/material/table/table-pagination/table-pagination-example.html b/src/components-examples/material/table/table-pagination/table-pagination-example.html
index c7c5e005baa5..ec67d8f72ee1 100644
--- a/src/components-examples/material/table/table-pagination/table-pagination-example.html
+++ b/src/components-examples/material/table/table-pagination/table-pagination-example.html
@@ -30,7 +30,7 @@
diff --git a/src/components-examples/material/table/table-pagination/table-pagination-example.ts b/src/components-examples/material/table/table-pagination/table-pagination-example.ts
index 218787853ab8..65bfe98eccc3 100644
--- a/src/components-examples/material/table/table-pagination/table-pagination-example.ts
+++ b/src/components-examples/material/table/table-pagination/table-pagination-example.ts
@@ -1,6 +1,6 @@
import {AfterViewInit, Component, ViewChild} from '@angular/core';
import {MatLegacyPaginator} from '@angular/material/legacy-paginator';
-import {MatLegacyTableDataSource} from '@angular/material/legacy-table';
+import {MatTableDataSource} from '@angular/material/table';
/**
* @title Table with pagination
@@ -12,7 +12,7 @@ import {MatLegacyTableDataSource} from '@angular/material/legacy-table';
})
export class TablePaginationExample implements AfterViewInit {
displayedColumns: string[] = ['position', 'name', 'weight', 'symbol'];
- dataSource = new MatLegacyTableDataSource(ELEMENT_DATA);
+ dataSource = new MatTableDataSource(ELEMENT_DATA);
@ViewChild(MatLegacyPaginator) paginator: MatLegacyPaginator;
diff --git a/src/components-examples/material/table/table-row-binding/table-row-binding-example.css b/src/components-examples/material/table/table-row-binding/table-row-binding-example.css
index 76a479d66d07..bfac75fd45c6 100644
--- a/src/components-examples/material/table/table-row-binding/table-row-binding-example.css
+++ b/src/components-examples/material/table/table-row-binding/table-row-binding-example.css
@@ -2,13 +2,13 @@
width: 100%;
}
-.mat-row .mat-cell {
+.mat-mdc-row .mat-mdc-cell {
border-bottom: 1px solid transparent;
border-top: 1px solid transparent;
cursor: pointer;
}
-.mat-row:hover .mat-cell {
+.mat-mdc-row:hover .mat-mdc-cell {
border-color: currentColor;
}
diff --git a/src/components-examples/material/table/table-selection/table-selection-example.ts b/src/components-examples/material/table/table-selection/table-selection-example.ts
index 2169f3bd8ee8..7da56a15757a 100644
--- a/src/components-examples/material/table/table-selection/table-selection-example.ts
+++ b/src/components-examples/material/table/table-selection/table-selection-example.ts
@@ -1,6 +1,6 @@
import {SelectionModel} from '@angular/cdk/collections';
import {Component} from '@angular/core';
-import {MatLegacyTableDataSource} from '@angular/material/legacy-table';
+import {MatTableDataSource} from '@angular/material/table';
export interface PeriodicElement {
name: string;
@@ -32,7 +32,7 @@ const ELEMENT_DATA: PeriodicElement[] = [
})
export class TableSelectionExample {
displayedColumns: string[] = ['select', 'position', 'name', 'weight', 'symbol'];
- dataSource = new MatLegacyTableDataSource(ELEMENT_DATA);
+ dataSource = new MatTableDataSource(ELEMENT_DATA);
selection = new SelectionModel(true, []);
/** Whether the number of selected elements matches the total number of rows. */
diff --git a/src/components-examples/material/table/table-sorting/table-sorting-example.html b/src/components-examples/material/table/table-sorting/table-sorting-example.html
index e11776461d7a..76edcae012cb 100644
--- a/src/components-examples/material/table/table-sorting/table-sorting-example.html
+++ b/src/components-examples/material/table/table-sorting/table-sorting-example.html
@@ -1,5 +1,5 @@
+ class="mat-elevation-z8">
diff --git a/src/components-examples/material/table/table-sorting/table-sorting-example.ts b/src/components-examples/material/table/table-sorting/table-sorting-example.ts
index 9fd6f3c83514..13e95b6c87c4 100644
--- a/src/components-examples/material/table/table-sorting/table-sorting-example.ts
+++ b/src/components-examples/material/table/table-sorting/table-sorting-example.ts
@@ -1,7 +1,7 @@
import {LiveAnnouncer} from '@angular/cdk/a11y';
import {AfterViewInit, Component, ViewChild} from '@angular/core';
import {MatSort, Sort} from '@angular/material/sort';
-import {MatLegacyTableDataSource} from '@angular/material/legacy-table';
+import {MatTableDataSource} from '@angular/material/table';
export interface PeriodicElement {
name: string;
@@ -9,7 +9,6 @@ export interface PeriodicElement {
weight: number;
symbol: string;
}
-
const ELEMENT_DATA: PeriodicElement[] = [
{position: 1, name: 'Hydrogen', weight: 1.0079, symbol: 'H'},
{position: 2, name: 'Helium', weight: 4.0026, symbol: 'He'},
@@ -22,7 +21,6 @@ const ELEMENT_DATA: PeriodicElement[] = [
{position: 9, name: 'Fluorine', weight: 18.9984, symbol: 'F'},
{position: 10, name: 'Neon', weight: 20.1797, symbol: 'Ne'},
];
-
/**
* @title Table with sorting
*/
@@ -33,7 +31,7 @@ const ELEMENT_DATA: PeriodicElement[] = [
})
export class TableSortingExample implements AfterViewInit {
displayedColumns: string[] = ['position', 'name', 'weight', 'symbol'];
- dataSource = new MatLegacyTableDataSource(ELEMENT_DATA);
+ dataSource = new MatTableDataSource(ELEMENT_DATA);
constructor(private _liveAnnouncer: LiveAnnouncer) {}
diff --git a/src/components-examples/material/table/table-sticky-columns/table-sticky-columns-example.css b/src/components-examples/material/table/table-sticky-columns/table-sticky-columns-example.css
index 52262aad13cf..b931bfc6acc6 100644
--- a/src/components-examples/material/table/table-sticky-columns/table-sticky-columns-example.css
+++ b/src/components-examples/material/table/table-sticky-columns/table-sticky-columns-example.css
@@ -18,10 +18,10 @@ th.mat-column-position, td.mat-column-position {
padding-left: 8px;
}
-.mat-table-sticky-border-elem-right {
+.mat-mdc-table-sticky-border-elem-right {
border-left: 1px solid #e0e0e0;
}
-.mat-table-sticky-border-elem-left {
+.mat-mdc-table-sticky-border-elem-left {
border-right: 1px solid #e0e0e0;
}
diff --git a/src/components-examples/material/table/table-sticky-complex-flex/table-sticky-complex-flex-example.css b/src/components-examples/material/table/table-sticky-complex-flex/table-sticky-complex-flex-example.css
index 32cefbf61d4a..e1a4540ba09a 100644
--- a/src/components-examples/material/table/table-sticky-complex-flex/table-sticky-complex-flex-example.css
+++ b/src/components-examples/material/table/table-sticky-complex-flex/table-sticky-complex-flex-example.css
@@ -3,7 +3,7 @@
overflow: auto;
}
-.mat-table-sticky {
+.mat-mdc-table-sticky {
background: #59abfd;
opacity: 1;
}
@@ -18,27 +18,27 @@
text-align: center;
}
-.mat-header-cell, .mat-footer-cell, .mat-cell {
+.mat-mdc-header-cell, .mat-mdc-footer-cell, .mat-mdc-cell {
min-width: 80px;
box-sizing: border-box;
}
-.mat-header-row, .mat-footer-row, .mat-row {
+.mat-mdc-header-row, .mat-mdc-footer-row, .mat-mdc-row {
min-width: 1920px; /* 24 columns, 80px each */
}
-.mat-table-sticky-border-elem-top {
+.mat-mdc-table-sticky-border-elem-top {
border-bottom: 2px solid midnightblue;
}
-.mat-table-sticky-border-elem-right {
+.mat-mdc-table-sticky-border-elem-right {
border-left: 2px solid midnightblue;
}
-.mat-table-sticky-border-elem-bottom {
+.mat-mdc-table-sticky-border-elem-bottom {
border-top: 2px solid midnightblue;
}
-.mat-table-sticky-border-elem-left {
+.mat-mdc-table-sticky-border-elem-left {
border-right: 2px solid midnightblue;
}
diff --git a/src/components-examples/material/table/table-sticky-complex/table-sticky-complex-example.css b/src/components-examples/material/table/table-sticky-complex/table-sticky-complex-example.css
index 155ce9ef09ec..8bb485e0dd04 100644
--- a/src/components-examples/material/table/table-sticky-complex/table-sticky-complex-example.css
+++ b/src/components-examples/material/table/table-sticky-complex/table-sticky-complex-example.css
@@ -3,7 +3,7 @@
overflow: auto;
}
-.mat-table-sticky {
+.mat-mdc-table-sticky {
background: #59abfd;
opacity: 1;
}
@@ -18,23 +18,23 @@
text-align: center;
}
-.mat-header-cell, .mat-footer-cell, .mat-cell {
+.mat-mdc-header-cell, .mat-mdc-footer-cell, .mat-mdc-cell {
min-width: 80px;
box-sizing: border-box;
}
-.mat-table-sticky-border-elem-top {
+.mat-mdc-table-sticky-border-elem-top {
border-bottom: 2px solid midnightblue;
}
-.mat-table-sticky-border-elem-right {
+.mat-mdc-table-sticky-border-elem-right {
border-left: 2px solid midnightblue;
}
-.mat-table-sticky-border-elem-bottom {
+.mat-mdc-table-sticky-border-elem-bottom {
border-top: 2px solid midnightblue;
}
-.mat-table-sticky-border-elem-left {
+.mat-mdc-table-sticky-border-elem-left {
border-right: 2px solid midnightblue;
}
diff --git a/src/components-examples/material/table/table-sticky-footer/table-sticky-footer-example.css b/src/components-examples/material/table/table-sticky-footer/table-sticky-footer-example.css
index 6b5869e7c72b..2afe062fed7a 100644
--- a/src/components-examples/material/table/table-sticky-footer/table-sticky-footer-example.css
+++ b/src/components-examples/material/table/table-sticky-footer/table-sticky-footer-example.css
@@ -7,10 +7,10 @@ table {
width: 100%;
}
-tr.mat-footer-row {
+tr.mat-mdc-footer-row {
font-weight: bold;
}
-.mat-table-sticky {
+.mat-mdc-table-sticky {
border-top: 1px solid #e0e0e0;
}
diff --git a/src/components-examples/material/table/table-text-column-advanced/table-text-column-advanced-example.ts b/src/components-examples/material/table/table-text-column-advanced/table-text-column-advanced-example.ts
index af509427764f..8f72e053a086 100644
--- a/src/components-examples/material/table/table-text-column-advanced/table-text-column-advanced-example.ts
+++ b/src/components-examples/material/table/table-text-column-advanced/table-text-column-advanced-example.ts
@@ -1,6 +1,6 @@
import {Component} from '@angular/core';
import {DecimalPipe} from '@angular/common';
-import {MatLegacyTableDataSource} from '@angular/material/legacy-table';
+import {MatTableDataSource} from '@angular/material/table';
export interface PeriodicElement {
name: string;
@@ -32,7 +32,7 @@ const ELEMENT_DATA: PeriodicElement[] = [
})
export class TableTextColumnAdvancedExample {
displayedColumns: string[] = ['position', 'name', 'weight', 'symbol'];
- dataSource = new MatLegacyTableDataSource(ELEMENT_DATA);
+ dataSource = new MatTableDataSource(ELEMENT_DATA);
headerText: string;
diff --git a/src/components-examples/material/table/table-wrapped/table-wrapped-example.ts b/src/components-examples/material/table/table-wrapped/table-wrapped-example.ts
index 931a5c740261..f8b049cdb7da 100644
--- a/src/components-examples/material/table/table-wrapped/table-wrapped-example.ts
+++ b/src/components-examples/material/table/table-wrapped/table-wrapped-example.ts
@@ -11,13 +11,13 @@ import {
} from '@angular/core';
import {MatSort} from '@angular/material/sort';
import {
- MatLegacyColumnDef,
- MatLegacyHeaderRowDef,
- MatLegacyNoDataRow,
- MatLegacyRowDef,
- MatLegacyTable,
- MatLegacyTableDataSource,
-} from '@angular/material/legacy-table';
+ MatColumnDef,
+ MatHeaderRowDef,
+ MatNoDataRow,
+ MatRowDef,
+ MatTable,
+ MatTableDataSource,
+} from '@angular/material/table';
export interface PeriodicElement {
name: string;
@@ -49,7 +49,7 @@ const ELEMENT_DATA: PeriodicElement[] = [
})
export class TableWrappedExample implements AfterViewInit {
displayedColumns: string[] = ['position', 'name', 'weight', 'symbol'];
- dataSource = new MatLegacyTableDataSource(ELEMENT_DATA);
+ dataSource = new MatTableDataSource(ELEMENT_DATA);
@ViewChild('sort') sort: MatSort;
@@ -82,12 +82,12 @@ export class TableWrappedExample implements AfterViewInit {
],
})
export class WrapperTable implements AfterContentInit {
- @ContentChildren(MatLegacyHeaderRowDef) headerRowDefs: QueryList;
- @ContentChildren(MatLegacyRowDef) rowDefs: QueryList>;
- @ContentChildren(MatLegacyColumnDef) columnDefs: QueryList;
- @ContentChild(MatLegacyNoDataRow) noDataRow: MatLegacyNoDataRow;
+ @ContentChildren(MatHeaderRowDef) headerRowDefs: QueryList;
+ @ContentChildren(MatRowDef) rowDefs: QueryList>;
+ @ContentChildren(MatColumnDef) columnDefs: QueryList;
+ @ContentChild(MatNoDataRow) noDataRow: MatNoDataRow;
- @ViewChild(MatLegacyTable, {static: true}) table: MatLegacyTable;
+ @ViewChild(MatTable, {static: true}) table: MatTable;
@Input() columns: string[];
diff --git a/src/dev-app/BUILD.bazel b/src/dev-app/BUILD.bazel
index 47fe1efecd87..51b99de4a63b 100644
--- a/src/dev-app/BUILD.bazel
+++ b/src/dev-app/BUILD.bazel
@@ -47,6 +47,7 @@ ng_module(
"//src/dev-app/input",
"//src/dev-app/input-modality",
"//src/dev-app/layout",
+ "//src/dev-app/legacy-table",
"//src/dev-app/list",
"//src/dev-app/live-announcer",
"//src/dev-app/mdc-autocomplete",
@@ -66,7 +67,6 @@ ng_module(
"//src/dev-app/mdc-slide-toggle",
"//src/dev-app/mdc-slider",
"//src/dev-app/mdc-snack-bar",
- "//src/dev-app/mdc-table",
"//src/dev-app/mdc-tabs",
"//src/dev-app/mdc-tooltip",
"//src/dev-app/menu",
diff --git a/src/dev-app/dev-app/dev-app-layout.ts b/src/dev-app/dev-app/dev-app-layout.ts
index 92066b7e6b23..c0c4c4cb2580 100644
--- a/src/dev-app/dev-app/dev-app-layout.ts
+++ b/src/dev-app/dev-app/dev-app-layout.ts
@@ -122,7 +122,7 @@ export class DevAppLayout {
{name: 'MDC Slide Toggle', route: '/mdc-slide-toggle'},
{name: 'MDC Slider', route: '/mdc-slider'},
{name: 'MDC Snack Bar', route: '/mdc-snack-bar'},
- {name: 'MDC Table', route: '/mdc-table'},
+ {name: 'Legacy Table', route: '/legacy-table'},
];
/** Currently selected density scale based on the index. */
diff --git a/src/dev-app/legacy-table/BUILD.bazel b/src/dev-app/legacy-table/BUILD.bazel
new file mode 100644
index 000000000000..d77aa34fc754
--- /dev/null
+++ b/src/dev-app/legacy-table/BUILD.bazel
@@ -0,0 +1,14 @@
+load("//tools:defaults.bzl", "ng_module")
+
+package(default_visibility = ["//visibility:public"])
+
+ng_module(
+ name = "legacy-table",
+ srcs = glob(["**/*.ts"]),
+ assets = ["table-demo.html"],
+ deps = [
+ "//src/components-examples/cdk/table",
+ "//src/components-examples/material/legacy-table",
+ "//src/dev-app/example",
+ ],
+)
diff --git a/src/dev-app/mdc-table/mdc-table-demo.html b/src/dev-app/legacy-table/table-demo.html
similarity index 84%
rename from src/dev-app/mdc-table/mdc-table-demo.html
rename to src/dev-app/legacy-table/table-demo.html
index 2b28db9618af..4b85241a1952 100644
--- a/src/dev-app/mdc-table/mdc-table-demo.html
+++ b/src/dev-app/legacy-table/table-demo.html
@@ -1,3 +1,15 @@
+Cdk table basic
+
+
+Cdk table with recycled rows
+
+
+Cdk table basic with fixed column widths
+
+
+Cdk table basic flex
+
+
Table basic
@@ -7,9 +19,6 @@ Table basic with recycled rows
Table basic flex
-Table flex with large row
-
-
Table dynamic columns
diff --git a/src/dev-app/legacy-table/table-demo.ts b/src/dev-app/legacy-table/table-demo.ts
new file mode 100644
index 000000000000..d036f559089c
--- /dev/null
+++ b/src/dev-app/legacy-table/table-demo.ts
@@ -0,0 +1,18 @@
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+
+import {Component} from '@angular/core';
+import {CdkTableExamplesModule} from '@angular/components-examples/cdk/table';
+import {TableExamplesModule} from '@angular/components-examples/material/legacy-table';
+
+@Component({
+ templateUrl: './table-demo.html',
+ standalone: true,
+ imports: [CdkTableExamplesModule, TableExamplesModule],
+})
+export class TableDemo {}
diff --git a/src/dev-app/mdc-table/BUILD.bazel b/src/dev-app/mdc-table/BUILD.bazel
deleted file mode 100644
index ed631dc4a31c..000000000000
--- a/src/dev-app/mdc-table/BUILD.bazel
+++ /dev/null
@@ -1,15 +0,0 @@
-load("//tools:defaults.bzl", "ng_module")
-
-package(default_visibility = ["//visibility:public"])
-
-ng_module(
- name = "mdc-table",
- srcs = glob(["**/*.ts"]),
- assets = [
- "mdc-table-demo.html",
- ],
- deps = [
- "//src/components-examples/material-experimental/mdc-table",
- "//src/material/table",
- ],
-)
diff --git a/src/dev-app/mdc-table/mdc-table-demo.ts b/src/dev-app/mdc-table/mdc-table-demo.ts
deleted file mode 100644
index bc9ed984d7a5..000000000000
--- a/src/dev-app/mdc-table/mdc-table-demo.ts
+++ /dev/null
@@ -1,19 +0,0 @@
-/**
- * @license
- * Copyright Google LLC All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-
-import {Component} from '@angular/core';
-import {MatIconModule} from '@angular/material/icon';
-import {MatTableModule} from '@angular/material/table';
-import {MdcTableExamplesModule} from '@angular/components-examples/material-experimental/mdc-table';
-
-@Component({
- templateUrl: 'mdc-table-demo.html',
- standalone: true,
- imports: [MatIconModule, MatTableModule, MdcTableExamplesModule],
-})
-export class MdcTableDemo {}
diff --git a/src/dev-app/routes.ts b/src/dev-app/routes.ts
index 63609d86ada7..1b5f30f2b483 100644
--- a/src/dev-app/routes.ts
+++ b/src/dev-app/routes.ts
@@ -216,8 +216,8 @@ export const DEV_APP_ROUTES: Routes = [
loadComponent: () => import('./mdc-slider/mdc-slider-demo').then(m => m.MdcSliderDemo),
},
{
- path: 'mdc-table',
- loadComponent: () => import('./mdc-table/mdc-table-demo').then(m => m.MdcTableDemo),
+ path: 'legacy-table',
+ loadComponent: () => import('./legacy-table/table-demo').then(m => m.TableDemo),
},
{
path: 'mdc-tabs',
diff --git a/src/dev-app/table/table-demo.html b/src/dev-app/table/table-demo.html
index 4b85241a1952..387e2ae07567 100644
--- a/src/dev-app/table/table-demo.html
+++ b/src/dev-app/table/table-demo.html
@@ -19,6 +19,9 @@ Table basic with recycled rows
Table basic flex
+Table flex with large row
+
+
Table dynamic columns
diff --git a/src/material/table/table-data-source.ts b/src/material/table/table-data-source.ts
index b7fe7bff4b7e..318eaa83b76b 100644
--- a/src/material/table/table-data-source.ts
+++ b/src/material/table/table-data-source.ts
@@ -40,6 +40,8 @@ export interface MatTableDataSourcePaginator {
initialized: Observable;
pageSize: number;
length: number;
+ firstPage: () => void;
+ lastPage: () => void;
}
/**
diff --git a/tools/public_api_guard/material/table.md b/tools/public_api_guard/material/table.md
index 862cd8f3b3cc..f288c24975c2 100644
--- a/tools/public_api_guard/material/table.md
+++ b/tools/public_api_guard/material/table.md
@@ -209,9 +209,13 @@ export interface MatTableDataSourcePageEvent {
// @public
export interface MatTableDataSourcePaginator {
+ // (undocumented)
+ firstPage: () => void;
// (undocumented)
initialized: Observable;
// (undocumented)
+ lastPage: () => void;
+ // (undocumented)
length: number;
// (undocumented)
page: Subject;