fix: bazel support for downstream apps (#13836)

src/cdk/coercion/BUILD.bazel

@@ -6,14 +6,14 @@ ts_library(
   name = "coercion",
   srcs = glob(["**/*.ts"], exclude=["**/*.spec.ts"]),
   module_name = "@angular/cdk/coercion",
-  deps = ["@npm//tslib"],
+  deps = ["@matdeps//tslib"],
 )
 
 ts_library(
   name = "coercion_test_sources",
   srcs = glob(["**/*.spec.ts"]),
   deps = [
-    "@npm//@types/jasmine",
+    "@matdeps//@types/jasmine",
     ":coercion"
   ],
   testonly = 1,

src/cdk/collections/BUILD.bazel

@@ -16,7 +16,7 @@ ts_library(
   name = "collections_test_sources",
   srcs = glob(["**/*.spec.ts"]),
   deps = [
-    "@npm//@types/jasmine",
+    "@matdeps//@types/jasmine",
     ":collections"
   ],
   testonly = 1,

src/cdk/keycodes/BUILD.bazel

@@ -6,5 +6,5 @@ ts_library(
   name = "keycodes",
   module_name = "@angular/cdk/keycodes",
   srcs = glob(["**/*.ts"], exclude=["**/*.spec.ts"]),
-  deps = ["@npm//tslib"],
+  deps = ["@matdeps//tslib"],
 )

src/cdk/schematics/BUILD.bazel

@@ -1,9 +1,8 @@
 package(default_visibility = ["//visibility:public"])
 
-load("@build_bazel_rules_typescript//:defs.bzl", "ts_library")
 load("@build_bazel_rules_nodejs//:defs.bzl", "npm_package")
 load("//:packages.bzl", "VERSION_PLACEHOLDER_REPLACEMENTS")
-load("//tools:defaults.bzl", "jasmine_node_test")
+load("//tools:defaults.bzl", "jasmine_node_test", "ts_library")
 
 # TODO(devversion): remove when https://github.com/bazelbuild/rules_nodejs/issues/352 is fixed
 exports_files(["#bazel_workaround.txt"])
@@ -24,15 +23,15 @@ ts_library(
   ]),
   tsconfig = ":tsconfig.json",
   deps = [
-    "@npm//@schematics/angular",
-    "@npm//@angular-devkit/schematics",
+    "@matdeps//@schematics/angular",
+    "@matdeps//@angular-devkit/schematics",
     # TODO(devversion): Only include jasmine for test sources (See: tsconfig types).
-    "@npm//@types/jasmine",
-    "@npm//@types/node",
-    "@npm//glob",
-    "@npm//parse5",
-    "@npm//tslint",
-    "@npm//typescript"
+    "@matdeps//@types/jasmine",
+    "@matdeps//@types/node",
+    "@matdeps//glob",
+    "@matdeps//parse5",
+    "@matdeps//tslint",
+    "@matdeps//typescript"
   ],
 )
 
@@ -57,13 +56,13 @@ ts_library(
   srcs = glob(["**/*.spec.ts"], exclude = ["**/files/**/*.spec.ts"]),
   deps = [
     "//src/cdk/schematics/testing",
-    "@npm//@schematics/angular",
-    "@npm//@angular-devkit/schematics",
-    "@npm//@types/jasmine",
-    "@npm//@types/node",
-    "@npm//mock-fs",
-    "@npm//tslint",
-    "@npm//typescript",
+    "@matdeps//@schematics/angular",
+    "@matdeps//@angular-devkit/schematics",
+    "@matdeps//@types/jasmine",
+    "@matdeps//@types/node",
+    "@matdeps//mock-fs",
+    "@matdeps//tslint",
+    "@matdeps//typescript",
     ":schematics",
   ],
   tsconfig = ":tsconfig.json",

src/cdk/schematics/testing/BUILD.bazel

@@ -7,12 +7,12 @@ ts_library(
   module_name = "@angular/cdk/schematics/testing",
   srcs = glob(["**/*.ts"]),
   deps = [
-    "@npm//@angular-devkit/core",
-    "@npm//@angular-devkit/schematics",
-    "@npm//@schematics/angular",
-    "@npm//@types/node",
-    "@npm//@types/fs-extra",
-    "@npm//fs-extra",
-    "@npm//rxjs",
+    "@matdeps//@angular-devkit/core",
+    "@matdeps//@angular-devkit/schematics",
+    "@matdeps//@schematics/angular",
+    "@matdeps//@types/node",
+    "@matdeps//@types/fs-extra",
+    "@matdeps//fs-extra",
+    "@matdeps//rxjs",
   ],
 )

src/lib/form-field/BUILD.bazel

@@ -10,10 +10,10 @@ ng_module(
   assets = [
     ":form-field.css",
     ":form-field-fill.css",
+    ":form-field-input.css",
     ":form-field-legacy.css",
     ":form-field-outline.css",
     ":form-field-standard.css",
-    "//src/lib/input:input.css"
   ] + glob(["**/*.html"]),
   deps = [
     "@angular//packages/animations",
@@ -49,6 +49,12 @@ sass_binary(
   deps = ["//src/lib/core:core_scss_lib"],
 )
 
+sass_binary(
+  name = "form_field_input_scss",
+  src = "form-field-input.scss",
+  deps = ["//src/lib/core:core_scss_lib"],
+)
+
 sass_binary(
   name = "form_field_legacy_scss",
   src = "form-field-legacy.scss",

src/lib/form-field/form-field.ts

@@ -99,16 +99,16 @@ export const MAT_FORM_FIELD_DEFAULT_OPTIONS =
   selector: 'mat-form-field',
   exportAs: 'matFormField',
   templateUrl: 'form-field.html',
-  // MatInput is a directive and can't have styles, so we need to include its styles here.
-  // The MatInput styles are fairly minimal so it shouldn't be a big deal for people who
-  // aren't using MatInput.
+  // MatInput is a directive and can't have styles, so we need to include its styles here
+  // in form-field-input.css. The MatInput styles are fairly minimal so it shouldn't be a
+  // big deal for people who aren't using MatInput.
   styleUrls: [
     'form-field.css',
     'form-field-fill.css',
+    'form-field-input.css',
     'form-field-legacy.css',
     'form-field-outline.css',
     'form-field-standard.css',
-    '../input/input.css',
   ],
   animations: [matFormFieldAnimations.transitionMessages],
   host: {

src/lib/input/BUILD.bazel

@@ -7,9 +7,7 @@ ng_module(
   name = "input",
   srcs = glob(["**/*.ts"], exclude=["**/*.spec.ts"]),
   module_name = "@angular/material/input",
-  assets = [
-    ":input.css",
-  ] + glob(["**/*.html"]),
+  assets = glob(["**/*.html"]),
   deps = [
     "@angular//packages/common",
     "@angular//packages/core",
@@ -29,12 +27,6 @@ filegroup(
   srcs = glob(["**/_*.scss"]),
 )
 
-sass_binary(
-  name = "input_scss",
-  src = "input.scss",
-  deps = ["//src/lib/core:core_scss_lib"],
-)
-
 sass_library(
   name = "theme",
   srcs = glob(["**/*-theme.scss"]),

src/lib/schematics/BUILD.bazel

@@ -1,9 +1,8 @@
 package(default_visibility = ["//visibility:public"])
 
-load("@build_bazel_rules_typescript//:defs.bzl", "ts_library")
 load("@build_bazel_rules_nodejs//:defs.bzl", "npm_package")
 load("//:packages.bzl", "VERSION_PLACEHOLDER_REPLACEMENTS")
-load("//tools:defaults.bzl", "jasmine_node_test")
+load("//tools:defaults.bzl", "jasmine_node_test", "ts_library")
 
 filegroup(
   name = "schematics_assets",
@@ -20,13 +19,13 @@ ts_library(
   ]),
   deps = [
     "//src/cdk/schematics",
-    "@npm//@angular-devkit/schematics",
-    "@npm//@schematics/angular",
+    "@matdeps//@angular-devkit/schematics",
+    "@matdeps//@schematics/angular",
     # TODO(devversion): Only include jasmine for test sources (See: tsconfig types).
-    "@npm//@types/jasmine",
-    "@npm//@types/node",
-    "@npm//tslint",
-    "@npm//typescript",
+    "@matdeps//@types/jasmine",
+    "@matdeps//@types/node",
+    "@matdeps//tslint",
+    "@matdeps//typescript",
   ],
   tsconfig = ":tsconfig.json",
 )
@@ -54,10 +53,10 @@ ts_library(
     ":schematics",
     "//src/cdk/schematics",
     "//src/cdk/schematics/testing",
-    "@npm//@schematics/angular",
-    "@npm//@angular-devkit/schematics",
-    "@npm//@types/jasmine",
-    "@npm//@types/node",
+    "@matdeps//@schematics/angular",
+    "@matdeps//@angular-devkit/schematics",
+    "@matdeps//@types/jasmine",
+    "@matdeps//@types/node",
   ],
   tsconfig = ":tsconfig.json",
   testonly = True,

src/material-moment-adapter/BUILD.bazel

@@ -10,7 +10,7 @@ ng_module(
   module_name = "@angular/material-moment-adapter",
   deps = [
     "@angular//packages/core",
-    "@npm//moment",
+    "@matdeps//moment",
     "//src/lib/core"
   ],
   # Explicitly specify the tsconfig that is also used by Gulp. We need to explicitly use this