CoreUI PRO for Angular v5.7.25 - Declarative Nav Groups and Enclosed Nav Variants

We are pleased to announce the release of CoreUI PRO for Angular v5.7.25. This release adds c-nav-group, c-nav-group-items and c-nav-title, so navigation groups can be written in the template, brings the enclosed and enclosed-pills variants to Nav and Tabs, fixes several Sidebar navigation issues, and removes the library’s dependency on @angular/animations. The library is built for Angular 22.1.4.

Speed up your responsive apps and websites with fully-featured, ready-to-use open-source admin panel templates—free to use and built for efficiency.

Angular

Bootstrap

React.js

Vue.js

How to Update

To update to CoreUI PRO for Angular v5.7.25, run:

ng update @angular/core@22 @angular/cli@22 @coreui/coreui-pro@~5.27.0 @coreui/angular-pro@~5.7.25

• Please ensure that there are no error messages in the results.
• Download the latest PRO packages from CoreUI Downloads.

What’s New

Declarative Nav Groups

The new c-nav-group, c-nav-group-items and c-nav-title components let you write a navigation group in the template, instead of only feeding it to c-sidebar-nav as data through navItems:

<c-sidebar-nav>
  <c-nav-title>Forms</c-nav-title>
  <c-nav-group toggler="Pickers">
    <c-nav-item href="/forms/date-picker">Date Picker</c-nav-item>
    <c-nav-item href="/forms/time-picker">Time Picker</c-nav-item>
  </c-nav-group>
</c-sidebar-nav>

• c-nav-group takes a toggler text or a togglerTemplate, a visible input with a visibleChange output, and compact.
• Groups behave as an accordion per level, and a collapsed group keeps the state of its nested groups.
• Collapsing reuses the cCollapse directive.

Nav and Tabs Improvements

• Enclosed variants: c-nav and c-tabs-list accept variant="enclosed" and variant="enclosed-pills".
• Nav role: c-nav has a new role input that defaults to navigation.
• Nav item link: c-nav-item renders a cNavLink anchor when href is set and forwards active, disabled and tabindex to it; without href it projects its content as before.

Bug Fixes

• Nav Link: The disabled attribute is set only on elements that support it; other elements get aria-disabled and tabindex="-1". An unset numeric binding no longer writes tabindex="NaN", and an active link opens every group above it, so routerLinkActive reveals the current route.
• Sidebar Nav: The group’s nav stays displayed while it collapses, so closing animates instead of snapping shut.
• Sidebar Nav: .nav-item is a block again, restoring its top margin.

Improvements

• Sidebar Nav: Groups collapse with cCollapse and CSS transitions instead of @angular/animations.
• Sidebar: c-sidebar, c-sidebar-nav and its groups and links no longer set ChangeDetectionStrategy.Eager, so they use Angular 22’s default OnPush change detection.
• Dependencies: @angular/animations is no longer used by the library. It was removed from the peer dependencies and from the packages the ng add schematic installs.

Dependency Updates

We have updated key dependencies to their latest compatible versions for CoreUI PRO for Angular v5.7.25:

Angular Core Updates

• @angular/animations removed - no longer a dependency or peer dependency of the library

Development Tools

• typescript-eslint to: 8.69.0

Migration Notes

No breaking changes were announced in the published release notes. After upgrading:

1. Install updated dependencies.
2. Run your test suite and verify the build.
3. CoreUI no longer needs @angular/animations. If nothing else in your application uses Angular animations, you can remove the package and its provideAnimations() / provideAnimationsAsync() setup.
4. c-nav now renders role="navigation" by default. Where your nav plays a different role, set the role input explicitly. Its variant input no longer accepts an empty string.

For the latest package files and update access, visit CoreUI Downloads.