Angular Version Matrix

Which package to install and what works on each Angular version.

Package selection

Angular version	Package to install	Status
Angular 21+	`primus-angular-ui`	✅ Current — recommended
Angular 20	`primus-angular-ui-legacy`	✅ Supported
Angular 19	`primus-angular-ui-legacy`	✅ Supported
Angular 18	`primus-angular-ui-legacy`	✅ Supported
Angular 17	`primus-angular-ui-legacy`	✅ Supported
Angular 16	`primus-angular-ui-legacy`	⚠️ Maintained, no new features
Angular 15 and below	Not supported	❌

Component compatibility

✅ = Fully supported · ⚠️ = Supported with limitations · ❌ = Not available

Forms

Component	Angular 16	Angular 17	Angular 18	Angular 19	Angular 20	Angular 21+
`primus-button`	✅	✅	✅	✅	✅	✅
`primus-input`	✅	✅	✅	✅	✅	✅
`primus-select`	✅	✅	✅	✅	✅	✅
`primus-checkbox`	✅	✅	✅	✅	✅	✅
`primus-toggle`	✅	✅	✅	✅	✅	✅
`primus-radio-group`	✅	✅	✅	✅	✅	✅
`primus-date-picker`	✅	✅	✅	✅	✅	✅
`primus-date-range-picker`	⚠️	✅	✅	✅	✅	✅
`primus-password-input`	⚠️	✅	✅	✅	✅	✅
`primus-input-group`	✅	✅	✅	✅	✅	✅
`primus-textarea`	✅	✅	✅	✅	✅	✅
`primus-form-field`	✅	✅	✅	✅	✅	✅

Dashboards & Data

Component	Angular 16	Angular 17	Angular 18	Angular 19	Angular 20	Angular 21+
`primus-data-table`	✅	✅	✅	✅	✅	✅
`primus-stats-card`	✅	✅	✅	✅	✅	✅
`primus-dashboard`	✅	✅	✅	✅	✅	✅
`primus-dashboard-grid`	✅	✅	✅	✅	✅	✅
`primus-activity-feed`	✅	✅	✅	✅	✅	✅
`primus-filter-bar`	✅	✅	✅	✅	✅	✅
`primus-export-menu`	✅	✅	✅	✅	✅	✅
`primus-security-dashboard`	⚠️	✅	✅	✅	✅	✅
`primus-rbac-admin`	❌	⚠️	✅	✅	✅	✅
`primus-search`	✅	✅	✅	✅	✅	✅
`primus-log-viewer`	✅	✅	✅	✅	✅	✅
Charts (all)	✅	✅	✅	✅	✅	✅

Component	Angular 16	Angular 17	Angular 18	Angular 19	Angular 20	Angular 21+
`primus-layout`	✅	✅	✅	✅	✅	✅
`primus-sidebar`	✅	✅	✅	✅	✅	✅
`primus-header`	✅	✅	✅	✅	✅	✅
`primus-section`	✅	✅	✅	✅	✅	✅
`primus-modal`	✅	✅	✅	✅	✅	✅

Authentication

Component	Angular 16	Angular 17	Angular 18	Angular 19	Angular 20	Angular 21+
`primus-login`	✅	✅	✅	✅	✅	✅
`primus-user-profile`	✅	✅	✅	✅	✅	✅
`primus-ai-copilot`	⚠️	✅	✅	✅	✅	✅
`PrimusAuthService`	✅	✅	✅	✅	✅	✅
`authGuard`	✅	✅	✅	✅	✅	✅

Workflows

Component	Angular 16	Angular 17	Angular 18	Angular 19	Angular 20	Angular 21+
`primus-wizard`	⚠️	✅	✅	✅	✅	✅
`primus-stepper`	✅	✅	✅	✅	✅	✅
`primus-wizard-nav`	✅	✅	✅	✅	✅	✅
`primus-summary-card`	✅	✅	✅	✅	✅	✅

Banking & Insurance

Component	Angular 16	Angular 17	Angular 18	Angular 19	Angular 20	Angular 21+
All banking components	⚠️	✅	✅	✅	✅	✅
All insurance components	⚠️	✅	✅	✅	✅	✅

Legacy-only components (primus-angular-ui-legacy only)

These components exist only in the legacy package and are not available in primus-angular-ui:

Component	Description
`primus-metric-card`	Alternative stat card layout (superseded by `primus-stats-card`)
`primus-progress-ring`	Circular progress indicator

Limitation notes

Symbol	Meaning
⚠️ on Angular 16	Works but requires `NgModule` — Standalone not available on Angular 16
⚠️ on Angular 17	Works but requires explicit `CUSTOM_ELEMENTS_SCHEMA` for Web Component wrappers
❌ `primus-rbac-admin` on Angular 16	Depends on `@angular/core` deferred loading APIs only available in Angular 17+

Angular 16 — additional setup

Angular 16 requires CUSTOM_ELEMENTS_SCHEMA to use Primus Web Component wrappers (<primus-tabs>, <primus-dropdown>):

// app.module.ts
import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';

@NgModule({
  schemas: [CUSTOM_ELEMENTS_SCHEMA],
  // ...
})
export class AppModule {}

Upgrading from legacy to current

See the Upgrade Guide for step-by-step migration from primus-angular-ui-legacy to primus-angular-ui.

Package selection​

Component compatibility​

Forms​

Dashboards & Data​

Navigation & Layout​

Authentication​

Workflows​

Banking & Insurance​

Legacy-only components (primus-angular-ui-legacy only)​

Limitation notes​

Angular 16 — additional setup​

Upgrading from legacy to current​