mrkeyoor.com_
Tue 15 Sept 20:18 UTC
Webevaluationupdated 15 Sept 2026

components review

Angular Components is Google's official home for Angular Material, the Component Dev Kit, headless accessibility directives, Google Maps components, and a YouTube player. It gives Angular teams finished interface controls plus lower-level building blocks for making their own.

Verdict

Our Angular Components checkout pulled 1,938 packages and 1,253 MB before the build failed after 398 seconds, so cloning the monorepo should be reserved for contributors. Angular app teams should still put the official Material, CDK, or Aria packages on their shortlist because releases track Angular and the support matrix is explicit. Try the published package in an application first, then enter the source tree only when you need to change the library itself.

We ran it

Lab card: what happened when we ran componentsScreenshot of components (material.angular.dev)
Install✓ · 66s1938 packages · 1253 MB
Build✗ · 398s
Tests✗ · 8sran, no count parsed
Repo4798 files~329,061 lines of source · 23.4 MB · 13 CI workflows · tests dir

Answers from our run

Does components build from source?

Dependencies installed in 66 seconds (1938 packages), and the build failed. We cloned commit e25db3e into a clean Debian container with 3 CPUs and no project-specific setup.

Do components's tests pass?

The test command failed in our container, and its output did not report a pass or fail count.

Who should not use components?

React, Vue, Svelte, or framework-neutral projects: every published package here is built for Angular.

What are the alternatives to components?

Taiga UI, NG-ZORRO, Clarity Angular. Our Angular Components checkout pulled 1,938 packages and 1,253 MB before the build failed after 398 seconds, so cloning the monorepo should be reserved for contributors.

Setup2/566-second install, then generic build and test commands failed
Docs5/5Package, contributor, browser, test, and release guidance is clear
Community5/525,045 stars with current issue, pull request, and release activity
Maturity5/5Official Angular packages with aligned support and regular releases

Who it’s for

Angular teams that want interface packages maintained alongside the framework.
Design-system developers who need the CDK's lower-level behavior without adopting every Material component.
Product teams that value documented browser and screen-reader support.
Contributors prepared to work in a large pnpm and Bazel monorepo.

Who it’s NOT for

React, Vue, Svelte, or framework-neutral projects: every published package here is built for Angular.
Products that must support older browsers: the README promises only the most recent two versions of the major browsers.
Brands that need unrestricted visual design from a ready-made kit: the README limits Angular Material customization to the bounds of Material Design.
Occasional contributors looking for a small checkout: our install pulled 1,938 packages and occupied 1,253 MB before either verification command passed.
Developers expecting pnpm test to discover the whole suite: the developer guide requires a target, and the bare command failed in our run because none was supplied.

Setup reality

Our sandbox installed 1,938 pnpm packages in 66 seconds and used 1,253 MB. The build failed with exit code 1 after 398 seconds. Tests failed with exit code 1 after 8 seconds because the command received 0 non-option arguments and required at least 1.

Most app developers should install the published Angular packages instead of cloning this repository. Source contributors need Node and pnpm, while the development app accepts an optional GOOGLE_MAPS_KEY. The repository uses workspaces and Bazel-backed commands rather than a small standalone package flow.

The 23.4 MB checkout contained 4,798 files and about 329,061 source lines. Windows contributors are directed to WSL. The project supports the most recent two versions of major browsers, and package support follows Angular's release schedule. Our scan found 13 CI workflow files, a tests directory, and no Dockerfile.

Five packages cover finished UI and lower-level behavior

Angular Components maintains 5 package families: Angular Material, the Component Dev Kit, Angular Aria, Google Maps components, and a YouTube player. Material supplies ready interface controls. The CDK handles recurring behavior used to build custom controls, while Aria provides headless directives for common accessibility patterns. That split lets a team choose the visual system or only the underlying behavior instead of taking the whole repository as one library.

Release v22.1.6 shipped on September 9, 2026, and the README says Material and CDK follow Angular's support schedule. That alignment is the strongest reason to choose this project over an independent kit. An Angular upgrade still needs migration work, but the framework and its official component packages share a published release policy. Google maintains the project with community contributors under the MIT license.

App teams install packages while contributors face 4,798 files

The measured checkout had 4,798 files, roughly 329,061 lines of source, and a 23.4 MB Git tree before dependencies. It is a workspace monorepo containing the public packages, documentation site, examples, development applications, integration areas, and release tooling. pnpm manages packages, while Bazel-backed commands drive much of the build and test work. That structure makes sense for Google-scale maintenance and is excessive for evaluating a button or dialog.

