v18.0.0-beta.2
Pre-release18.0.0-beta.2 (2026-03-13)
Bug Fixes
- badge: remove obsolete vertical alignment investigation TODO (#2242) (881fb22)
- datagrid: remove unused render constants and resolve CSS TODOs (#2235) (d2bb999)
- date-picker: resolve TODOs and fix min-attribute test bug (#2250) (7869cc0)
- vertical-nav: active state indicator appearance (#2260) (efa55fd)
- wizard: backdrop click not focusing title (#2209) (3af700e)
Features
- accordion: remove deprecated active-background-color CSS property (#2230) (a4b0f13)
- backport appfx to latest (#2222) (5be26d7)
- combobox: add identity function (#2211) (4d3df89)
- drop IE11 and legacy Edge workarounds (#2228) (6e92967)
- form: remove IE/legacy Edge range input styles (#2253) (9937a48)
- forms: change error and success icons position (#2213) (e4b73dd)
- popover: add point-based origin support for popovers, dropdowns, and signposts (#2267) (2167334)
- stepper: update status icons (#2210) (8bebd7f)
- styles: resolve TODOs in global styles, mixins, typography, and reboot (#2240) (a9c6714)
- wizard: rename currentPageChanged output and remove resolved TODOs (#2249) (c011c6d)
- wizard: rename misnamed CSS custom properties (#2229) (426f159)
BREAKING CHANGES
- popover: The popover system's "anchor" naming has been replaced with "origin" to align with Angular CDK terminology and to correctly describe both element-based and point-based positioning.
ClrPopoverAnchoris nowClrPopoverOrigin(selector[clrPopoverOrigin]).POPOVER_HOST_ANCHORis nowPOPOVER_HOST_ORIGIN.ClrPopoverService.anchorElementRefandanchorPointare merged into a singleoriginproperty typed asFlexibleConnectedPositionStrategyOrigin. UseoriginElementto access asElementRefandoriginPointto access asClrPopoverPoint.focusAnchor()is renamed tofocusOrigin().getAnchorPosition()is renamed togetOriginPosition().
Migration
// Template: directive selector
// Before
<button clrPopoverAnchor>Trigger</button>
// After
<button clrPopoverOrigin>Trigger</button>
// Service: origin property
// Before
popoverService.anchorElementRef = elementRef;
popoverService.anchorPoint = { x: 100, y: 200 };
popoverService.focusAnchor();
// After
popoverService.origin = elementRef;
popoverService.origin = { x: 100, y: 200 };
popoverService.focusOrigin();
// InjectionToken
// Before
{ provide: POPOVER_HOST_ANCHOR, useExisting: ElementRef }
// After
{ provide: POPOVER_HOST_ORIGIN, useExisting: ElementRef }
// Position utility
// Before
getAnchorPosition(key)
// After
getOriginPosition(key)-
accordion:
--clr-accordion-active-background-colorand--clr-collapsible-panel-active-background-colorCSS custom properties have been removed. Use--clr-accordion-header-open-background-coloror--clr-collapsible-panel-header-open-background-colorinstead. -
styles:
[cds-text*='heading']attribute selector has been removed. Consumers should migrate to[cds-text*='headline']which provides identical styling. This selector was deprecated since v7 (CDE-821).$clr-altFontSCSS variable removed (was unused).
<!-- Before -->
<p cds-text="heading">Title</p>
<!-- After -->
<p cds-text="headline">Title</p>- wizard: Wizard CSS custom properties have been renamed. Update any custom theme overrides using the old property names.
| Before | After |
|---|---|
--clr-wizard-stepnav-text--active |
--clr-wizard-stepnav-text-selected |
--clr-wizard-stepnav-item-border-color--active |
--clr-wizard-stepnav-item-complete-border-color |
--clr-wizard-stepnav-active-bgcolor |
--clr-wizard-stepnav-selected-bgcolor |
--clr-wizard-stepnav-link-hover-bg-color |
--clr-wizard-stepnav-hover-bgcolor |
--clr-wizard-stepnav-link-active-bg-color |
--clr-wizard-stepnav-active-bgcolor |
- wizard: The template output
(clrWizardCurrentPageChanged)is now(clrWizardCurrentPageChange). TheWizardNavigationService.currentPageChangedgetter is nowcurrentPageChange. Update all bindings.
<!-- Before -->
<clr-wizard (clrWizardCurrentPageChanged)="onPageChange($event)">
<!-- After -->
<clr-wizard (clrWizardCurrentPageChange)="onPageChange($event)">- IE11/Edge: All IE11 and legacy (pre-Chromium) Edge workarounds have been removed. The following public API symbols are removed from
@clr/angular/utils:
| Removed | Migration |
|---|---|
IEKeys enum |
Use standard KeyboardEvent.key string values |
normalizeKey() function |
Use event.key directly |
$clr-use-custom-properties SCSS variable |
Removed — CSS custom properties are now always emitted |
-
form: The
range-track-styleSCSS mixin has been removed from_mixins.forms.scss. This mixin only targeted::-ms-track,::-ms-thumb, and::-ms-fill-lowerpseudo-elements for pre-Chromium Edge. Remove any@include range-track-style(...)calls from custom SCSS. -
forms: Error and success icons in form controls have been repositioned. This is a visual breaking change — no code migration is needed, but custom CSS overrides targeting icon positioning may need adjustment.