@clr/angular 17.6.0 → 17.7.0

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

@@ -1,17 +1,21 @@
-import { DateRange } from '../interfaces/date-range.interface';
+import { DateRange, DateRangeOption } from '../interfaces/date-range.interface';
 import { LocaleHelperService } from './locale-helper.service';
 import * as i0 from "@angular/core";
 export declare class DateIOService {
     disabledDates: DateRange;
     cldrLocaleDateFormat: string;
+    private dateRangeOptions;
     private localeDisplayFormat;
     private delimiters;
     constructor(localeHelperService: LocaleHelperService);
     get placeholderText(): string;
     setMinDate(date: string): void;
     setMaxDate(date: string): void;
+    setRangeOptions(rangeOptions: DateRangeOption[]): void;
+    getRangeOptions(): any;
     toLocaleDisplayFormatString(date: Date): string;
     getDateValueFromDateString(date: string): Date;
+    private validateDateRangeOptions;
     private initializeLocaleDisplayFormat;
     private extractDelimiters;
     /**

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

@@ -1,4 +1,5 @@
 import { Observable } from 'rxjs';
+import { DateRangeInput } from '../interfaces/date-range.interface';
 import { CalendarModel } from '../model/calendar.model';
 import { DayModel } from '../model/day.model';
 import * as i0 from "@angular/core";
@@ -10,19 +11,28 @@ import * as i0 from "@angular/core";
  */
 export declare class DateNavigationService {
     persistedDate: DayModel;
+    persistedEndDate: DayModel;
     selectedDay: DayModel;
+    selectedEndDay: DayModel;
     focusedDay: DayModel;
+    hoveredDay: DayModel;
+    hoveredMonth: number;
+    hoveredYear: number;
+    isRangePicker: boolean;
     hasActionButtons: boolean;
     private _displayedCalendar;
     private _todaysFullDate;
     private _today;
     private _selectedDayChange;
+    private _selectedEndDayChange;
     private _displayedCalendarChange;
     private _focusOnCalendarChange;
+    private _refreshCalendarView;
     private _focusedDayChange;
     get today(): DayModel;
     get displayedCalendar(): CalendarModel;
     get selectedDayChange(): Observable<DayModel>;
+    get selectedEndDayChange(): Observable<DayModel>;
     /**
      * This observable lets the subscriber know that the displayed calendar has changed.
      */
@@ -35,10 +45,14 @@ export declare class DateNavigationService {
      * This observable lets the subscriber know that the focused day in the displayed calendar has changed.
      */
     get focusedDayChange(): Observable<DayModel>;
+    /**
+     * This observable lets the subscriber know that the displayed calendar has changed.
+     */
+    get refreshCalendarView(): Observable<void>;
     /**
      * Notifies that the selected day has changed so that the date can be emitted to the user.
      */
-    notifySelectedDayChanged(dayModel: DayModel, { emitEvent }?: {
+    notifySelectedDayChanged(dayObject: DayModel | DateRangeInput, { emitEvent }?: {
         emitEvent: boolean;
     }): void;
     /**
@@ -55,12 +69,24 @@ export declare class DateNavigationService {
      * Moves the displayed calendar to the previous month.
      */
     moveToPreviousMonth(): void;
+    /**
+     * Moves the displayed calendar to the next year.
+     */
+    moveToNextYear(): void;
+    /**
+     * Moves the displayed calendar to the previous year.
+     */
+    moveToPreviousYear(): void;
     /**
      * Moves the displayed calendar to the current month and year.
      */
     moveToCurrentMonth(): void;
+    moveToSpecificMonth(day: DayModel): void;
     incrementFocusDay(value: number): void;
     resetSelectedDay(): void;
+    convertDateToDayModel(date: Date): DayModel;
+    private setSelectedDay;
+    private setSelectedEndDay;
     private setDisplayedCalendar;
     private initializeTodaysDate;
     static ɵfac: i0.ɵɵFactoryDeclaration<DateNavigationService, never>;

package/forms/datepicker/yearpicker.d.ts

@@ -20,10 +20,14 @@ export declare class ClrYearpicker implements AfterViewInit {
      */
     private _focusedYear;
     constructor(_dateNavigationService: DateNavigationService, _viewManagerService: ViewManagerService, _datepickerFocusService: DatepickerFocusService, _elRef: ElementRef<HTMLElement>, commonStrings: ClrCommonStringsService);
+    get selectedStartYear(): number;
+    get selectedEndYear(): number;
     /**
      * Gets the year which the user is currently on.
      */
     get calendarYear(): number;
+    getIsRangeStartYear(year: number): boolean;
+    getIsRangeEndYear(year: number): boolean;
     /**
      * Focuses on the current calendar year when the View is initialized.
      */
@@ -37,6 +41,10 @@ export declare class ClrYearpicker implements AfterViewInit {
      * Also changes the view to the daypicker.
      */
     changeYear(year: number): void;
+    /**
+     * Calls the DateNavigationService to update the hovered year value of the calendar
+     */
+    onHover(year: number): void;
     /**
      * Updates the YearRangeModel to the previous decade.
      */
@@ -53,6 +61,12 @@ export declare class ClrYearpicker implements AfterViewInit {
      * Compares the year passed to the focused year and returns the tab index.
      */
     getTabIndex(year: number): number;
+    /**
+     * Applicable only to date range picker
+     * Compares the year passed is in between the start and end date range
+     */
+    isInRange(year: number): boolean;
+    changeToDayView(): void;
     /**
      * Increments the focus year by the value passed. Updates the YearRangeModel if the
      * new value is not in the current decade.

package/forms/radio/radio-wrapper.d.ts

@@ -1,9 +1,7 @@
 import { OnInit } from '@angular/core';
-import { DynamicWrapper } from '../../utils/host-wrapping/dynamic-wrapper';
 import { ClrLabel } from '../common/label';
 import * as i0 from "@angular/core";
-export declare class ClrRadioWrapper implements DynamicWrapper, OnInit {
-    _dynamic: boolean;
+export declare class ClrRadioWrapper implements OnInit {
     label: ClrLabel;
     ngOnInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<ClrRadioWrapper, never>;

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

@@ -9,6 +9,8 @@ export declare class ClrVerticalNav implements OnDestroy {
     private _navIconService;
     private _navGroupRegistrationService;
     commonStrings: ClrCommonStringsService;
+    toggleLabel: string;
+    contentId: string;
     private _collapsedChanged;
     private _sub;
     constructor(_navService: VerticalNavService, _navIconService: VerticalNavIconService, _navGroupRegistrationService: VerticalNavGroupRegistrationService, commonStrings: ClrCommonStringsService);
@@ -22,5 +24,5 @@ export declare class ClrVerticalNav implements OnDestroy {
     ngOnDestroy(): void;
     toggleByButton(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<ClrVerticalNav, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ClrVerticalNav, "clr-vertical-nav", never, { "collapsible": "clrVerticalNavCollapsible"; "collapsed": "clrVerticalNavCollapsed"; }, { "_collapsedChanged": "clrVerticalNavCollapsedChange"; }, never, ["*"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ClrVerticalNav, "clr-vertical-nav", never, { "toggleLabel": "clrVerticalNavToggleLabel"; "collapsible": "clrVerticalNavCollapsible"; "collapsed": "clrVerticalNavCollapsed"; }, { "_collapsedChanged": "clrVerticalNavCollapsedChange"; }, never, ["*"], false, never>;
 }

package/modal/index.d.ts

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

package/modal/modal-host.directive.d.ts

@@ -0,0 +1,5 @@
+import * as i0 from "@angular/core";
+export declare class ClrModalHostDirective {
+    static ɵfac: i0.ɵɵFactoryDeclaration<ClrModalHostDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<ClrModalHostDirective, "[clrModalHost]", never, {}, {}, never, never, false, never>;
+}

package/modal/modal.d.ts

@@ -18,11 +18,12 @@ export declare class ClrModal implements OnChanges, OnDestroy {
     closeButtonAriaLabel: string;
     size: string;
     staticBackdrop: boolean;
-    skipAnimation: string;
+    skipAnimation: boolean;
     stopClose: boolean;
     altClose: EventEmitter<boolean>;
     labelledBy: string;
     bypassScrollService: boolean;
+    private readonly bodyElementRef;
     constructor(_scrollingService: ScrollingService, commonStrings: ClrCommonStringsService, modalStackService: ModalStackService, configuration: ClrModalConfigurationService);
     get fadeMove(): string;
     set fadeMove(move: string);
@@ -35,6 +36,7 @@ export declare class ClrModal implements OnChanges, OnDestroy {
     backdropClick(): void;
     close(): void;
     fadeDone(e: AnimationEvent): void;
+    scrollTop(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<ClrModal, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ClrModal, "clr-modal", never, { "_open": "clrModalOpen"; "closable": "clrModalClosable"; "closeButtonAriaLabel": "clrModalCloseButtonAriaLabel"; "size": "clrModalSize"; "staticBackdrop": "clrModalStaticBackdrop"; "skipAnimation": "clrModalSkipAnimation"; "stopClose": "clrModalPreventClose"; "labelledBy": "clrModalLabelledById"; "bypassScrollService": "clrModalOverrideScrollService"; }, { "_openChanged": "clrModalOpenChange"; "altClose": "clrModalAlternateClose"; }, never, [".modal-nav", ".modal-title", ".modal-body", ".modal-footer"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ClrModal, "clr-modal", never, { "_open": "clrModalOpen"; "closable": "clrModalClosable"; "closeButtonAriaLabel": "clrModalCloseButtonAriaLabel"; "size": "clrModalSize"; "staticBackdrop": "clrModalStaticBackdrop"; "skipAnimation": "clrModalSkipAnimation"; "stopClose": "clrModalPreventClose"; "labelledBy": "clrModalLabelledById"; "bypassScrollService": "clrModalOverrideScrollService"; }, { "_openChanged": "clrModalOpenChange"; "altClose": "clrModalAlternateClose"; }, never, [".modal-nav", ".leading-button", ".modal-title", ".modal-body", ".modal-footer"], false, never>;
 }

package/modal/modal.module.d.ts

@@ -2,13 +2,14 @@ import { Type } from '@angular/core';
 import * as i0 from "@angular/core";
 import * as i1 from "./modal";
 import * as i2 from "./modal-body";
-import * as i3 from "@angular/common";
-import * as i4 from "../utils/cdk/cdk-trap-focus.module";
-import * as i5 from "../icon/icon.module";
+import * as i3 from "./modal-host.directive";
+import * as i4 from "@angular/common";
+import * as i5 from "../utils/cdk/cdk-trap-focus.module";
+import * as i6 from "../icon/icon.module";
 export declare const CLR_MODAL_DIRECTIVES: Type<any>[];
 export declare class ClrModalModule {
     constructor();
     static ɵfac: i0.ɵɵFactoryDeclaration<ClrModalModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<ClrModalModule, [typeof i1.ClrModal, typeof i2.ClrModalBody], [typeof i3.CommonModule, typeof i4.CdkTrapFocusModule, typeof i5.ClrIconModule], [typeof i1.ClrModal, typeof i2.ClrModalBody, typeof i5.ClrIconModule]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<ClrModalModule, [typeof i1.ClrModal, typeof i2.ClrModalBody, typeof i3.ClrModalHostDirective], [typeof i4.CommonModule, typeof i5.CdkTrapFocusModule, typeof i6.ClrIconModule], [typeof i1.ClrModal, typeof i2.ClrModalBody, typeof i3.ClrModalHostDirective, typeof i6.ClrIconModule]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<ClrModalModule>;
 }

package/modal/side-panel.d.ts

@@ -1,26 +1,45 @@
-import { ElementRef, EventEmitter, OnInit } from '@angular/core';
+import { ElementRef, EventEmitter, OnChanges, OnDestroy, OnInit, SimpleChange } from '@angular/core';
+import { ClrCommonStringsService } from '../utils';
 import { ClrModalConfigurationService } from './modal-configuration.service';
 import * as i0 from "@angular/core";
-export declare class ClrSidePanel implements OnInit {
+export declare class ClrSidePanel implements OnInit, OnDestroy, OnChanges {
     private element;
     private configuration;
+    commonStrings: ClrCommonStringsService;
     _open: boolean;
     openChange: EventEmitter<boolean>;
     closeButtonAriaLabel: string | undefined;
-    size: string;
-    skipAnimation: string;
+    skipAnimation: boolean;
     labelledById: string;
     staticBackdrop: boolean;
     preventClose: boolean;
     altClose: EventEmitter<boolean>;
     private modal;
-    constructor(element: ElementRef<HTMLElement>, configuration: ClrModalConfigurationService);
+    private _pinnable;
+    private _pinned;
+    private originalStopClose;
+    private _size;
+    constructor(element: ElementRef<HTMLElement>, configuration: ClrModalConfigurationService, commonStrings: ClrCommonStringsService);
+    get size(): string;
+    set size(value: string);
+    get pinned(): boolean;
+    set pinned(pinned: boolean);
     get clrSidePanelBackdrop(): boolean;
     set clrSidePanelBackdrop(backdrop: boolean);
+    get clrSidePanelPinnable(): boolean;
+    set clrSidePanelPinnable(pinnable: boolean);
+    private get hostElement();
     ngOnInit(): void;
+    ngOnChanges(changes: {
+        [propName: string]: SimpleChange;
+    }): void;
+    ngOnDestroy(): void;
     open(): void;
     close(): void;
+    togglePinned(): void;
     private documentClick;
+    private displaySideBySide;
+    private displayOverlapping;
     static ɵfac: i0.ɵɵFactoryDeclaration<ClrSidePanel, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ClrSidePanel, "clr-side-panel", never, { "_open": "clrSidePanelOpen"; "closeButtonAriaLabel": "clrSidePanelCloseButtonAriaLabel"; "size": "clrSidePanelSize"; "skipAnimation": "clrSidePanelSkipAnimation"; "labelledById": "clrSidePanelLabelledById"; "staticBackdrop": "clrSidePanelStaticBackdrop"; "preventClose": "clrSidePanelPreventClose"; "clrSidePanelBackdrop": "clrSidePanelBackdrop"; }, { "openChange": "clrSidePanelOpenChange"; "altClose": "clrSidePanelAlternateClose"; }, never, [".side-panel-title", ".side-panel-body", ".side-panel-footer"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ClrSidePanel, "clr-side-panel", never, { "_open": "clrSidePanelOpen"; "closeButtonAriaLabel": "clrSidePanelCloseButtonAriaLabel"; "skipAnimation": "clrSidePanelSkipAnimation"; "labelledById": "clrSidePanelLabelledById"; "staticBackdrop": "clrSidePanelStaticBackdrop"; "preventClose": "clrSidePanelPreventClose"; "size": "clrSidePanelSize"; "clrSidePanelBackdrop": "clrSidePanelBackdrop"; "clrSidePanelPinnable": "clrSidePanelPinnable"; }, { "openChange": "clrSidePanelOpenChange"; "altClose": "clrSidePanelAlternateClose"; }, never, [".side-panel-title", ".side-panel-body", ".side-panel-footer"], false, never>;
 }

package/modal/side-panel.module.d.ts

@@ -8,6 +8,6 @@ import * as i5 from "./modal.module";
 export declare const CLR_SIDEPANEL_DIRECTIVES: Type<any>[];
 export declare class ClrSidePanelModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<ClrSidePanelModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<ClrSidePanelModule, [typeof i1.ClrSidePanel], [typeof i2.CommonModule, typeof i3.CdkTrapFocusModule, typeof i4.ClrIconModule, typeof i5.ClrModalModule], [typeof i1.ClrSidePanel, typeof i4.ClrIconModule]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<ClrSidePanelModule, [typeof i1.ClrSidePanel], [typeof i2.CommonModule, typeof i3.CdkTrapFocusModule, typeof i4.ClrIconModule, typeof i5.ClrModalModule], [typeof i1.ClrSidePanel, typeof i5.ClrModalModule, typeof i4.ClrIconModule]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<ClrSidePanelModule>;
 }

package/package.json

@@ -22,7 +22,7 @@
     "@angular/common": "15 || 16 || 17 || 18 || 19",
     "@angular/core": "15 || 16 || 17 || 18 || 19",
     "@cds/core": ">= 6.9.2",
-    "@clr/ui": "17.6.0"
+    "@clr/ui": "17.7.0"
   },
   "module": "fesm2015/clr-angular.mjs",
   "es2020": "fesm2020/clr-angular.mjs",
@@ -47,5 +47,5 @@
   "dependencies": {
     "tslib": "^2.3.0"
   },
-  "version": "17.6.0"
+  "version": "17.7.0"
 }

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

@@ -21,7 +21,6 @@ export declare abstract class AbstractPopover implements AfterViewChecked, OnDes
     private subscription;
     private documentESCListener;
     constructor(injector: Injector, parentHost: ElementRef<HTMLElement>);
-    get isOffScreen(): boolean;
     ngAfterViewChecked(): void;
     ngOnDestroy(): void;
     protected anchor(): void;

package/utils/enums/keys.enum.d.ts

@@ -10,7 +10,9 @@ export declare enum Keys {
     Space = "Space",
     Spacebar = " ",
     Home = "Home",
-    End = "End"
+    End = "End",
+    PageDown = "PageDown",
+    PageUp = "PageUp"
 }
 export declare enum IEKeys {
     ArrowUp = "Up",

package/utils/host-wrapping/host-wrapper.d.ts

@@ -1,11 +1,10 @@
 import { InjectionToken, Injector, Type, ViewContainerRef } from '@angular/core';
-import { DynamicWrapper } from './dynamic-wrapper';
 /**
  * HostWrapper must be called in OnInit to ensure that the Views are ready. If its called in a constructor the view is
  * still undefined.
  * TODO - make sure these comment annotations do not break ng-packgr.
  */
-export declare class HostWrapper<W extends DynamicWrapper> implements Injector {
+export declare class HostWrapper<W> implements Injector {
     private injector;
     constructor(containerType: Type<W>, vcr: ViewContainerRef, index?: number);
     get<T>(token: Type<T> | InjectionToken<T>, notFoundValue?: T): T;

package/utils/i18n/common-strings.interface.d.ts

@@ -167,6 +167,10 @@ export interface ClrCommonStrings {
      * Modal end of content
      */
     modalContentEnd: string;
+    /**
+     * Side Panel pin dialog
+     */
+    sidePanelPin: string;
     /**
      * Datagrid Show columns menu description
      */

package/wizard/wizard.d.ts

@@ -85,6 +85,7 @@ export declare class ClrWizard implements OnDestroy, AfterContentInit, DoCheck {
     private _disableStepnav;
     private differ;
     private subscriptions;
+    private readonly modal;
     constructor(platformId: any, commonStrings: ClrCommonStringsService, navService: WizardNavigationService, pageCollection: PageCollectionService, buttonService: ButtonHubService, headerActionService: HeaderActionService, elementRef: ElementRef<HTMLElement>, differs: IterableDiffers);
     /**
      * Resets page completed states when navigating backwards.
@@ -139,7 +140,7 @@ export declare class ClrWizard implements OnDestroy, AfterContentInit, DoCheck {
     get isLast(): boolean;
     get isFirst(): boolean;
     get isInline(): boolean;
-    get stopModalAnimations(): string;
+    get stopModalAnimations(): boolean;
     ngAfterContentInit(): void;
     ngDoCheck(): void;
     ngOnDestroy(): void;

package/esm2020/utils/host-wrapping/dynamic-wrapper.mjs

@@ -1,8 +0,0 @@
-/*
- * Copyright (c) 2016-2024 Broadcom. All Rights Reserved.
- * The term "Broadcom" refers to Broadcom Inc. and/or its subsidiaries.
- * This software is released under MIT license.
- * The full license information can be found in LICENSE in the root directory of this project.
- */
-export {};
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZHluYW1pYy13cmFwcGVyLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvYW5ndWxhci9zcmMvdXRpbHMvaG9zdC13cmFwcGluZy9keW5hbWljLXdyYXBwZXIudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7Ozs7O0dBS0ciLCJzb3VyY2VzQ29udGVudCI6WyIvKlxuICogQ29weXJpZ2h0IChjKSAyMDE2LTIwMjQgQnJvYWRjb20uIEFsbCBSaWdodHMgUmVzZXJ2ZWQuXG4gKiBUaGUgdGVybSBcIkJyb2FkY29tXCIgcmVmZXJzIHRvIEJyb2FkY29tIEluYy4gYW5kL29yIGl0cyBzdWJzaWRpYXJpZXMuXG4gKiBUaGlzIHNvZnR3YXJlIGlzIHJlbGVhc2VkIHVuZGVyIE1JVCBsaWNlbnNlLlxuICogVGhlIGZ1bGwgbGljZW5zZSBpbmZvcm1hdGlvbiBjYW4gYmUgZm91bmQgaW4gTElDRU5TRSBpbiB0aGUgcm9vdCBkaXJlY3Rvcnkgb2YgdGhpcyBwcm9qZWN0LlxuICovXG5cbmV4cG9ydCBpbnRlcmZhY2UgRHluYW1pY1dyYXBwZXIge1xuICBfZHluYW1pYzogYm9vbGVhbjtcbn1cbiJdfQ==

package/utils/host-wrapping/dynamic-wrapper.d.ts

@@ -1,3 +0,0 @@
-export interface DynamicWrapper {
-    _dynamic: boolean;
-}