feat(material-experimental/mdc-list): Add scaffolding for MDC-based list

.github/CODEOWNERS

@@ -96,11 +96,11 @@
 /src/material-experimental/mdc-chips/**            @mmalerba
 /src/material-experimental/mdc-dialog/**           @devversion
 /src/material-experimental/mdc-helpers/**          @mmalerba
+/src/material-experimental/mdc-list/**             @mmalerba
 /src/material-experimental/mdc-menu/**             @crisbeto
 /src/material-experimental/mdc-select/**           @crisbeto
 /src/material-experimental/mdc-progress-spinner/** @andrewseguin
 /src/material-experimental/mdc-progress-bar/**     @andrewseguin
-# Note to implementer: please repossess
 /src/material-experimental/mdc-radio/**            @mmalerba
 /src/material-experimental/mdc-snackbar/**         @opozo
 /src/material-experimental/mdc-slide-toggle/**     @crisbeto

src/material-experimental/config.bzl

@@ -8,6 +8,7 @@ entryPoints = [
     "mdc-chips",
     "mdc-chips/testing",
     "mdc-helpers",
+    "mdc-list",
     "mdc-menu",
     "mdc-menu/testing",
     "mdc-progress-bar",

src/material-experimental/mdc-list/BUILD.bazel

@@ -0,0 +1,91 @@
+package(default_visibility = ["//visibility:public"])
+
+load("//src/e2e-app:test_suite.bzl", "e2e_test_suite")
+load(
+    "//tools:defaults.bzl",
+    "ng_e2e_test_library",
+    "ng_module",
+    "ng_test_library",
+    "ng_web_test_suite",
+    "sass_binary",
+    "sass_library",
+)
+
+ng_module(
+    name = "mdc-list",
+    srcs = glob(
+        ["**/*.ts"],
+        exclude = [
+            "**/*.spec.ts",
+        ],
+    ),
+    assets = [":list_scss"] + glob(["**/*.html"]),
+    module_name = "@angular/material-experimental/mdc-list",
+    deps = [
+        "@npm//@angular/core",
+        "@npm//@angular/forms",
+        "@npm//@material/list",
+    ],
+)
+
+sass_library(
+    name = "mdc_list_scss_lib",
+    srcs = glob(["**/_*.scss"]),
+    deps = [
+        "//src/material-experimental/mdc-helpers:mdc_helpers_scss_lib",
+        "//src/material-experimental/mdc-helpers:mdc_scss_deps_lib",
+    ],
+)
+
+sass_binary(
+    name = "list_scss",
+    src = "list.scss",
+    include_paths = [
+        "external/npm/node_modules",
+    ],
+    deps = [
+        "//src/material-experimental/mdc-helpers:mdc_helpers_scss_lib",
+        "//src/material-experimental/mdc-helpers:mdc_scss_deps_lib",
+    ],
+)
+
+ng_test_library(
+    name = "list_tests_lib",
+    srcs = glob(
+        ["**/*.spec.ts"],
+        exclude = ["**/*.e2e.spec.ts"],
+    ),
+    deps = [
+        ":mdc-list",
+        "//src/cdk/testing/private",
+        "//src/cdk/testing/testbed",
+        "@npm//@angular/platform-browser",
+    ],
+)
+
+ng_web_test_suite(
+    name = "unit_tests",
+    static_files = [
+        "@npm//:node_modules/@material/list/dist/mdc.list.js",
+    ],
+    deps = [
+        ":list_tests_lib",
+        "//src/material-experimental:mdc_require_config.js",
+    ],
+)
+
+ng_e2e_test_library(
+    name = "e2e_test_sources",
+    srcs = glob(["**/*.e2e.spec.ts"]),
+    deps = [
+        "//src/cdk/testing/private/e2e",
+    ],
+)
+
+e2e_test_suite(
+    name = "e2e_tests",
+    deps = [
+        ":e2e_test_sources",
+        "//src/cdk/testing/private/e2e",
+    ],
+)

src/material-experimental/mdc-list/README.md

@@ -0,0 +1 @@
+TODO: WIP

src/material-experimental/mdc-list/_mdc-list.scss

@@ -0,0 +1,5 @@
+@mixin mat-list-theme-mdc($theme) {
+}
+
+@mixin mat-list-typography-mdc($config) {
+}

src/material-experimental/mdc-list/action-list.ts

@@ -0,0 +1,23 @@
+/**
+ * @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 {ChangeDetectionStrategy, Component, ViewEncapsulation} from '@angular/core';
+import {MatListBase} from './list-base';
+
+@Component({
+  selector: 'mat-action-list',
+  exportAs: 'matActionList',
+  templateUrl: 'list.html',
+  host: {
+    'class': 'mat-mdc-action-list mat-mdc-list-base',
+  },
+  styleUrls: ['list.css'],
+  encapsulation: ViewEncapsulation.None,
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class MatActionList extends MatListBase {}

src/material-experimental/mdc-list/index.ts

@@ -0,0 +1,9 @@
+/**
+ * @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
+ */
+
+export * from './public-api';

src/material-experimental/mdc-list/list-base.ts

@@ -0,0 +1,11 @@
+/**
+ * @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
+ */
+
+export class MatListBase {}
+
+export class MatListItemBase {}

src/material-experimental/mdc-list/list-item.html