Application developers get a much shorter path through the Angular CLI and published packages. A team can add Material to an existing app, or import CDK and Aria pieces where a custom design system needs behavior without Material styling. Contributors need Node, pnpm, a fork, the repository checkout, and the documented command conventions. On Windows, the developer guide directs repository contributors to WSL even though ordinary Angular application development remains supported natively.

What happened when we ran it

Our sandbox installed 1,938 packages in 66 seconds, leaving 1,253 MB on disk. The build then ran for 398 seconds and exited with status 1. Its log tail points to scripts/build-packages-dist-main.mts, followed by a child-process status of 1 and no captured standard output or error. That tail does not identify the failing package or the underlying error, so we cannot assign a cause.

The test command failed after 8 seconds. Its own help text said it needed at least 1 non-option argument and received 0, which is a clear interface error rather than a failed assertion. The checkout contained a tests directory and 13 CI workflow files, while our scan found no Dockerfile. These results describe commit e25db3e in an unprivileged Node 22 sandbox with 3 CPUs, 8 GB of RAM, and no secrets.

The 8-second test failure came from a missing target

Angular's developer guide documents pnpm test <target>, with a component name or source path as the target. Running pnpm test alone therefore does not mean "run everything" in this repository. Our command reached the test runner, printed its options, and stopped because no target was present. A contributor should choose the affected package or component, then use the separate end-to-end and lint commands when the change calls for them.

The build failure is less helpful. After 398 seconds, the supplied tail reports only the wrapper script and child status. It does not say whether Bazel, a package build, a platform tool, or another step failed. The responsible conclusion is limited: the documented root build did not finish successfully in our fresh Debian container, and its final output did not tell a new contributor what to fix.

Browser support stops at the two newest major versions

The README supports the most recent 2 versions of Chrome, Firefox, Safari, and Edge, including the named mobile variants. Its screen-reader matrix covers NVDA and JAWS on Windows, VoiceOver on macOS and iOS, Android Accessibility Suite, and ChromeVox. That is a useful contract for current product teams. It also gives teams with long-lived enterprise browsers a direct reason to choose another library or carry their own compatibility testing.

Accessibility work continues. Open issue 33775 reports NVDA reading a form-field error twice when a required marker is hidden, and it was updated on September 9, 2026. A current support matrix tells you where the team aims to work. Your application still needs tests for its exact labels, focus order, overlays, forms, browser versions, and assistive technology combinations.

Material customization stays inside Material Design

The README promises customization within the bounds of the Material Design specification. That makes Angular Material a strong default when the design language fits, but a poor shortcut for a brand that intends to replace its visual grammar. The CDK is the more useful part of this repository in that case. It provides common interaction patterns without requiring finished Material components, and Angular Aria goes further with headless accessible directives.

Taiga UI, NG-ZORRO, and Clarity Angular make different visual choices. Taiga UI favors modular imports and CSS custom properties. NG-ZORRO follows Ant Design and targets dense application interfaces. Clarity separates its static styles from its Angular controls. None is an automatic substitute for the CDK, so compare the behavior layer as carefully as the component gallery.

September issue traffic confirms active maintenance

GitHub recorded a last push on September 15, 2026, 25,045 stars, 1,185 open issues, and 170 open pull requests. Nine issues had closed since September 1 when we checked. The latest release, v22.1.6, arrived on September 9 with a CDK overlay fix. This is a busy repository with a large queue, and its APIs and fixes keep moving.

Start with the published package that solves the immediate application problem. The 66-second source install and 1,253 MB dependency footprint become relevant only when you plan to contribute, debug internals, or build release artifacts. At that point, name a test target before running the suite and budget for a root build whose failed tail may offer little diagnosis.

Alternatives

ProjectWhat it isPick it when
Taiga UIA modular Angular component kit with CSS-variable theming and a broad control catalog.pick this instead when your product needs a visual system outside Material Design and you want granular imports.
NG-ZORROAn Angular implementation of the Ant Design system aimed at application interfaces.pick this instead when Ant Design's dense enterprise patterns fit your product better than Material Design.
Clarity AngularAn Angular design system with separate packages for static styles and Angular components.pick this instead when Clarity's application patterns match your product and you want its CSS without every Angular control.

What people are saying

  1. [velocity-scout] angular/components
  2. [velocity-scout] styled-components/styled-components

Sources

  1. Angular Components README
  2. Angular Components developer environment
  3. Angular Components contribution guide
  4. Angular Components v22.1.6
  5. Angular Components issue 33775

More web reviews

gin · docs · docusaurus · react-admin · engine · openui · the whole board →