build: add dev app for MDC sidenav (#19282)

Sets up a place in the dev app to make it easier to debug the MDC sidenav.

Author: crisbeto

.github/CODEOWNERS

@@ -170,6 +170,7 @@
 /src/dev-app/mdc-progress-bar/**                   @crisbeto
 /src/dev-app/mdc-radio/**                          @mmalerba
 /src/dev-app/mdc-snackbar/**                       @opozo
+/src/dev-app/mdc-sidenav/**                        @crisbeto
 /src/dev-app/mdc-slide-toggle/**                   @crisbeto
 /src/dev-app/mdc-slider/**                         @devversion
 /src/dev-app/mdc-table/**                          @andrewseguin

src/dev-app/BUILD.bazel

@@ -53,6 +53,7 @@ ng_module(
         "//src/dev-app/mdc-menu",
         "//src/dev-app/mdc-progress-bar",
         "//src/dev-app/mdc-radio",
+        "//src/dev-app/mdc-sidenav",
         "//src/dev-app/mdc-slide-toggle",
         "//src/dev-app/mdc-slider",
         "//src/dev-app/mdc-snackbar",

src/dev-app/dev-app/dev-app-layout.ts

@@ -81,6 +81,7 @@ export class DevAppLayout {
     {name: 'MDC Radio', route: '/mdc-radio'},
     {name: 'MDC Progress Bar', route: '/mdc-progress-bar'},
     {name: 'MDC Tabs', route: '/mdc-tabs'},
+    {name: 'MDC Sidenav', route: '/mdc-sidenav'},
     {name: 'MDC Slide Toggle', route: '/mdc-slide-toggle'},
     {name: 'MDC Slider', route: '/mdc-slider'},
     {name: 'MDC Snackbar', route: '/mdc-snackbar'},

src/dev-app/dev-app/routes.ts

@@ -72,6 +72,7 @@ export const DEV_APP_ROUTES: Routes = [
   {path: 'mdc-list', loadChildren: 'mdc-list/mdc-list-demo-module#MdcListDemoModule'},
   {path: 'mdc-menu', loadChildren: 'mdc-menu/mdc-menu-demo-module#MdcMenuDemoModule'},
   {path: 'mdc-radio', loadChildren: 'mdc-radio/mdc-radio-demo-module#MdcRadioDemoModule'},
+  {path: 'mdc-sidenav', loadChildren: 'mdc-sidenav/mdc-sidenav-demo-module#MdcSidenavDemoModule'},
   {
     path: 'mdc-snackbar',
     loadChildren: 'mdc-snackbar/mdc-snackbar-demo-module#MdcSnackbarDemoModule'

src/dev-app/mdc-sidenav/BUILD.bazel

@@ -0,0 +1,22 @@
+load("@io_bazel_rules_sass//:defs.bzl", "sass_binary")
+load("//tools:defaults.bzl", "ng_module")
+
+package(default_visibility = ["//visibility:public"])
+
+ng_module(
+    name = "mdc-sidenav",
+    srcs = glob(["**/*.ts"]),
+    assets = [
+        "mdc-sidenav-demo.html",
+        ":mdc_sidenav_demo_scss",
+    ],
+    deps = [
+        "//src/material-experimental/mdc-sidenav",
+        "@npm//@angular/router",
+    ],
+)
+
+sass_binary(
+    name = "mdc_sidenav_demo_scss",
+    src = "mdc-sidenav-demo.scss",
+)

src/dev-app/mdc-sidenav/mdc-sidenav-demo-module.ts

@@ -0,0 +1,22 @@
+/**
+ * @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 {MatSidenavModule} from '@angular/material-experimental/mdc-sidenav';
+import {RouterModule} from '@angular/router';
+import {MdcSidenavDemo} from './mdc-sidenav-demo';
+
+@NgModule({
+  imports: [
+    MatSidenavModule,
+    RouterModule.forChild([{path: '', component: MdcSidenavDemo}]),
+  ],
+  declarations: [MdcSidenavDemo],
+})
+export class MdcSidenavDemoModule {
+}

src/dev-app/mdc-sidenav/mdc-sidenav-demo.html

@@ -0,0 +1,2 @@
+<!-- TODO: copy in demo template from existing mat-sidenav demo. -->
+Not yet implemented.

src/dev-app/mdc-sidenav/mdc-sidenav-demo.scss

@@ -0,0 +1 @@
+// TODO: copy in demo styles from existing mat-sidenav demo.

src/dev-app/mdc-sidenav/mdc-sidenav-demo.ts

@@ -0,0 +1,17 @@
+/**
+ * @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';
+
+@Component({
+  selector: 'mdc-sidenav-demo',
+  templateUrl: 'mdc-sidenav-demo.html',
+  styleUrls: ['mdc-sidenav-demo.css'],
+})
+export class MdcSidenavDemo {
+}