@@ -0,0 +1 @@
+TODO: Implement.

src/material-experimental/mdc-list/list-option.html

@@ -0,0 +1 @@
+TODO: Implement.

src/material-experimental/mdc-list/list.e2e.spec.ts

@@ -0,0 +1,3 @@
+it('should have e2e tests', () => {
+  // TODO: Implement.
+});

src/material-experimental/mdc-list/list.html

@@ -0,0 +1 @@
+TODO: Implement.

src/material-experimental/mdc-list/list.scss

@@ -0,0 +1 @@
+// TODO: implement.

src/material-experimental/mdc-list/list.spec.ts

@@ -0,0 +1,6 @@
+import {MatList} from '@angular/material-experimental/mdc-list';
+
+it('should have unit tests', () => {
+  // TODO: Implement.
+  expect(MatList).toBe(MatList);
+});

src/material-experimental/mdc-list/list.ts

@@ -0,0 +1,65 @@
+/**
+ * @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 {ChangeDetectionStrategy, Component, Directive, ViewEncapsulation} from '@angular/core';
+import {MatListBase, MatListItemBase} from './list-base';
+
+/**
+ * Directive whose purpose is to add the mat- CSS styling to this selector.
+ * @docs-private
+ */
+@Directive({
+  selector: '[mat-list-avatar], [matListAvatar]',
+  host: {'class': 'mat-mdc-list-avatar'}
+})
+export class MatListAvatarCssMatStyler {}
+
+/**
+ * Directive whose purpose is to add the mat- CSS styling to this selector.
+ * @docs-private
+ */
+@Directive({
+  selector: '[mat-list-icon], [matListIcon]',
+  host: {'class': 'mat-mdc-list-icon'}
+})
+export class MatListIconCssMatStyler {}
+
+/**
+ * Directive whose purpose is to add the mat- CSS styling to this selector.
+ * @docs-private
+ */
+@Directive({
+  selector: '[mat-subheader], [matSubheader]',
+  host: {'class': 'mat-mdc-subheader'}
+})
+export class MatListSubheaderCssMatStyler {}
+
+@Component({
+  selector: 'mat-list',
+  exportAs: 'matList',
+  templateUrl: 'list.html',
+  host: {
+    'class': 'mat-mdc-list mat-mdc-list-base',
+  },
+  styleUrls: ['list.css'],
+  encapsulation: ViewEncapsulation.None,
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class MatList extends MatListBase {}
+
+@Component({
+  selector: 'mat-list-item, a[mat-list-item], button[mat-list-item]',
+  exportAs: 'matListItem',
+  host: {
+    'class': 'mat-mdc-list-item',
+  },
+  templateUrl: 'list-item.html',
+  encapsulation: ViewEncapsulation.None,
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class MatListItem extends MatListItemBase {}

src/material-experimental/mdc-list/module.ts

@@ -0,0 +1,45 @@
+/**
+ * @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 {NgModule} from '@angular/core';
+import {MatActionList} from './action-list';
+import {
+  MatList,
+  MatListAvatarCssMatStyler,
+  MatListIconCssMatStyler,
+  MatListItem,
+  MatListSubheaderCssMatStyler,
+} from './list';
+import {MatNavList} from './nav-list';
+import {MatListOption, MatSelectionList} from './selection-list';
+
+@NgModule({
+  exports: [
+    MatList,
+    MatActionList,
+    MatNavList,
+    MatSelectionList,
+    MatListItem,
+    MatListOption,
+    MatListAvatarCssMatStyler,
+    MatListIconCssMatStyler,
+    MatListSubheaderCssMatStyler,
+  ],
+  declarations: [
+    MatList,
+    MatActionList,
+    MatNavList,
+    MatSelectionList,
+    MatListItem,
+    MatListOption,
+    MatListAvatarCssMatStyler,
+    MatListIconCssMatStyler,
+    MatListSubheaderCssMatStyler,
+  ]
+})
+export class MatListModule {}

src/material-experimental/mdc-list/nav-list.ts

@@ -0,0 +1,35 @@
+/**
+ * @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 {ChangeDetectionStrategy, Component, ViewEncapsulation} from '@angular/core';
+import {MatList} from './list';
+import {MatListBase} from './list-base';
+
+@Component({
+  selector: 'mat-nav-list',
+  /**
+   * @deprecated `matList` export will be removed, use `matNavList`
+   * @breaking-change 11.0.0
+   */
+  exportAs: 'matNavList, matList',
+  templateUrl: 'list.html',
+  host: {
+    'class': 'mat-mdc-nav-list mat-mdc-list-base',
+  },
+  styleUrls: ['list.css'],
+  encapsulation: ViewEncapsulation.None,
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  providers: [
+    /**
+     * @deprecated Provider for `MatList` will be removed, use `MatNavList` instead.
+     * @breaking-change 11.0.0
+     */
+    {provide: MatList, useExisting: MatNavList}
+  ]
+})
+export class MatNavList extends MatListBase {}

src/material-experimental/mdc-list/public-api.ts

@@ -0,0 +1,13 @@
+/**
+ * @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
+ */
+
+export * from './list';
+export * from './action-list';
+export * from './nav-list';
+export * from './selection-list';
+export * from './module';

src/material-experimental/mdc-list/selection-list.html

@@ -0,0 +1 @@
+TODO: Implement.