build: add ng_package interop for rules_js pnpm linking

In order to be able to pnpm-link first-party packages that are using
`ng_package`, we technically already need our new `ng_package` rule.
That rule is still WIP, so this interop layer allows for the same with
the old `ng_package` rule

Author: devversion

src/cdk-experimental/BUILD.bazel

@@ -16,6 +16,7 @@ ts_project(
 
 ng_package(
     name = "npm_package",
+    package_name = "@angular/cdk-experimental",
     srcs = ["package.json"],
     tags = ["release-package"],
     deps = [get_legacy_label(t) for t in CDK_EXPERIMENTAL_TARGETS],

src/cdk/BUILD.bazel

@@ -51,6 +51,7 @@ sass_library(
 # Creates the @angular/cdk package published to npm.
 ng_package(
     name = "npm_package",
+    package_name = "@angular/cdk",
     srcs = [
         "package.json",
         ":sass_lib",

src/google-maps/BUILD.bazel

@@ -35,6 +35,7 @@ ng_project(
 # Creates the @angular/google-maps package published to npm
 ng_package(
     name = "npm_package",
+    package_name = "@angular/google-maps",
     srcs = ["package.json"],
     nested_packages = ["//src/google-maps/schematics:npm_package"],
     tags = ["release-package"],

src/material-date-fns-adapter/BUILD.bazel

@@ -41,6 +41,7 @@ ng_web_test_suite(
 
 ng_package(
     name = "npm_package",
+    package_name = "@angular/material-date-fns-adapter",
     srcs = ["package.json"],
     nested_packages = ["//src/material-date-fns-adapter/schematics:npm_package"],
     tags = ["release-package"],

src/material-experimental/BUILD.bazel

@@ -34,6 +34,7 @@ sass_library(
 
 ng_package(
     name = "npm_package",
+    package_name = "@angular/material-experimental",
     srcs = [
         "package.json",
         ":sass_lib",

src/material-luxon-adapter/BUILD.bazel

@@ -43,6 +43,7 @@ ng_web_test_suite(
 
 ng_package(
     name = "npm_package",
+    package_name = "@angular/material-luxon-adapter",
     srcs = ["package.json"],
     nested_packages = ["//src/material-luxon-adapter/schematics:npm_package"],
     tags = ["release-package"],

src/material-moment-adapter/BUILD.bazel

@@ -42,6 +42,7 @@ ng_web_test_suite(
 
 ng_package(
     name = "npm_package",
+    package_name = "@angular/material-moment-adapter",
     srcs = ["package.json"],
     nested_packages = ["//src/material-moment-adapter/schematics:npm_package"],
     tags = ["release-package"],

src/material/BUILD.bazel

@@ -40,6 +40,7 @@ sass_library(
 # Creates the @angular/material package published to npm.
 ng_package(
     name = "npm_package",
+    package_name = "@angular/material",
     srcs = [
         "package.json",
         ":sass_lib",

src/youtube-player/BUILD.bazel

@@ -54,6 +54,7 @@ sass_binary(
 
 ng_package(
     name = "npm_package",
+    package_name = "@angular/youtube-player",
     srcs = ["package.json"],
     nested_packages = ["//src/youtube-player/schematics:npm_package"],
     tags = ["release-package"],

tools/bazel/ng_package_interop.bzl

@@ -0,0 +1,30 @@
+load("@aspect_rules_js//npm:providers.bzl", "NpmPackageInfo")
+load("@aspect_rules_js//js:libs.bzl", "js_lib_helpers")
+
+def _ng_package_interop_impl(ctx):
+    # forward all npm_package_store_infos
+    npm_package_store_infos = js_lib_helpers.gather_npm_package_store_infos(
+        targets = ctx.attr.interop_deps,
+    )
+
+    return [
+        NpmPackageInfo(
+            package = ctx.attr.package_name,
+            version = "0.0.0",
+            src = ctx.files.src[0],
+            npm_package_store_infos = npm_package_store_infos,
+        ),
+    ]
+
+ng_package_interop = rule(
+    implementation = _ng_package_interop_impl,
+    doc = """
+        Rule that makes `ng_package` rule output usable with `rules_js`. E.g.
+        for pnpm workspace linking of such first-party packages.
+    """,
+    attrs = {
+        "package_name": attr.string(mandatory = True),
+        "src": attr.label(mandatory = True),
+        "interop_deps": attr.label_list(mandatory = True),
+    },
+)

tools/defaults.bzl

@@ -18,6 +18,7 @@ load("//tools/markdown-to-html:index.bzl", _markdown_to_html = "markdown_to_html
 load("//tools/extract-tokens:index.bzl", _extract_tokens = "extract_tokens")
 load("//tools/angular:index.bzl", "LINKER_PROCESSED_FW_PACKAGES")
 load("//tools/bazel:legacy_target.bzl", "get_legacy_label")
+load("//tools/bazel:ng_package_interop.bzl", "ng_package_interop")
 
 npmPackageSubstitutions = select({
     "//tools:stamp": NPM_PACKAGE_SUBSTITUTIONS,
@@ -46,7 +47,15 @@ def sass_library(**kwargs):
 def npm_sass_library(**kwargs):
     _npm_sass_library(**kwargs)
 
-def ng_package(name, srcs = [], deps = [], externals = PKG_EXTERNALS, readme_md = None, visibility = None, **kwargs):
+def ng_package(
+        name,
+        package_name,
+        srcs = [],
+        deps = [],
+        externals = PKG_EXTERNALS,
+        readme_md = None,
+        visibility = None,
+        **kwargs):
     # If no readme file has been specified explicitly, use the default readme for
     # release packages from "src/README.md".
     if not readme_md:
@@ -95,6 +104,13 @@ def ng_package(name, srcs = [], deps = [], externals = PKG_EXTERNALS, readme_md
         visibility = visibility,
     )
 
+    ng_package_interop(
+        name = "pkg",
+        src = ":%s" % name,
+        interop_deps = [d.replace("_legacy", "") for d in deps],
+        package_name = package_name,
+    )
+
 def pkg_npm(name, visibility = None, **kwargs):
     _pkg_npm(
         name = name,