@clr/angular 17.2.1 → 17.3.1

package/forms/checkbox/checkbox.d.ts

@@ -11,7 +11,7 @@ import * as i0 from "@angular/core";
  */
 export declare class ClrCheckbox extends WrappedFormControl<ClrCheckboxWrapper> {
     private toggle;
-    constructor(vcr: ViewContainerRef, injector: Injector, control: NgControl, renderer: Renderer2, el: ElementRef, toggle: string);
+    constructor(vcr: ViewContainerRef, injector: Injector, control: NgControl, renderer: Renderer2, el: ElementRef<HTMLInputElement>, toggle: string);
     ngOnInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<ClrCheckbox, [null, null, { optional: true; self: true; }, null, null, { attribute: "clrToggle"; }]>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<ClrCheckbox, "[clrCheckbox],[clrToggle]", never, {}, {}, never, never, false, never>;

package/forms/combobox/combobox-container.d.ts

@@ -9,8 +9,8 @@ import * as i0 from "@angular/core";
 export declare class ClrComboboxContainer extends ClrAbstractContainer implements AfterContentInit, AfterViewInit {
     private containerService;
     private el;
-    controlContainer: ElementRef;
-    constructor(ifControlStateService: IfControlStateService, layoutService: LayoutService, controlClassService: ControlClassService, ngControlService: NgControlService, containerService: ComboboxContainerService, el: ElementRef);
+    controlContainer: ElementRef<HTMLElement>;
+    constructor(ifControlStateService: IfControlStateService, layoutService: LayoutService, controlClassService: ControlClassService, ngControlService: NgControlService, containerService: ComboboxContainerService, el: ElementRef<HTMLElement>);
     ngAfterContentInit(): void;
     ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<ClrComboboxContainer, [null, { optional: true; }, null, null, null, null]>;

package/forms/combobox/combobox.d.ts

@@ -19,7 +19,7 @@ import * as i1 from "../../utils/popover/popover-host.directive";
 export declare class ClrCombobox<T> extends WrappedFormControl<ClrComboboxContainer> implements ControlValueAccessor, LoadingListener, AfterContentInit {
     control: NgControl;
     protected renderer: Renderer2;
-    protected el: ElementRef;
+    protected el: ElementRef<HTMLElement>;
     optionSelectionService: OptionSelectionService<T>;
     commonStrings: ClrCommonStringsService;
     private toggleService;
@@ -36,8 +36,8 @@ export declare class ClrCombobox<T> extends WrappedFormControl<ClrComboboxContai
      * This output should be used to set up a live region using aria-live and populate it with updates that reflect each combobox change.
      */
     clrSelectionChange: import("rxjs").Observable<ComboboxModel<T>>;
-    textbox: ElementRef;
-    trigger: ElementRef;
+    textbox: ElementRef<HTMLInputElement>;
+    trigger: ElementRef<HTMLButtonElement>;
     optionSelected: ClrOptionSelected<T>;
     invalid: boolean;
     focused: boolean;
@@ -48,7 +48,7 @@ export declare class ClrCombobox<T> extends WrappedFormControl<ClrComboboxContai
     private _searchText;
     private onTouchedCallback;
     private onChangeCallback;
-    constructor(vcr: ViewContainerRef, injector: Injector, control: NgControl, renderer: Renderer2, el: ElementRef, optionSelectionService: OptionSelectionService<T>, commonStrings: ClrCommonStringsService, toggleService: ClrPopoverToggleService, positionService: ClrPopoverPositionService, controlStateService: IfControlStateService, containerService: ComboboxContainerService, platformId: any, focusHandler: ComboboxFocusHandler<T>, cdr: ChangeDetectorRef);
+    constructor(vcr: ViewContainerRef, injector: Injector, control: NgControl, renderer: Renderer2, el: ElementRef<HTMLElement>, optionSelectionService: OptionSelectionService<T>, commonStrings: ClrCommonStringsService, toggleService: ClrPopoverToggleService, positionService: ClrPopoverPositionService, controlStateService: IfControlStateService, containerService: ComboboxContainerService, platformId: any, focusHandler: ComboboxFocusHandler<T>, cdr: ChangeDetectorRef);
     get multiSelect(): boolean | string;
     set multiSelect(value: boolean | string);
     get id(): string;

package/forms/combobox/option-items.directive.d.ts

@@ -8,7 +8,6 @@ export declare class ClrOptionItems<T> implements DoCheck, OnDestroy {
     private differs;
     private optionService;
     private positionService;
-    private vcr;
     private iterableProxy;
     private _rawItems;
     private filteredItems;

package/forms/combobox/option.d.ts

@@ -4,14 +4,14 @@ import { ComboboxFocusHandler, OptionData as OptionProxy } from './providers/com
 import { OptionSelectionService } from './providers/option-selection.service';
 import * as i0 from "@angular/core";
 export declare class ClrOption<T> implements OnInit {
-    elRef: ElementRef;
+    elRef: ElementRef<HTMLElement>;
     commonStrings: ClrCommonStringsService;
     private focusHandler;
     private optionSelectionService;
     optionProxy: OptionProxy<T>;
     private _id;
     private _value;
-    constructor(elRef: ElementRef, commonStrings: ClrCommonStringsService, focusHandler: ComboboxFocusHandler<T>, optionSelectionService: OptionSelectionService<T>);
+    constructor(elRef: ElementRef<HTMLElement>, commonStrings: ClrCommonStringsService, focusHandler: ComboboxFocusHandler<T>, optionSelectionService: OptionSelectionService<T>);
     get optionId(): string;
     set optionId(id: string);
     get value(): T;
@@ -19,7 +19,7 @@ export declare class ClrOption<T> implements OnInit {
     get selected(): boolean;
     get focusClass(): boolean;
     ngOnInit(): void;
-    onClick(): void;
+    onClick(event: MouseEvent): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<ClrOption<any>, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<ClrOption<any>, "clr-option", never, { "optionId": "id"; "value": "clrValue"; }, {}, never, ["*"], false, never>;
 }

package/forms/combobox/options.d.ts

@@ -19,7 +19,7 @@ export declare class ClrOptions<T> implements AfterViewInit, LoadingListener, On
     loading: boolean;
     _items: QueryList<ClrOption<T>>;
     private subscriptions;
-    constructor(optionSelectionService: OptionSelectionService<T>, id: number, el: ElementRef, commonStrings: ClrCommonStringsService, focusHandler: ComboboxFocusHandler<T>, toggleService: ClrPopoverToggleService, parentHost: ElementRef, document: any);
+    constructor(optionSelectionService: OptionSelectionService<T>, id: number, el: ElementRef<HTMLElement>, commonStrings: ClrCommonStringsService, focusHandler: ComboboxFocusHandler<T>, toggleService: ClrPopoverToggleService, parentHost: ElementRef<HTMLElement>, document: any);
     get items(): QueryList<ClrOption<T>>;
     set items(items: QueryList<ClrOption<T>>);
     /**

package/forms/combobox/providers/combobox-focus-handler.service.d.ts

@@ -41,8 +41,8 @@ export declare const COMBOBOX_FOCUS_HANDLER_PROVIDER: (import("@angular/core").T
 })[];
 export declare class OptionData<T> {
     id: string;
-    el: HTMLElement;
     value: T;
+    el: HTMLElement;
     constructor(id: string, value: T);
     equals(other: OptionData<T>): boolean;
 }

package/forms/common/control.d.ts

@@ -5,7 +5,7 @@ import { WrappedFormControl } from './wrapped-control';
 import * as i0 from "@angular/core";
 export declare class ClrControl extends WrappedFormControl<ClrControlContainer> {
     protected index: number;
-    constructor(vcr: ViewContainerRef, injector: Injector, control: NgControl, renderer: Renderer2, el: ElementRef);
+    constructor(vcr: ViewContainerRef, injector: Injector, control: NgControl, renderer: Renderer2, el: ElementRef<HTMLElement>);
     static ɵfac: i0.ɵɵFactoryDeclaration<ClrControl, [null, null, { optional: true; self: true; }, null, null]>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<ClrControl, "[clrControl]", never, {}, {}, never, never, false, never>;
 }

package/forms/common/if-control-state/if-control-state.service.d.ts

@@ -8,7 +8,6 @@ export declare enum CONTROL_STATE {
     INVALID = "INVALID"
 }
 export declare class IfControlStateService implements OnDestroy {
-    private ngControlService;
     private subscriptions;
     private control;
     private _statusChanges;

package/forms/common/label.d.ts

@@ -12,7 +12,7 @@ export declare class ClrLabel implements OnInit, OnDestroy {
     forAttr: string;
     private enableGrid;
     private subscriptions;
-    constructor(controlIdService: ControlIdService, layoutService: LayoutService, ngControlService: NgControlService, renderer: Renderer2, el: ElementRef);
+    constructor(controlIdService: ControlIdService, layoutService: LayoutService, ngControlService: NgControlService, renderer: Renderer2, el: ElementRef<HTMLLabelElement>);
     get labelText(): string;
     ngOnInit(): void;
     ngOnDestroy(): void;

package/forms/common/wrapped-control.d.ts

@@ -13,11 +13,11 @@ export declare class WrappedFormControl<W extends DynamicWrapper> implements OnI
     protected vcr: ViewContainerRef;
     protected wrapperType: Type<W>;
     private ngControl;
-    _id: string;
     protected renderer: Renderer2;
+    protected el: ElementRef<HTMLElement>;
+    _id: string;
     protected controlIdService: ControlIdService;
     protected ngControlService: NgControlService;
-    protected el: ElementRef<any>;
     protected index: number;
     protected subscriptions: Subscription[];
     private ifControlStateService;
@@ -27,7 +27,7 @@ export declare class WrappedFormControl<W extends DynamicWrapper> implements OnI
     private _containerInjector;
     private differs;
     private differ;
-    constructor(vcr: ViewContainerRef, wrapperType: Type<W>, injector: Injector, ngControl: NgControl | null, renderer: Renderer2, el: ElementRef);
+    constructor(vcr: ViewContainerRef, wrapperType: Type<W>, injector: Injector, ngControl: NgControl | null, renderer: Renderer2, el: ElementRef<HTMLElement>);
     get id(): string;
     set id(value: string);
     ngOnInit(): void;

package/forms/datalist/datalist-container.d.ts

@@ -6,7 +6,6 @@ import { LayoutService } from '../common/providers/layout.service';
 import { NgControlService } from '../common/providers/ng-control.service';
 import * as i0 from "@angular/core";
 export declare class ClrDatalistContainer extends ClrAbstractContainer {
-    private focusService;
     protected ifControlStateService: IfControlStateService;
     focus: boolean;
     constructor(controlClassService: ControlClassService, layoutService: LayoutService, ngControlService: NgControlService, focusService: FocusService, ifControlStateService: IfControlStateService);

package/forms/datalist/datalist-input.d.ts

@@ -9,7 +9,7 @@ export declare class ClrDatalistInput extends WrappedFormControl<ClrDatalistCont
     private focusService;
     private datalistIdService;
     listValue: string;
-    constructor(focusService: FocusService, vcr: ViewContainerRef, injector: Injector, control: NgControl, renderer: Renderer2, el: ElementRef, datalistIdService: DatalistIdService);
+    constructor(focusService: FocusService, vcr: ViewContainerRef, injector: Injector, control: NgControl, renderer: Renderer2, el: ElementRef<HTMLInputElement>, datalistIdService: DatalistIdService);
     ngAfterContentInit(): void;
     triggerFocus(): void;
     triggerValidation(): void;

package/forms/datepicker/calendar.d.ts

@@ -19,7 +19,7 @@ export declare class ClrCalendar implements OnDestroy {
      */
     calendarViewModel: CalendarViewModel;
     private _subs;
-    constructor(_localeHelperService: LocaleHelperService, _dateNavigationService: DateNavigationService, _datepickerFocusService: DatepickerFocusService, _dateIOService: DateIOService, _elRef: ElementRef);
+    constructor(_localeHelperService: LocaleHelperService, _dateNavigationService: DateNavigationService, _datepickerFocusService: DatepickerFocusService, _dateIOService: DateIOService, _elRef: ElementRef<HTMLElement>);
     /**
      * Gets the locale days according to the TranslationWidth.Narrow format.
      */

package/forms/datepicker/date-container.d.ts

@@ -23,7 +23,6 @@ export declare class ClrDateContainer extends ClrAbstractContainer implements Af
     private dateFormControlService;
     private dateIOService;
     commonStrings: ClrCommonStringsService;
-    private focusService;
     private viewManagerService;
     protected controlClassService: ControlClassService;
     protected layoutService: LayoutService;
@@ -33,7 +32,7 @@ export declare class ClrDateContainer extends ClrAbstractContainer implements Af
     private toggleButton;
     constructor(renderer: Renderer2, toggleService: ClrPopoverToggleService, dateNavigationService: DateNavigationService, datepickerEnabledService: DatepickerEnabledService, dateFormControlService: DateFormControlService, dateIOService: DateIOService, commonStrings: ClrCommonStringsService, focusService: FocusService, viewManagerService: ViewManagerService, controlClassService: ControlClassService, layoutService: LayoutService, ngControlService: NgControlService, ifControlStateService: IfControlStateService);
     set clrPosition(position: string);
-    set actionButton(button: ElementRef);
+    set actionButton(button: ElementRef<HTMLButtonElement>);
     get popoverPosition(): ClrPopoverPosition;
     get open(): boolean;
     /**

package/forms/datepicker/date-input.d.ts

@@ -10,7 +10,7 @@ import { DatepickerEnabledService } from './providers/datepicker-enabled.service
 import { DatepickerFocusService } from './providers/datepicker-focus.service';
 import * as i0 from "@angular/core";
 export declare class ClrDateInput extends WrappedFormControl<ClrDateContainer> implements OnInit, AfterViewInit, OnDestroy {
-    protected el: ElementRef;
+    protected el: ElementRef<HTMLInputElement>;
     protected renderer: Renderer2;
     protected control: NgControl;
     private container;
@@ -27,7 +27,7 @@ export declare class ClrDateInput extends WrappedFormControl<ClrDateContainer> i
     protected index: number;
     private initialClrDateInputValue;
     private previousDateChange;
-    constructor(viewContainerRef: ViewContainerRef, injector: Injector, el: ElementRef, renderer: Renderer2, control: NgControl, container: ClrDateContainer, dateIOService: DateIOService, dateNavigationService: DateNavigationService, datepickerEnabledService: DatepickerEnabledService, dateFormControlService: DateFormControlService, platformId: any, focusService: FocusService, datepickerFocusService: DatepickerFocusService);
+    constructor(viewContainerRef: ViewContainerRef, injector: Injector, el: ElementRef<HTMLInputElement>, renderer: Renderer2, control: NgControl, container: ClrDateContainer, dateIOService: DateIOService, dateNavigationService: DateNavigationService, datepickerEnabledService: DatepickerEnabledService, dateFormControlService: DateFormControlService, platformId: any, focusService: FocusService, datepickerFocusService: DatepickerFocusService);
     set date(date: Date | string);
     set min(dateString: string);
     set max(dateString: string);

package/forms/datepicker/monthpicker.d.ts

@@ -14,7 +14,7 @@ export declare class ClrMonthpicker implements AfterViewInit {
      * Keeps track of the current focused month.
      */
     private _focusedMonthIndex;
-    constructor(_viewManagerService: ViewManagerService, _localeHelperService: LocaleHelperService, _dateNavigationService: DateNavigationService, _datepickerFocusService: DatepickerFocusService, _elRef: ElementRef);
+    constructor(_viewManagerService: ViewManagerService, _localeHelperService: LocaleHelperService, _dateNavigationService: DateNavigationService, _datepickerFocusService: DatepickerFocusService, _elRef: ElementRef<HTMLElement>);
     /**
      * Gets the months array which is used to rendered the monthpicker view.
      * Months are in the TranslationWidth.Wide format.

package/forms/datepicker/providers/date-io.service.d.ts

@@ -2,12 +2,11 @@ import { DateRange } from '../interfaces/date-range.interface';
 import { LocaleHelperService } from './locale-helper.service';
 import * as i0 from "@angular/core";
 export declare class DateIOService {
-    private _localeHelperService;
     disabledDates: DateRange;
     cldrLocaleDateFormat: string;
     private localeDisplayFormat;
     private delimiters;
-    constructor(_localeHelperService: LocaleHelperService);
+    constructor(localeHelperService: LocaleHelperService);
     get placeholderText(): string;
     setMinDate(date: string): void;
     setMaxDate(date: string): void;

package/forms/datepicker/providers/datepicker-focus.service.d.ts

@@ -7,7 +7,7 @@ export declare class DatepickerFocusService {
     private _ngZone;
     private platformId;
     constructor(_ngZone: NgZone, platformId: any);
-    focusCell(elRef: ElementRef): void;
+    focusCell(elRef: ElementRef<HTMLElement>): void;
     focusInput(element: HTMLInputElement): void;
     elementIsFocused(element: HTMLInputElement): boolean;
     private ngZoneIsStableInBrowser;

package/forms/datepicker/yearpicker.d.ts

@@ -19,7 +19,7 @@ export declare class ClrYearpicker implements AfterViewInit {
      * Keeps track of the current focused year.
      */
     private _focusedYear;
-    constructor(_dateNavigationService: DateNavigationService, _viewManagerService: ViewManagerService, _datepickerFocusService: DatepickerFocusService, _elRef: ElementRef, commonStrings: ClrCommonStringsService);
+    constructor(_dateNavigationService: DateNavigationService, _viewManagerService: ViewManagerService, _datepickerFocusService: DatepickerFocusService, _elRef: ElementRef<HTMLElement>, commonStrings: ClrCommonStringsService);
     /**
      * Gets the year which the user is currently on.
      */

package/forms/input/input.d.ts

@@ -5,7 +5,7 @@ import { ClrInputContainer } from './input-container';
 import * as i0 from "@angular/core";
 export declare class ClrInput extends WrappedFormControl<ClrInputContainer> {
     protected index: number;
-    constructor(vcr: ViewContainerRef, injector: Injector, control: NgControl, renderer: Renderer2, el: ElementRef);
+    constructor(vcr: ViewContainerRef, injector: Injector, control: NgControl, renderer: Renderer2, el: ElementRef<HTMLInputElement>);
     static ɵfac: i0.ɵɵFactoryDeclaration<ClrInput, [null, null, { optional: true; self: true; }, null, null]>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<ClrInput, "[clrInput]", never, {}, {}, never, never, false, never>;
 }

package/forms/password/password.d.ts

@@ -7,9 +7,8 @@ import { ClrPasswordContainer } from './password-container';
 import * as i0 from "@angular/core";
 export declare class ClrPassword extends WrappedFormControl<ClrPasswordContainer> implements OnInit, OnDestroy {
     private focusService;
-    private toggleService;
     protected index: number;
-    constructor(vcr: ViewContainerRef, injector: Injector, control: NgControl, renderer: Renderer2, el: ElementRef, focusService: FocusService, toggleService: BehaviorSubject<boolean>);
+    constructor(vcr: ViewContainerRef, injector: Injector, control: NgControl, renderer: Renderer2, el: ElementRef<HTMLInputElement>, focusService: FocusService, toggleService: BehaviorSubject<boolean>);
     triggerFocus(): void;
     triggerValidation(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<ClrPassword, [null, null, { optional: true; self: true; }, null, null, { optional: true; }, { optional: true; }]>;

package/forms/radio/radio.d.ts

@@ -4,7 +4,7 @@ import { WrappedFormControl } from '../common/wrapped-control';
 import { ClrRadioWrapper } from '../radio/radio-wrapper';
 import * as i0 from "@angular/core";
 export declare class ClrRadio extends WrappedFormControl<ClrRadioWrapper> {
-    constructor(vcr: ViewContainerRef, injector: Injector, control: NgControl, renderer: Renderer2, el: ElementRef);
+    constructor(vcr: ViewContainerRef, injector: Injector, control: NgControl, renderer: Renderer2, el: ElementRef<HTMLInputElement>);
     static ɵfac: i0.ɵɵFactoryDeclaration<ClrRadio, [null, null, { optional: true; self: true; }, null, null]>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<ClrRadio, "[clrRadio]", never, {}, {}, never, never, false, never>;
 }

package/forms/range/range.d.ts

@@ -4,7 +4,7 @@ import { WrappedFormControl } from '../common/wrapped-control';
 import { ClrRangeContainer } from './range-container';
 import * as i0 from "@angular/core";
 export declare class ClrRange extends WrappedFormControl<ClrRangeContainer> {
-    constructor(vcr: ViewContainerRef, injector: Injector, control: NgControl, renderer: Renderer2, el: ElementRef);
+    constructor(vcr: ViewContainerRef, injector: Injector, control: NgControl, renderer: Renderer2, el: ElementRef<HTMLInputElement>);
     static ɵfac: i0.ɵɵFactoryDeclaration<ClrRange, [null, null, { optional: true; self: true; }, null, null]>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<ClrRange, "[clrRange]", never, {}, {}, never, never, false, never>;
 }

package/forms/select/select.d.ts

@@ -5,7 +5,7 @@ import { ClrSelectContainer } from './select-container';
 import * as i0 from "@angular/core";
 export declare class ClrSelect extends WrappedFormControl<ClrSelectContainer> {
     protected index: number;
-    constructor(vcr: ViewContainerRef, injector: Injector, control: NgControl, renderer: Renderer2, el: ElementRef);
+    constructor(vcr: ViewContainerRef, injector: Injector, control: NgControl, renderer: Renderer2, el: ElementRef<HTMLSelectElement>);
     static ɵfac: i0.ɵɵFactoryDeclaration<ClrSelect, [null, null, { optional: true; self: true; }, null, null]>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<ClrSelect, "[clrSelect]", never, {}, {}, never, never, false, never>;
 }

package/forms/textarea/textarea.d.ts

@@ -5,7 +5,7 @@ import { ClrTextareaContainer } from './textarea-container';
 import * as i0 from "@angular/core";
 export declare class ClrTextarea extends WrappedFormControl<ClrTextareaContainer> {
     protected index: number;
-    constructor(vcr: ViewContainerRef, injector: Injector, control: NgControl, renderer: Renderer2, el: ElementRef);
+    constructor(vcr: ViewContainerRef, injector: Injector, control: NgControl, renderer: Renderer2, el: ElementRef<HTMLTextAreaElement>);
     static ɵfac: i0.ɵɵFactoryDeclaration<ClrTextarea, [null, null, { optional: true; self: true; }, null, null]>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<ClrTextarea, "[clrTextarea]", never, {}, {}, never, never, false, never>;
 }

package/layout/main-container/main-container.d.ts

@@ -7,7 +7,7 @@ export declare class ClrMainContainer implements OnDestroy, OnInit {
     private responsiveNavService;
     private _subscription;
     private _classList;
-    constructor(elRef: ElementRef, responsiveNavService: ResponsiveNavigationService);
+    constructor(elRef: ElementRef<HTMLElement>, responsiveNavService: ResponsiveNavigationService);
     ngOnInit(): void;
     processMessage(message: ResponsiveNavControlMessage): void;
     controlNav(controlCode: string, navClass: string): void;

package/layout/nav/nav-level.d.ts

@@ -2,7 +2,6 @@ import { ElementRef, Injector, OnInit, Renderer2 } from '@angular/core';
 import { ClrStandaloneCdkTrapFocus } from '../../utils/focus/focus-trap';
 import { ResponsiveNavigationService } from './providers/responsive-navigation.service';
 import { ResponsiveNavCodes } from './responsive-nav-codes';
-import '@cds/core/internal-components/close-button/register.js';
 import * as i0 from "@angular/core";
 import * as i1 from "../../utils/focus/focus-trap/standalone-cdk-trap-focus.directive";
 export declare class ClrNavLevel implements OnInit {

package/layout/tabs/tab-link.directive.d.ts

@@ -6,15 +6,13 @@ import * as i0 from "@angular/core";
 export declare class ClrTabLink {
     ifActiveService: IfActiveService;
     readonly id: number;
-    el: ElementRef;
-    private cfr;
-    private viewContainerRef;
+    el: ElementRef<HTMLElement>;
     private tabsService;
     tabsId: number;
     tabLinkId: string;
     templateRefContainer: TemplateRefContainer;
     private _inOverflow;
-    constructor(ifActiveService: IfActiveService, id: number, el: ElementRef, cfr: ComponentFactoryResolver, viewContainerRef: ViewContainerRef, tabsService: TabsService, tabsId: number);
+    constructor(ifActiveService: IfActiveService, id: number, el: ElementRef<HTMLElement>, cfr: ComponentFactoryResolver, viewContainerRef: ViewContainerRef, tabsService: TabsService, tabsId: number);
     get inOverflow(): boolean;
     set inOverflow(inOverflow: boolean);
     get addLinkClasses(): boolean;

package/layout/tabs/tabs.d.ts

@@ -29,7 +29,7 @@ export declare class ClrTabs implements AfterContentInit, OnDestroy {
     get activeTabPosition(): number;
     get isCurrentInOverflow(): boolean;
     get isVertical(): boolean;
-    set tabOverflowEl(value: ElementRef);
+    set tabOverflowEl(value: ElementRef<HTMLElement>);
     private get overflowPosition();
     private set tabContentViewContainer(value);
     ngAfterContentInit(): void;

package/layout/vertical-nav/vertical-nav-group.d.ts

@@ -9,14 +9,13 @@ import * as i0 from "@angular/core";
 export declare class ClrVerticalNavGroup implements AfterContentInit, OnDestroy {
     private _itemExpand;
     private _navGroupRegistrationService;
-    private _navGroupService;
     private _navService;
     commonStrings: ClrCommonStringsService;
     expandedChange: EventEmitter<boolean>;
     private wasExpanded;
     private _subscriptions;
     private _expandAnimationState;
-    constructor(_itemExpand: IfExpandService, _navGroupRegistrationService: VerticalNavGroupRegistrationService, _navGroupService: VerticalNavGroupService, _navService: VerticalNavService, commonStrings: ClrCommonStringsService);
+    constructor(_itemExpand: IfExpandService, _navGroupRegistrationService: VerticalNavGroupRegistrationService, navGroupService: VerticalNavGroupService, _navService: VerticalNavService, commonStrings: ClrCommonStringsService);
     get expanded(): boolean;
     set expanded(value: boolean);
     set userExpandedInput(value: boolean | string);

package/modal/index.d.ts

@@ -1,5 +1,6 @@
 export * from './modal';
 export * from './modal.module';
+export * from './modal-configuration.service';
 export * from './side-panel.module';
 export * from './modal-body';
 export * from './side-panel';

package/modal/modal.d.ts

@@ -1,5 +1,5 @@
 import { AnimationEvent } from '@angular/animations';
-import { EventEmitter, OnChanges, OnDestroy, SimpleChange } from '@angular/core';
+import { ElementRef, EventEmitter, OnChanges, OnDestroy, SimpleChange } from '@angular/core';
 import { ClrCommonStringsService } from '../utils/i18n/common-strings.service';
 import { ScrollingService } from '../utils/scrolling/scrolling-service';
 import { ClrModalConfigurationService } from './modal-configuration.service';
@@ -11,6 +11,7 @@ export declare class ClrModal implements OnChanges, OnDestroy {
     private modalStackService;
     private configuration;
     modalId: string;
+    title: ElementRef<HTMLElement>;
     _open: boolean;
     _openChanged: EventEmitter<boolean>;
     closable: boolean;
@@ -31,6 +32,7 @@ export declare class ClrModal implements OnChanges, OnDestroy {
     }): void;
     ngOnDestroy(): void;
     open(): void;
+    backdropClick(): void;
     close(): void;
     fadeDone(e: AnimationEvent): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<ClrModal, never>;

package/modal/side-panel.d.ts

@@ -14,7 +14,7 @@ export declare class ClrSidePanel implements OnInit {
     preventClose: boolean;
     altClose: EventEmitter<boolean>;
     private modal;
-    constructor(element: ElementRef, configuration: ClrModalConfigurationService);
+    constructor(element: ElementRef<HTMLElement>, configuration: ClrModalConfigurationService);
     get clrSidePanelBackdrop(): boolean;
     set clrSidePanelBackdrop(backdrop: boolean);
     ngOnInit(): void;

package/package.json

@@ -18,11 +18,11 @@
     "url": "https://github.com/vmware-clarity/ng-clarity/issues"
   },
   "peerDependencies": {
-    "@angular/cdk": "15 || 16 || 17",
-    "@angular/common": "15 || 16 || 17",
-    "@angular/core": "15 || 16 || 17",
+    "@angular/cdk": "15 || 16 || 17 || 18",
+    "@angular/common": "15 || 16 || 17 || 18",
+    "@angular/core": "15 || 16 || 17 || 18",
     "@cds/core": ">= 6.9.2",
-    "@clr/ui": "17.2.1"
+    "@clr/ui": "17.3.1"
   },
   "module": "fesm2015/clr-angular.mjs",
   "es2020": "fesm2020/clr-angular.mjs",
@@ -47,5 +47,5 @@
   "dependencies": {
     "tslib": "^2.3.0"
   },
-  "version": "17.2.1"
+  "version": "17.3.1"
 }

package/popover/common/abstract-popover.d.ts

@@ -4,9 +4,9 @@ import { Point } from './popover';
 import { PopoverOptions } from './popover-options.interface';
 import * as i0 from "@angular/core";
 export declare abstract class AbstractPopover implements AfterViewChecked, OnDestroy {
-    protected parentHost: ElementRef;
+    protected parentHost: ElementRef<HTMLElement>;
     closeOnOutsideClick: boolean;
-    protected el: ElementRef;
+    protected el: ElementRef<HTMLElement>;
     protected toggleService: ClrPopoverToggleService;
     protected renderer: Renderer2;
     protected ngZone: NgZone;
@@ -20,7 +20,7 @@ export declare abstract class AbstractPopover implements AfterViewChecked, OnDes
     private popoverInstance;
     private subscription;
     private documentESCListener;
-    constructor(injector: Injector, parentHost: ElementRef);
+    constructor(injector: Injector, parentHost: ElementRef<HTMLElement>);
     get isOffScreen(): boolean;
     ngAfterViewChecked(): void;
     ngOnDestroy(): void;

package/popover/dropdown/dropdown.d.ts

@@ -8,7 +8,6 @@ export declare class ClrDropdown implements OnDestroy {
     parent: ClrDropdown;
     toggleService: ClrPopoverToggleService;
     focusHandler: DropdownFocusHandler;
-    private cdr;
     isMenuClosable: boolean;
     private subscriptions;
     constructor(parent: ClrDropdown, toggleService: ClrPopoverToggleService, focusHandler: DropdownFocusHandler, cdr: ChangeDetectorRef, dropdownService: RootDropdownService);

package/popover/signpost/signpost-content.d.ts

@@ -6,13 +6,12 @@ import { SignpostIdService } from './providers/signpost-id.service';
 import * as i0 from "@angular/core";
 export declare class ClrSignpostContent extends AbstractPopover implements OnDestroy {
     commonStrings: ClrCommonStringsService;
-    private signpostIdService;
     private signpostFocusManager;
     private platformId;
     signpostContentId: string;
     private document;
     private _position;
-    constructor(injector: Injector, parentHost: ElementRef, commonStrings: ClrCommonStringsService, signpostIdService: SignpostIdService, signpostFocusManager: SignpostFocusManager, platformId: any, document: any);
+    constructor(injector: Injector, parentHost: ElementRef<HTMLElement>, commonStrings: ClrCommonStringsService, signpostIdService: SignpostIdService, signpostFocusManager: SignpostFocusManager, platformId: any, document: any);
     /*********
      *
      * @description

package/popover/signpost/signpost-trigger.d.ts

@@ -14,7 +14,7 @@ export declare class ClrSignpostTrigger implements OnDestroy {
     isOpen: boolean;
     private document;
     private subscriptions;
-    constructor(toggleService: ClrPopoverToggleService, el: ElementRef, signpostIdService: SignpostIdService, signpostFocusManager: SignpostFocusManager, document: any, platformId: any);
+    constructor(toggleService: ClrPopoverToggleService, el: ElementRef<HTMLElement>, signpostIdService: SignpostIdService, signpostFocusManager: SignpostFocusManager, document: any, platformId: any);
     ngOnInit(): void;
     ngOnDestroy(): void;
     /**********

package/popover/tooltip/tooltip-content.d.ts

@@ -9,7 +9,7 @@ export declare class ClrTooltipContent extends AbstractPopover implements OnInit
     private _id;
     private _position;
     private _size;
-    constructor(injector: Injector, parentHost: ElementRef, tooltipIdService: TooltipIdService, tooltipMouseService: TooltipMouseService);
+    constructor(injector: Injector, parentHost: ElementRef<HTMLElement>, tooltipIdService: TooltipIdService, tooltipMouseService: TooltipMouseService);
     get id(): string;
     set id(value: string);
     get position(): string;

package/popover/tooltip/tooltip-trigger.d.ts

@@ -4,7 +4,6 @@ import { TooltipMouseService } from './providers/tooltip-mouse.service';
 import * as i0 from "@angular/core";
 export declare class ClrTooltipTrigger {
     private toggleService;
-    private tooltipIdService;
     private tooltipMouseService;
     ariaDescribedBy: string;
     private subs;

package/src/utils/popover/README.md

@@ -41,7 +41,7 @@ This is what it looks like from the implementing component perspective:
   <header class="header-4" role="heading">
     Header
     <button role="button" class="btn btn-link" clrPopoverCloseButton>
-      <cds-icon shape="window-close" size="36" class="is-inverse"></cds-icon>
+      <cds-icon shape="window-close" size="36"></cds-icon>
     </button>
   </header>
   <section role="region">

package/timeline/timeline-step.d.ts

@@ -6,7 +6,7 @@ export declare class ClrTimelineStep {
     private iconAttributeService;
     private platformId;
     state: ClrTimelineStepState;
-    stepTitle: ElementRef;
+    stepTitle: ElementRef<HTMLElement>;
     stepTitleText: string;
     constructor(iconAttributeService: TimelineIconAttributeService, platformId: any);
     get iconAriaLabel(): string;

package/utils/animations/expandable-animation/expandable-animation.d.ts

@@ -8,7 +8,7 @@ export declare class ClrExpandableAnimation {
     private renderer;
     clrExpandTrigger: boolean;
     startHeight: number;
-    constructor(element: ElementRef, domAdapter: DomAdapter, renderer: Renderer2);
+    constructor(element: ElementRef<HTMLElement>, domAdapter: DomAdapter, renderer: Renderer2);
     get expandAnimation(): {
         value: boolean;
         params: {

package/utils/cdk/cdk-drag.module.d.ts

@@ -11,7 +11,7 @@ export declare class CdkDragModule_CdkDrag extends CdkDrag {
      * as a workaround to fix Angular "ɵɵinvalidFactoryDep" error after upgrading storybook
      * https://github.com/storybookjs/storybook/issues/23534
      */
-    constructor(elementRef: ElementRef, dropContainer: any, document: any, ngZone: NgZone, viewContainerRef: ViewContainerRef, config: DragDropConfig, dir: Directionality, dragDrop: DragDrop, changeDetectorRef: ChangeDetectorRef);
+    constructor(elementRef: ElementRef<HTMLElement>, dropContainer: any, document: any, ngZone: NgZone, viewContainerRef: ViewContainerRef, config: DragDropConfig, dir: Directionality, dragDrop: DragDrop, changeDetectorRef: ChangeDetectorRef);
     static ɵfac: i0.ɵɵFactoryDeclaration<CdkDragModule_CdkDrag, [null, { optional: true; }, { optional: true; }, null, null, { optional: true; }, null, null, null]>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<CdkDragModule_CdkDrag, "[cdkDrag]", never, {}, {}, never, never, false, never>;
 }

package/utils/cdk/cdk-trap-focus.module.d.ts

@@ -10,7 +10,7 @@ export declare class CdkTrapFocusModule_CdkTrapFocus extends CdkTrapFocus {
      * as a workaround to fix Angular "ɵɵinvalidFactoryDep" error after upgrading storybook
      * https://github.com/storybookjs/storybook/issues/23534
      */
-    constructor(elementRef: ElementRef, focusTrapFactory: FocusTrapFactory, document: any);
+    constructor(elementRef: ElementRef<HTMLElement>, focusTrapFactory: FocusTrapFactory, document: any);
     static ɵfac: i0.ɵɵFactoryDeclaration<CdkTrapFocusModule_CdkTrapFocus, [null, null, { optional: true; }]>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<CdkTrapFocusModule_CdkTrapFocus, "[cdkTrapFocus]", never, {}, {}, never, never, false, never>;
 }

package/utils/conditional/if-expanded.directive.d.ts

@@ -13,7 +13,7 @@ export declare class ClrIfExpanded implements OnInit, OnDestroy {
      * Subscriptions to all the services and queries changes
      */
     private _subscriptions;
-    constructor(template: TemplateRef<any>, container: ViewContainerRef, el: ElementRef, renderer: Renderer2, expand: IfExpandService);
+    constructor(template: TemplateRef<any>, container: ViewContainerRef, el: ElementRef<HTMLElement>, renderer: Renderer2, expand: IfExpandService);
     get expanded(): boolean | string;
     set expanded(value: boolean | string);
     ngOnInit(): void;