build: build material with angular from source (#13655)

.circleci/config.yml

@@ -83,7 +83,7 @@ jobs:
       - *copy_bazel_config
 
       # TODO(jelbourn): Update this command to run all tests if the Bazel issues have been fixed.
-      - run: bazel build src/cdk/...
+      - run: bazel build src/cdk/... src/lib:material
       - run: bazel test src/cdk/...
 
       - *save_cache

src/BUILD.bazel

@@ -1,6 +1,13 @@
 package(default_visibility = ["//visibility:public"])
 
+load("//tools:defaults.bzl", "ts_library")
+
 exports_files([
   "bazel-tsconfig-build.json",
   "bazel-tsconfig-test.json",
 ])
+
+ts_library(
+  name = 'module-typings',
+  srcs = [":module-typings.d.ts"]
+)

src/cdk/drag-drop/tsconfig-build.json

@@ -1,8 +1,7 @@
 {
   "extends": "../tsconfig-build",
   "files": [
-    "public-api.ts",
-    "./typings.d.ts"
+    "public-api.ts"
   ],
   "angularCompilerOptions": {
     "annotateForClosureCompiler": true,

src/cdk/drag-drop/typings.d.ts

@@ -1 +0,0 @@
-declare var module: {id: string};

src/cdk/scrolling/tsconfig-build.json

@@ -2,7 +2,7 @@
   "extends": "../tsconfig-build",
   "files": [
     "public-api.ts",
-    "./typings.d.ts"
+    "../typings.d.ts"
   ],
   "angularCompilerOptions": {
     "annotateForClosureCompiler": true,

src/cdk/scrolling/typings.d.ts

@@ -1 +0,0 @@
-declare var module: {id: string};

src/cdk/stepper/typings.d.ts

@@ -1 +0,0 @@
-declare var module: {id: string};

src/cdk/table/typings.d.ts

@@ -1 +0,0 @@
-declare var module: {id: string};

src/cdk/tree/typings.d.ts

@@ -1 +0,0 @@
-declare var module: {id: string};

src/lib/BUILD.bazel

@@ -1,13 +1,10 @@
 package(default_visibility=["//visibility:public"])
-load("@build_bazel_rules_typescript//:defs.bzl", "ts_library")
-load("@angular//:index.bzl", "ng_package", "ng_module")
+
+load("@angular//:index.bzl", "ng_package")
 load("//tools:sass_bundle.bzl", "sass_bundle")
 load("//:packages.bzl", "MATERIAL_PACKAGES", "MATERIAL_TARGETS", "ROLLUP_GLOBALS",
     "VERSION_PLACEHOLDER_REPLACEMENTS")
-
-
-# Export the root material tsconfig so that subpackages can reference it directly.
-exports_files(["tsconfig-build.json"])
+load("//tools:defaults.bzl", "ng_module")
 
 # Root "@angular/material" entry-point.
 ng_module(
@@ -15,7 +12,6 @@ ng_module(
   srcs = glob(["*.ts"], exclude=["**/*.spec.ts"]),
   module_name = "@angular/material",
   deps = ["//src/lib/%s" % p for p in MATERIAL_PACKAGES],
-  tsconfig = "//src/lib:tsconfig-build.json",
 )
 
 sass_bundle(

src/lib/autocomplete/BUILD.bazel

@@ -1,7 +1,7 @@
 package(default_visibility=["//visibility:public"])
-load("@angular//:index.bzl", "ng_module")
-load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
 
+load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
+load("//tools:defaults.bzl", "ng_module")
 
 ng_module(
   name = "autocomplete",
@@ -9,17 +9,21 @@ ng_module(
   module_name = "@angular/material/autocomplete",
   assets = [":autocomplete.css"] + glob(["**/*.html"]),
   deps = [
-    "//src/lib/core",
-    "//src/lib/form-field",
+    "@angular//packages/common",
+    "@angular//packages/core",
+    "@angular//packages/forms",
+    "@rxjs",
+    "@rxjs//operators",
     "//src/cdk/a11y",
     "//src/cdk/bidi",
-    "//src/cdk/collections",
-    "//src/cdk/keycodes",
-    "//src/cdk/portal",
-    "//src/cdk/overlay",
     "//src/cdk/coercion",
-  ],
-  tsconfig = "//src/lib:tsconfig-build.json",
+    "//src/cdk/keycodes",
+    "//src/cdk/overlay",
+    "//src/cdk/portal",
+    "//src/cdk/scrolling",
+    "//src/lib/core",
+    "//src/lib/form-field",
+  ]
 )
 
 # TODO(jelbourn): replace this w/ sass_library when it supports acting like a filegroup

src/lib/badge/BUILD.bazel

@@ -1,18 +1,19 @@
 package(default_visibility=["//visibility:public"])
-load("@angular//:index.bzl", "ng_module")
-load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
 
+load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
+load("//tools:defaults.bzl", "ng_module")
 
 ng_module(
   name = "badge",
   srcs = glob(["**/*.ts"], exclude=["**/*.spec.ts"]),
   module_name = "@angular/material/badge",
   deps = [
-    "//src/lib/core",
+    "@angular//packages/common",
+    "@angular//packages/core",
     "//src/cdk/a11y",
     "//src/cdk/coercion",
+    "//src/lib/core",
   ] + glob(["**/*.html"]),
-  tsconfig = "//src/lib:tsconfig-build.json",
 )
 
 # TODO(jelbourn): replace this w/ sass_library when it supports acting like a filegroup

src/lib/bottom-sheet/BUILD.bazel

@@ -1,7 +1,7 @@
 package(default_visibility=["//visibility:public"])
-load("@angular//:index.bzl", "ng_module")
-load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
 
+load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
+load("//tools:defaults.bzl", "ng_module")
 
 ng_module(
   name = "bottom-sheet",
@@ -11,15 +11,19 @@ ng_module(
     ":bottom-sheet-container.css",
   ] + glob(["**/*.html"]),
   deps = [
-    "//src/lib/core",
+    "@angular//packages/animations",
+    "@angular//packages/common",
+    "@angular//packages/core",
+    "@rxjs",
+    "@rxjs//operators",
+    "//src/cdk/keycodes",
+    "//src/cdk/overlay",
     "//src/cdk/a11y",
     "//src/cdk/bidi",
-    "//src/cdk/overlay",
-    "//src/cdk/portal",
     "//src/cdk/layout",
-    "@rxjs",
+    "//src/cdk/portal",
+    "//src/lib/core",
   ],
-  tsconfig = "//src/lib:tsconfig-build.json",
 )
 
 # TODO(jelbourn): replace this w/ sass_library when it supports acting like a filegroup

src/lib/button-toggle/BUILD.bazel

@@ -1,7 +1,7 @@
 package(default_visibility=["//visibility:public"])
-load("@angular//:index.bzl", "ng_module")
-load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
 
+load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
+load("//tools:defaults.bzl", "ng_module")
 
 ng_module(
   name = "button-toggle",
@@ -9,12 +9,13 @@ ng_module(
   module_name = "@angular/material/button-toggle",
   assets = [":button-toggle.css"] + glob(["**/*.html"]),
   deps = [
-    "//src/lib/core",
-    "//src/cdk/a11y",
-    "//src/cdk/coercion",
+    "@angular//packages/core",
+    "@angular//packages/forms",
     "//src/cdk/collections",
+    "//src/cdk/coercion",
+    "//src/cdk/a11y",
+    "//src/lib/core",
   ],
-  tsconfig = "//src/lib:tsconfig-build.json",
 )
 
 # TODO(jelbourn): replace this w/ sass_library when it supports acting like a filegroup

src/lib/button/BUILD.bazel

@@ -1,7 +1,7 @@
 package(default_visibility=["//visibility:public"])
-load("@angular//:index.bzl", "ng_module")
-load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
 
+load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
+load("//tools:defaults.bzl", "ng_module")
 
 ng_module(
   name = "button",
@@ -9,11 +9,13 @@ ng_module(
   module_name = "@angular/material/button",
   assets = [":button.css"] + glob(["**/*.html"]),
   deps = [
-    "//src/lib/core",
-    "//src/cdk/a11y",
+    "@angular//packages/common",
+    "@angular//packages/core",
+    "@angular//packages/platform-browser/animations",
     "//src/cdk/platform",
+    "//src/cdk/a11y",
+    "//src/lib/core",
   ],
-  tsconfig = "//src/lib:tsconfig-build.json",
 )
 
 # TODO(jelbourn): remove this when sass_library acts like a filegroup

src/lib/card/BUILD.bazel

@@ -1,7 +1,7 @@
 package(default_visibility=["//visibility:public"])
-load("@angular//:index.bzl", "ng_module")
-load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
 
+load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
+load("//tools:defaults.bzl", "ng_module")
 
 ng_module(
   name = "card",
@@ -9,9 +9,9 @@ ng_module(
   module_name = "@angular/material/card",
   assets = [":card.css"] + glob(["**/*.html"]),
   deps = [
+    "@angular//packages/core",
     "//src/lib/core",
   ],
-  tsconfig = "//src/lib:tsconfig-build.json",
 )
 
 # TODO(jelbourn): replace this w/ sass_library when it supports acting like a filegroup

src/lib/checkbox/BUILD.bazel

@@ -1,7 +1,7 @@
 package(default_visibility=["//visibility:public"])
-load("@angular//:index.bzl", "ng_module")
-load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
 
+load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
+load("//tools:defaults.bzl", "ng_module")
 
 ng_module(
   name = "checkbox",
@@ -9,12 +9,15 @@ ng_module(
   module_name = "@angular/material/checkbox",
   assets = [":checkbox.css"] + glob(["**/*.html"]),
   deps = [
-    "//src/lib/core",
+    "@angular//packages/common",
+    "@angular//packages/core",
+    "@angular//packages/forms",
+    "@angular//packages/platform-browser/animations",
     "//src/cdk/a11y",
     "//src/cdk/coercion",
     "//src/cdk/observers",
+    "//src/lib/core",
   ],
-  tsconfig = "//src/lib:tsconfig-build.json",
 )
 
 # TODO(jelbourn): replace this w/ sass_library when it supports acting like a filegroup

src/lib/chips/BUILD.bazel

@@ -1,7 +1,7 @@
 package(default_visibility=["//visibility:public"])
-load("@angular//:index.bzl", "ng_module")
-load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
 
+load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
+load("//tools:defaults.bzl", "ng_module")
 
 ng_module(
   name = "chips",
@@ -9,6 +9,10 @@ ng_module(
   module_name = "@angular/material/chips",
   assets = [":chips.css"] + glob(["**/*.html"]),
   deps = [
+    "@angular//packages/core",
+    "@angular//packages/forms",
+    "@rxjs",
+    "@rxjs//operators",
     "//src/cdk/a11y",
     "//src/cdk/bidi",
     "//src/cdk/coercion",
@@ -18,7 +22,6 @@ ng_module(
     "//src/lib/core",
     "//src/lib/form-field",
   ],
-  tsconfig = "//src/lib:tsconfig-build.json",
 )
 
 # TODO(jelbourn): replace this w/ sass_library when it supports acting like a filegroup

src/lib/core/BUILD.bazel

@@ -1,12 +1,11 @@
 package(default_visibility=["//visibility:public"])
 
-load("@angular//:index.bzl", "ng_module")
 load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
 load("//:packages.bzl", "MATERIAL_PACKAGES")
+load("//tools:defaults.bzl", "ng_module")
 
 exports_files(["theming/_theming.scss"])
 
-
 ng_module(
   name = "core",
   srcs = glob(["**/*.ts"], exclude=["**/*.spec.ts"]),
@@ -17,14 +16,18 @@ ng_module(
     ":option/optgroup.css",
   ] + glob(["**/*.html"]),
   deps = [
+    "@angular//packages/common",
+    "@angular//packages/core",
+    "@angular//packages/forms",
+    "@angular//packages/platform-browser",
+    "@angular//packages/platform-browser/animations",
+    "@rxjs",
     "//src/cdk/a11y",
     "//src/cdk/bidi",
     "//src/cdk/coercion",
     "//src/cdk/keycodes",
     "//src/cdk/platform",
-    "@rxjs",
   ],
-  tsconfig = "//src/lib:tsconfig-build.json",
 )
 
 

src/lib/datepicker/BUILD.bazel

@@ -1,7 +1,7 @@
 package(default_visibility=["//visibility:public"])
-load("@angular//:index.bzl", "ng_module")
-load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
 
+load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
+load("//tools:defaults.bzl", "ng_module")
 
 ng_module(
   name = "datepicker",
@@ -14,18 +14,24 @@ ng_module(
     ":calendar.css",
   ] + glob(["**/*.html"]),
   deps = [
-    "//src/lib/core",
-    "//src/lib/button",
-    "//src/lib/dialog",
-    "//src/lib/input",
+    "@angular//packages/animations",
+    "@angular//packages/common",
+    "@angular//packages/core",
+    "@angular//packages/forms",
+    "@rxjs",
+    "@rxjs//operators",
     "//src/cdk/a11y",
     "//src/cdk/bidi",
     "//src/cdk/coercion",
     "//src/cdk/keycodes",
-    "//src/cdk/portal",
     "//src/cdk/overlay",
+    "//src/cdk/portal",
+    "//src/lib/button",
+    "//src/lib/core",
+    "//src/lib/dialog",
+    "//src/lib/form-field",
+    "//src/lib/input",
   ],
-  tsconfig = "//src/lib:tsconfig-build.json",
 )
 
 # TODO(jelbourn): replace this w/ sass_library when it supports acting like a filegroup

src/lib/dialog/BUILD.bazel

@@ -1,7 +1,7 @@
 package(default_visibility=["//visibility:public"])
-load("@angular//:index.bzl", "ng_module")
-load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
 
+load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
+load("//tools:defaults.bzl", "ng_module")
 
 ng_module(
   name = "dialog",
@@ -9,14 +9,18 @@ ng_module(
   module_name = "@angular/material/dialog",
   assets = [":dialog.css"] + glob(["**/*.html"]),
   deps = [
-    "//src/lib/core",
+    "@angular//packages/animations",
+    "@angular//packages/common",
+    "@angular//packages/core",
+    "@rxjs",
+    "@rxjs//operators",
     "//src/cdk/a11y",
     "//src/cdk/bidi",
     "//src/cdk/keycodes",
     "//src/cdk/overlay",
     "//src/cdk/portal",
+    "//src/lib/core",
   ],
-  tsconfig = "//src/lib:tsconfig-build.json",
 )
 
 # TODO(jelbourn): replace this w/ sass_library when it supports acting like a filegroup

src/lib/divider/BUILD.bazel

@@ -1,7 +1,7 @@
 package(default_visibility=["//visibility:public"])
-load("@angular//:index.bzl", "ng_module")
-load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
 
+load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
+load("//tools:defaults.bzl", "ng_module")
 
 ng_module(
   name = "divider",
@@ -9,10 +9,11 @@ ng_module(
   module_name = "@angular/material/divider",
   assets = [":divider.css"] + glob(["**/*.html"]),
   deps = [
-    "//src/lib/core",
+    "@angular//packages/common",
+    "@angular//packages/core",
     "//src/cdk/coercion",
+    "//src/lib/core",
   ],
-  tsconfig = "//src/lib:tsconfig-build.json",
 )
 
 

src/lib/expansion/BUILD.bazel

@@ -1,7 +1,7 @@
 package(default_visibility=["//visibility:public"])
-load("@angular//:index.bzl", "ng_module")
-load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
 
+load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
+load("//tools:defaults.bzl", "ng_module")
 
 ng_module(
   name = "expansion",
@@ -12,7 +12,12 @@ ng_module(
     ":expansion-panel-header.css",
   ] + glob(["**/*.html"]),
   deps = [
-    "//src/lib/core",
+    "@angular//packages/animations",
+    "@angular//packages/common",
+    "@angular//packages/core",
+    "@angular//packages/platform-browser/animations",
+    "@rxjs",
+    "@rxjs//operators",
     "//src/cdk/a11y",
     "//src/cdk/accordion",
     "//src/cdk/coercion",
@@ -20,7 +25,6 @@ ng_module(
     "//src/cdk/keycodes",
     "//src/cdk/portal",
   ],
-  tsconfig = "//src/lib:tsconfig-build.json",
 )
 
 # TODO(jelbourn): replace this w/ sass_library when it supports acting like a filegroup

src/lib/form-field/BUILD.bazel

@@ -1,7 +1,7 @@
 package(default_visibility=["//visibility:public"])
-load("@angular//:index.bzl", "ng_module")
-load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
 
+load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
+load("//tools:defaults.bzl", "ng_module")
 
 ng_module(
   name = "form-field",
@@ -16,12 +16,19 @@ ng_module(
     "//src/lib/input:input.css"
   ] + glob(["**/*.html"]),
   deps = [
-    "//src/lib/core",
+    "@angular//packages/animations",
+    "@angular//packages/common",
+    "@angular//packages/core",
+    "@angular//packages/forms",
+    "@angular//packages/platform-browser/animations",
+    "@rxjs",
+    "@rxjs//operators",
+    "//src/cdk/bidi",
     "//src/cdk/coercion",
     "//src/cdk/observers",
     "//src/cdk/platform",
+    "//src/lib/core",
   ],
-  tsconfig = "//src/lib:tsconfig-build.json",
 )
 
 # TODO(jelbourn): replace this w/ sass_library when it supports acting like a filegroup

src/lib/grid-list/BUILD.bazel

@@ -1,7 +1,7 @@
 package(default_visibility=["//visibility:public"])
-load("@angular//:index.bzl", "ng_module")
-load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
 
+load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
+load("//tools:defaults.bzl", "ng_module")
 
 ng_module(
   name = "grid-list",
@@ -9,11 +9,11 @@ ng_module(
   module_name = "@angular/material/grid-list",
   assets = [":grid-list.css"] + glob(["**/*.html"]),
   deps = [
-    "//src/lib/core",
+    "@angular//packages/core",
     "//src/cdk/bidi",
     "//src/cdk/coercion",
+    "//src/lib/core",
   ],
-  tsconfig = "//src/lib:tsconfig-build.json",
 )
 
 # TODO(jelbourn): replace this w/ sass_library when it supports acting like a filegroup

src/lib/icon/BUILD.bazel

@@ -1,7 +1,7 @@
 package(default_visibility=["//visibility:public"])
-load("@angular//:index.bzl", "ng_module")
-load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
 
+load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
+load("//tools:defaults.bzl", "ng_module")
 
 ng_module(
   name = "icon",
@@ -9,9 +9,15 @@ ng_module(
   module_name = "@angular/material/icon",
   assets = [":icon.css"] + glob(["**/*.html"]),
   deps = [
+    "@angular//packages/common",
+    "@angular//packages/common/http",
+    "@angular//packages/core",
+    "@angular//packages/platform-browser",
+    "@rxjs",
+    "@rxjs//operators",
+    "//src/cdk/coercion",
     "//src/lib/core",
   ],
-  tsconfig = "//src/lib:tsconfig-build.json",
 )
 
 # TODO(jelbourn): replace this w/ sass_library when it supports acting like a filegroup

src/lib/input/BUILD.bazel

@@ -1,7 +1,7 @@
 package(default_visibility=["//visibility:public"])
-load("@angular//:index.bzl", "ng_module")
-load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
 
+load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
+load("//tools:defaults.bzl", "ng_module")
 
 ng_module(
   name = "input",
@@ -11,14 +11,16 @@ ng_module(
     ":input.css",
   ] + glob(["**/*.html"]),
   deps = [
+    "@angular//packages/common",
+    "@angular//packages/core",
+    "@angular//packages/forms",
     "@rxjs",
-    "//src/lib/core",
-    "//src/lib/form-field",
     "//src/cdk/coercion",
     "//src/cdk/platform",
     "//src/cdk/text-field",
+    "//src/lib/core",
+    "//src/lib/form-field",
   ],
-  tsconfig = "//src/lib:tsconfig-build.json",
 )
 
 # TODO(jelbourn): replace this w/ sass_library when it supports acting like a filegroup

src/lib/list/BUILD.bazel

@@ -1,7 +1,7 @@
 package(default_visibility=["//visibility:public"])
-load("@angular//:index.bzl", "ng_module")
-load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
 
+load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
+load("//tools:defaults.bzl", "ng_module")
 
 ng_module(
   name = "list",
@@ -9,14 +9,17 @@ ng_module(
   module_name = "@angular/material/list",
   assets = [":list.css"] + glob(["**/*.html"]),
   deps = [
-    "//src/lib/core",
-    "//src/lib/divider",
+    "@angular//packages/common",
+    "@angular//packages/core",
+    "@angular//packages/forms",
+    "@rxjs",
     "//src/cdk/a11y",
     "//src/cdk/coercion",
     "//src/cdk/collections",
     "//src/cdk/keycodes",
+    "//src/lib/core",
+    "//src/lib/divider",
   ],
-  tsconfig = "//src/lib:tsconfig-build.json",
 )
 
 

src/lib/menu/BUILD.bazel

@@ -1,7 +1,7 @@
 package(default_visibility=["//visibility:public"])
-load("@angular//:index.bzl", "ng_module")
-load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
 
+load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
+load("//tools:defaults.bzl", "ng_module")
 
 ng_module(
   name = "menu",
@@ -9,15 +9,19 @@ ng_module(
   module_name = "@angular/material/menu",
   assets = [":menu.css"] + glob(["**/*.html"]),
   deps = [
-    "//src/lib/core",
+    "@angular//packages/animations",
+    "@angular//packages/common",
+    "@angular//packages/core",
+    "@rxjs",
+    "@rxjs//operators",
     "//src/cdk/a11y",
     "//src/cdk/bidi",
     "//src/cdk/coercion",
     "//src/cdk/keycodes",
     "//src/cdk/overlay",
     "//src/cdk/portal",
+    "//src/lib/core",
   ],
-  tsconfig = "//src/lib:tsconfig-build.json",
 )
 
 # TODO(jelbourn): replace this w/ sass_library when it supports acting like a filegroup

src/lib/paginator/BUILD.bazel

@@ -1,7 +1,7 @@
 package(default_visibility=["//visibility:public"])
-load("@angular//:index.bzl", "ng_module")
-load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
 
+load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
+load("//tools:defaults.bzl", "ng_module")
 
 ng_module(
   name = "paginator",
@@ -9,13 +9,15 @@ ng_module(
   module_name = "@angular/material/paginator",
   assets = [":paginator.css"] + glob(["**/*.html"]),
   deps = [
-    "//src/lib/core",
+    "@angular//packages/common",
+    "@angular//packages/core",
+    "@rxjs",
+    "//src/cdk/coercion",
     "//src/lib/button",
+    "//src/lib/core",
     "//src/lib/select",
     "//src/lib/tooltip",
-    "@rxjs",
   ],
-  tsconfig = "//src/lib:tsconfig-build.json",
 )
 
 

src/lib/progress-bar/BUILD.bazel

@@ -1,7 +1,7 @@
 package(default_visibility=["//visibility:public"])
-load("@angular//:index.bzl", "ng_module")
-load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
 
+load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
+load("//tools:defaults.bzl", "ng_module")
 
 ng_module(
   name = "progress-bar",
@@ -9,9 +9,13 @@ ng_module(
   module_name = "@angular/material/progress-bar",
   assets = [":progress-bar.css"] + glob(["**/*.html"]),
   deps = [
+    "@angular//packages/common",
+    "@angular//packages/core",
+    "@angular//packages/platform-browser/animations",
+    "@rxjs",
+    "@rxjs//operators",
     "//src/lib/core",
   ],
-  tsconfig = "//src/lib:tsconfig-build.json",
 )
 
 

src/lib/progress-spinner/BUILD.bazel

@@ -1,7 +1,7 @@
 package(default_visibility=["//visibility:public"])
-load("@angular//:index.bzl", "ng_module")
-load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
 
+load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
+load("//tools:defaults.bzl", "ng_module")
 
 ng_module(
   name = "progress-spinner",
@@ -9,10 +9,13 @@ ng_module(
   module_name = "@angular/material/progress-spinner",
   assets = [":progress-spinner.css"] + glob(["**/*.html"]),
   deps = [
+    "@angular//packages/common",
+    "@angular//packages/core",
+    "@angular//packages/platform-browser/animations",
+    "//src/cdk/coercion",
     "//src/cdk/platform",
     "//src/lib/core",
   ],
-  tsconfig = "//src/lib:tsconfig-build.json",
 )
 
 # TODO(jelbourn): replace this w/ sass_library when it supports acting like a filegroup

src/lib/radio/BUILD.bazel

@@ -1,7 +1,7 @@
 package(default_visibility=["//visibility:public"])
-load("@angular//:index.bzl", "ng_module")
-load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
 
+load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
+load("//tools:defaults.bzl", "ng_module")
 
 ng_module(
   name = "radio",
@@ -9,12 +9,15 @@ ng_module(
   module_name = "@angular/material/radio",
   assets = [":radio.css"] + glob(["**/*.html"]),
   deps = [
-    "//src/lib/core",
+    "@angular//packages/common",
+    "@angular//packages/core",
+    "@angular//packages/forms",
+    "@angular//packages/platform-browser/animations",
     "//src/cdk/a11y",
     "//src/cdk/coercion",
     "//src/cdk/collections",
+    "//src/lib/core",
   ],
-  tsconfig = "//src/lib:tsconfig-build.json",
 )
 
 # TODO(jelbourn): replace this w/ sass_library when it supports acting like a filegroup

src/lib/select/BUILD.bazel

@@ -1,7 +1,7 @@
 package(default_visibility=["//visibility:public"])
-load("@angular//:index.bzl", "ng_module")
-load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
 
+load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
+load("//tools:defaults.bzl", "ng_module")
 
 ng_module(
   name = "select",
@@ -9,17 +9,22 @@ ng_module(
   module_name = "@angular/material/select",
   assets = [":select.css"] + glob(["**/*.html"]),
   deps = [
-    "//src/lib/core",
-    "//src/lib/form-field",
+    "@angular//packages/animations",
+    "@angular//packages/common",
+    "@angular//packages/core",
+    "@angular//packages/forms",
+    "@rxjs",
+    "@rxjs//operators",
     "//src/cdk/a11y",
     "//src/cdk/bidi",
     "//src/cdk/coercion",
     "//src/cdk/collections",
     "//src/cdk/keycodes",
     "//src/cdk/overlay",
-    "@rxjs",
+    "//src/cdk/scrolling",
+    "//src/lib/core",
+    "//src/lib/form-field",
   ],
-  tsconfig = "//src/lib:tsconfig-build.json",
 )
 
 # TODO(jelbourn): replace this w/ sass_library when it supports acting like a filegroup

src/lib/sidenav/BUILD.bazel

@@ -1,7 +1,7 @@
 package(default_visibility=["//visibility:public"])
-load("@angular//:index.bzl", "ng_module")
-load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
 
+load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
+load("//tools:defaults.bzl", "ng_module")
 
 ng_module(
   name = "sidenav",
@@ -9,16 +9,20 @@ ng_module(
   module_name = "@angular/material/sidenav",
   assets = [":drawer.css"] + glob(["**/*.html"]),
   deps = [
-    "//src/lib/core",
+    "@angular//packages/animations",
+    "@angular//packages/common",
+    "@angular//packages/core",
+    "@angular//packages/platform-browser/animations",
+    "@rxjs",
+    "@rxjs//operators",
     "//src/cdk/a11y",
     "//src/cdk/bidi",
     "//src/cdk/coercion",
     "//src/cdk/keycodes",
     "//src/cdk/platform",
     "//src/cdk/scrolling",
-    "@rxjs",
+    "//src/lib/core",
   ],
-  tsconfig = "//src/lib:tsconfig-build.json",
 )
 
 # TODO(jelbourn): replace this w/ sass_library when it supports acting like a filegroup

src/lib/slide-toggle/BUILD.bazel

@@ -1,7 +1,7 @@
 package(default_visibility=["//visibility:public"])
-load("@angular//:index.bzl", "ng_module")
-load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
 
+load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
+load("//tools:defaults.bzl", "ng_module")
 
 ng_module(
   name = "slide-toggle",
@@ -9,14 +9,17 @@ ng_module(
   module_name = "@angular/material/slide-toggle",
   assets = [":slide-toggle.css"] + glob(["**/*.html"]),
   deps = [
-    "//src/lib/core",
+    "@angular//packages/core",
+    "@angular//packages/forms",
+    "@angular//packages/platform-browser",
+    "@angular//packages/platform-browser/animations",
     "//src/cdk/a11y",
     "//src/cdk/bidi",
     "//src/cdk/coercion",
     "//src/cdk/observers",
     "//src/cdk/platform",
+    "//src/lib/core",
   ],
-  tsconfig = "//src/lib:tsconfig-build.json",
 )
 
 # TODO(jelbourn): replace this w/ sass_library when it supports acting like a filegroup

src/lib/slider/BUILD.bazel

@@ -1,7 +1,7 @@
 package(default_visibility=["//visibility:public"])
-load("@angular//:index.bzl", "ng_module")
-load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
 
+load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
+load("//tools:defaults.bzl", "ng_module")
 
 ng_module(
   name = "slider",
@@ -9,14 +9,18 @@ ng_module(
   module_name = "@angular/material/slider",
   assets = [":slider.css"] + glob(["**/*.html"]),
   deps = [
-    "//src/lib/core",
+    "@angular//packages/common",
+    "@angular//packages/core",
+    "@angular//packages/forms",
+    "@angular//packages/platform-browser",
+    "@angular//packages/platform-browser/animations",
+    "@rxjs",
     "//src/cdk/a11y",
     "//src/cdk/bidi",
     "//src/cdk/coercion",
     "//src/cdk/keycodes",
-    "@rxjs",
+    "//src/lib/core",
   ],
-  tsconfig = "//src/lib:tsconfig-build.json",
 )
 
 # TODO(jelbourn): replace this w/ sass_library when it supports acting like a filegroup

src/lib/snack-bar/BUILD.bazel

@@ -1,7 +1,7 @@
 package(default_visibility=["//visibility:public"])
-load("@angular//:index.bzl", "ng_module")
-load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
 
+load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
+load("//tools:defaults.bzl", "ng_module")
 
 ng_module(
   name = "snack-bar",
@@ -12,15 +12,19 @@ ng_module(
     ":simple-snack-bar.css",
   ] + glob(["**/*.html"]),
   deps = [
-    "//src/lib/button",
-    "//src/lib/core",
+    "@angular//packages/animations",
+    "@angular//packages/common",
+    "@angular//packages/core",
+    "@rxjs",
+    "@rxjs//operators",
     "//src/cdk/a11y",
+    "//src/cdk/bidi",
     "//src/cdk/layout",
     "//src/cdk/overlay",
     "//src/cdk/portal",
-    "@rxjs",
+    "//src/lib/button",
+    "//src/lib/core",
   ],
-  tsconfig = "//src/lib:tsconfig-build.json",
 )
 
 # TODO(jelbourn): replace this w/ sass_library when it supports acting like a filegroup

src/lib/sort/BUILD.bazel

@@ -1,7 +1,7 @@
 package(default_visibility=["//visibility:public"])
-load("@angular//:index.bzl", "ng_module")
-load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
 
+load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
+load("//tools:defaults.bzl", "ng_module")
 
 ng_module(
   name = "sort",
@@ -9,12 +9,14 @@ ng_module(
   module_name = "@angular/material/sort",
   assets = [":sort-header.css"] + glob(["**/*.html"]),
   deps = [
-    "//src/lib/core",
+    "@angular//packages/animations",
+    "@angular//packages/common",
+    "@angular//packages/core",
+    "@rxjs",
     "//src/cdk/coercion",
     "//src/cdk/table",
-    "@rxjs",
+    "//src/lib/core",
   ],
-  tsconfig = "//src/lib:tsconfig-build.json",
 )
 
 # TODO(jelbourn): replace this w/ sass_library when it supports acting like a filegroup

src/lib/stepper/BUILD.bazel

@@ -1,7 +1,7 @@
 package(default_visibility=["//visibility:public"])
-load("@angular//:index.bzl", "ng_module")
-load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
 
+load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
+load("//tools:defaults.bzl", "ng_module")
 
 ng_module(
   name = "stepper",
@@ -12,17 +12,20 @@ ng_module(
     ":step-header.css",
   ] + glob(["**/*.html"]),
   deps = [
-    "//src/lib/core",
-    "//src/lib/button",
-    "//src/lib/icon",
+    "@angular//packages/animations",
+    "@angular//packages/common",
+    "@angular//packages/core",
+    "@angular//packages/forms",
+    "@rxjs",
+    "@rxjs//operators",
     "//src/cdk/a11y",
     "//src/cdk/bidi",
-    "//src/cdk/coercion",
     "//src/cdk/portal",
     "//src/cdk/stepper",
-    "@rxjs",
+    "//src/lib/button",
+    "//src/lib/core",
+    "//src/lib/icon",
   ],
-  tsconfig = "//src/lib:tsconfig-build.json",
 )
 
 # TODO(jelbourn): replace this w/ sass_library when it supports acting like a filegroup

src/lib/table/BUILD.bazel

@@ -1,7 +1,7 @@
 package(default_visibility=["//visibility:public"])
-load("@angular//:index.bzl", "ng_module")
-load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
 
+load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
+load("//tools:defaults.bzl", "ng_module")
 
 ng_module(
   name = "table",
@@ -9,15 +9,16 @@ ng_module(
   module_name = "@angular/material/table",
   assets = [":table.css"],
   deps = [
-    "//src/cdk/bidi",
+    "@angular//packages/common",
+    "@angular//packages/core",
+    "@rxjs",
+    "@rxjs//operators",
+    "//src/cdk/coercion",
+    "//src/cdk/table",
     "//src/lib/core",
     "//src/lib/paginator",
     "//src/lib/sort",
-    "//src/cdk/table",
-    "//src/cdk/platform",
-    "@rxjs",
   ] + glob(["**/*.html"]),
-  tsconfig = "//src/lib:tsconfig-build.json",
 )
 
 # TODO(jelbourn): replace this w/ sass_library when it supports acting like a filegroup

src/lib/tabs/BUILD.bazel

@@ -1,7 +1,7 @@
 package(default_visibility=["//visibility:public"])
-load("@angular//:index.bzl", "ng_module")
-load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
 
+load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
+load("//tools:defaults.bzl", "ng_module")
 
 ng_module(
   name = "tabs",
@@ -14,16 +14,21 @@ ng_module(
     ":tab-nav-bar/tab-nav-bar.css",
   ] + glob(["**/*.html"]),
   deps = [
-    "//src/lib/core",
+    "@angular//packages/animations",
+    "@angular//packages/common",
+    "@angular//packages/core",
+    "@rxjs",
+    "@rxjs//operators",
     "//src/cdk/a11y",
     "//src/cdk/bidi",
     "//src/cdk/coercion",
+    "//src/cdk/keycodes",
     "//src/cdk/observers",
+    "//src/cdk/platform",
     "//src/cdk/portal",
     "//src/cdk/scrolling",
-    "@rxjs",
+    "//src/lib/core",
   ],
-  tsconfig = "//src/lib:tsconfig-build.json",
 )
 
 

src/lib/toolbar/BUILD.bazel

@@ -1,7 +1,7 @@
 package(default_visibility=["//visibility:public"])
-load("@angular//:index.bzl", "ng_module")
-load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
 
+load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
+load("//tools:defaults.bzl", "ng_module")
 
 ng_module(
   name = "toolbar",
@@ -9,10 +9,11 @@ ng_module(
   module_name = "@angular/material/toolbar",
   assets = [":toolbar.css"] + glob(["**/*.html"]),
   deps = [
-    "//src/lib/core",
+    "@angular//packages/common",
+    "@angular//packages/core",
     "//src/cdk/platform",
+    "//src/lib/core",
   ],
-  tsconfig = "//src/lib:tsconfig-build.json",
 )
 
 # TODO(jelbourn): replace this w/ sass_library when it supports acting like a filegroup

src/lib/tooltip/BUILD.bazel

@@ -1,7 +1,7 @@
 package(default_visibility=["//visibility:public"])
-load("@angular//:index.bzl", "ng_module")
-load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
 
+load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
+load("//tools:defaults.bzl", "ng_module")
 
 ng_module(
   name = "tooltip",
@@ -9,19 +9,23 @@ ng_module(
   module_name = "@angular/material/tooltip",
   assets = [":tooltip.css"] + glob(["**/*.html"]),
   deps = [
-    "//src/lib/core",
+    "@angular//packages/animations",
+    "@angular//packages/common",
+    "@angular//packages/core",
+    "@angular//packages/platform-browser",
+    "@rxjs",
+    "@rxjs//operators",
     "//src/cdk/a11y",
     "//src/cdk/bidi",
     "//src/cdk/coercion",
+    "//src/cdk/keycodes",
+    "//src/cdk/layout",
     "//src/cdk/overlay",
     "//src/cdk/platform",
-    "//src/cdk/keycodes",
     "//src/cdk/portal",
     "//src/cdk/scrolling",
-    "//src/cdk/layout",
-    "@rxjs",
+    "//src/lib/core",
   ],
-  tsconfig = "//src/lib:tsconfig-build.json",
 )
 
 # TODO(jelbourn): replace this w/ sass_library when it supports acting like a filegroup

src/lib/tree/BUILD.bazel

@@ -1,7 +1,7 @@
 package(default_visibility=["//visibility:public"])
-load("@angular//:index.bzl", "ng_module")
-load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
 
+load("@io_bazel_rules_sass//sass:sass.bzl", "sass_library", "sass_binary")
+load("//tools:defaults.bzl", "ng_module")
 
 ng_module(
   name = "tree",
@@ -9,11 +9,14 @@ ng_module(
   module_name = "@angular/material/tree",
   assets = [":tree.css"] + glob(["**/*.html"]),
   deps = [
+    "@angular//packages/common",
+    "@angular//packages/core",
+    "@rxjs",
+    "@rxjs//operators",
+    "//src/cdk/collections",
     "//src/cdk/tree",
     "//src/lib/core",
-    "@rxjs",
   ],
-  tsconfig = "//src/lib:tsconfig-build.json",
 )
 
 # TODO(jelbourn): replace this w/ sass_library when it supports acting like a filegroup

src/module-typings.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Declares the global `module` variable that can be used outside of NodeJS.
+ *
+ * The module variable will be provided by given module bundlers (like Webpack) and helps
+ * Angular to determine assets relatively to the the original file location. All components
+ * within the CDK and Material specify the `module.id`.
+ *
+ * **Note**: This file is used by Bazel to build all `ng_module` rules. See `tools/defaults.bzl`.
+ */
+
+declare var module: {id: string};

tools/defaults.bzl

@@ -32,6 +32,10 @@ def ng_module(deps = [], tsconfig = None, testonly = False, **kwargs):
     # Since we use the TypeScript import helpers (tslib) for each TypeScript configuration,
     # we declare TSLib as default dependency
     "@npm//tslib",
+
+    # Depend on the module typings for each `ng_module`. Since all components within the project
+    # need to use `module.id` when creating components, this is always a dependency.
+    "//src:module-typings"
   ] + deps
 
   _ng_module(