@coreui/angular-pro 4.1.0 → 4.2.0-next.0

package/lib/date-range-picker/date-range-picker/date-range-picker.component.d.ts

@@ -0,0 +1,235 @@
+import { ElementRef, EventEmitter, OnDestroy, OnInit } from '@angular/core';
+import { ControlValueAccessor, FormControl, FormGroup } from '@angular/forms';
+import { BooleanInput } from '@angular/cdk/coercion';
+import { BreakpointObserver } from '@angular/cdk/layout';
+import { Colors } from '../../coreui.types';
+import { CalendarComponent } from '../../calendar';
+import { DateFilterType, DayFormatType, WeekdayFormatType } from '../../calendar/calendar.service';
+import { StartDateDirective } from '../start-date.directive';
+import { EndDateDirective } from '../end-date.directive';
+import * as i0 from "@angular/core";
+export interface ICalendarRange {
+    [key: string]: Date[];
+}
+export declare type TCustomRange = [string, Date[]];
+/** Must be a valid date string */
+export declare class DateRangePickerComponent implements OnInit, OnDestroy, ControlValueAccessor {
+    private breakpointObserver;
+    static ngAcceptInputType_disabled: BooleanInput;
+    static ngAcceptInputType_navYearFirst: BooleanInput;
+    constructor(breakpointObserver: BreakpointObserver);
+    /**
+     * Set the format of day name.
+     * @default 'numeric'
+     * @type DayFormatType
+     */
+    dayFormat: DayFormatType;
+    /**
+     * The number of calendars that render on desktop devices.
+     * @type number
+     * @default 2
+     */
+    set calendars(value: number);
+    get calendars(): number;
+    private _calendars;
+    /**
+     * Toggle visibility or set the content of the cleaner button.
+     * @type boolean
+     * @default true
+     */
+    set cleaner(value: boolean);
+    get cleaner(): boolean;
+    private _cleaner;
+    /**
+     * Set date format.
+     * We use date-fns to format dates. Visit https://date-fns.org/v2.28.0/docs/format to check accepted patterns.
+     */
+    format?: string;
+    /**
+     * Toggle visibility or set the content of the input indicator.
+     * @type boolean
+     * @default true
+     */
+    set indicator(value: boolean);
+    get indicator(): boolean;
+    private _indicator;
+    /**
+     * Toggle the readonly state for the component.
+     * @type boolean
+     * @default false
+     */
+    set inputReadOnly(value: boolean);
+    get inputReadOnly(): boolean;
+    private _inputReadOnly;
+    /**
+     * Reorder year-month navigation, and render year first.
+     * @type boolean
+     * @default false
+     */
+    set navYearFirst(value: boolean);
+    get navYearFirst(): boolean;
+    private _navYearFirst;
+    /**
+     * Specifies short hints that are visible in start date and end date inputs.
+     * type string
+     */
+    placeholder: string | string[];
+    /**
+     * Predefined date ranges the user can select from.
+     * @type ICalendarRange
+     */
+    ranges?: object;
+    /**
+     * Sets the color context of the cancel button to one of CoreUI’s themed colors.
+     * @type 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'info' | 'dark' | 'light' | string
+     * @default 'secondary'
+     */
+    rangesButtonsColor?: Colors;
+    /**
+     * Size the ranges button small or large.
+     * @type 'sm' | 'lg' | undefined
+     */
+    rangesButtonsSize?: 'sm' | 'lg';
+    /**
+     * Set the ranges button variant to an outlined button or a ghost button.
+     * @type 'outline' | 'ghost' | undefined
+     */
+    rangesButtonsVariant?: 'outline' | 'ghost';
+    /**
+     * Default icon or character that separates two dates.
+     * @type boolean
+     * @default true
+     */
+    set separator(value: boolean);
+    get separator(): boolean;
+    private _separator;
+    /**
+     * Size the component small or large.
+     * @type 'sm' | 'lg' | undefined
+     * @default undefined
+     */
+    size?: 'sm' | 'lg';
+    /**
+     * Provide an additional time selection by adding select boxes to choose time.
+     * @type boolean
+     * @default false
+     */
+    set timepicker(value: boolean);
+    get timepicker(): boolean;
+    private _timepicker;
+    /**
+     * Toggle visibility or set the content of today button.
+     * @type string
+     * @default 'Today'
+     */
+    todayButton: string;
+    /**
+     * Sets the color context of the today button to one of CoreUI’s themed colors.
+     * @type 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'info' | 'dark' | 'light' | string
+     * @default 'primary'
+     */
+    todayButtonColor: Colors;
+    /**
+     * Size the today button small or large.
+     * @type 'sm' | 'lg'
+     * @default 'sm'
+     */
+    todayButtonSize: 'sm' | 'lg';
+    /**
+     * Set the today button variant to an outlined button or a ghost button.
+     * @type 'outline' | 'ghost' | undefined
+     */
+    todayButtonVariant?: 'outline' | 'ghost';
+    /**
+     * Toggle the visibility of the component.
+     * @type boolean
+     * @default false
+     */
+    set visible(value: boolean);
+    get visible(): boolean;
+    private _visible;
+    startDate?: Date | null;
+    endDate?: Date | null;
+    calendarDate?: Date;
+    disabledDates: Date[] | Date[][];
+    set firstDayOfWeek(value: number);
+    get firstDayOfWeek(): number;
+    private _firstDayOfWeek;
+    locale: string;
+    maxDate: Date | null;
+    minDate: Date | null;
+    set navigation(value: boolean);
+    get navigation(): boolean;
+    private _navigation;
+    /**
+     * Allow range selection.
+     * @type boolean
+     * @default false
+     */
+    set range(value: boolean);
+    get range(): boolean;
+    private _range;
+    dateFilter?: DateFilterType;
+    set disabled(value: boolean);
+    get disabled(): boolean;
+    private _disabled;
+    set value(value: Date[]);
+    get value(): Date[];
+    private _value;
+    /**
+     * Set length or format of day name.
+     * @type WeekdayFormatType
+     * @default 'short'
+     */
+    weekdayFormat: WeekdayFormatType;
+    readonly valueChange: EventEmitter<Date | Date[] | undefined>;
+    calendarCellHover: EventEmitter<Date | null>;
+    calendarDateChange: EventEmitter<Date>;
+    endDateChange: EventEmitter<Date | null>;
+    startDateChange: EventEmitter<Date | null>;
+    calendarComponent: CalendarComponent;
+    startDateDirective: StartDateDirective;
+    endDateDirective: EndDateDirective;
+    onBlur(): void;
+    isMobile: boolean;
+    customRanges: TCustomRange[];
+    set startDateValue(value: string);
+    get startDateValue(): string;
+    private _startDateValue;
+    set endDateValue(value: string);
+    get endDateValue(): string;
+    _endDateValue: string;
+    startDatePlaceholder: string;
+    endDatePlaceholder: string;
+    private layoutChanges;
+    startDateInput: FormControl<string | null>;
+    endDateInput: FormControl<string | null>;
+    dateRangeGroup: FormGroup;
+    set inputStartHoverValue(value: Date | null);
+    get inputStartHoverValue(): Date | null;
+    private _inputStartHoverValue;
+    set inputEndHoverValue(value: Date | null);
+    get inputEndHoverValue(): Date | null;
+    private _inputEndHoverValue;
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    getCustomRangeKey(customRange: any): any;
+    setCustomRange(customRange: any): void;
+    handleCalendarCellHover($event: Date | null): void;
+    handleCalendarDateChange($event: Date): void;
+    handleStartDateChange(date: Date | null): void;
+    handleEndDateChange(date: Date | null): void;
+    handleClear($event: MouseEvent): void;
+    handleStartDateInputChange($event: any): void;
+    handleEndDateInputChange($event: any): void;
+    forbiddenDate(date: Date): boolean | undefined;
+    setInputValue: (elementRef: ElementRef, date: Date | null) => void;
+    onChange: any;
+    onTouched: any;
+    registerOnChange(fn: any): void;
+    registerOnTouched(fn: any): void;
+    setDisabledState(isDisabled: boolean): void;
+    writeValue(value: (Date[])): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<DateRangePickerComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DateRangePickerComponent, "c-date-range-picker", ["cDateRangePicker"], { "dayFormat": "dayFormat"; "calendars": "calendars"; "cleaner": "cleaner"; "format": "format"; "indicator": "indicator"; "inputReadOnly": "inputReadOnly"; "navYearFirst": "navYearFirst"; "placeholder": "placeholder"; "ranges": "ranges"; "rangesButtonsColor": "rangesButtonsColor"; "rangesButtonsSize": "rangesButtonsSize"; "rangesButtonsVariant": "rangesButtonsVariant"; "separator": "separator"; "size": "size"; "timepicker": "timepicker"; "todayButton": "todayButton"; "todayButtonColor": "todayButtonColor"; "todayButtonSize": "todayButtonSize"; "todayButtonVariant": "todayButtonVariant"; "visible": "visible"; "startDate": "startDate"; "endDate": "endDate"; "calendarDate": "calendarDate"; "disabledDates": "disabledDates"; "firstDayOfWeek": "firstDayOfWeek"; "locale": "locale"; "maxDate": "maxDate"; "minDate": "minDate"; "navigation": "navigation"; "range": "range"; "dateFilter": "dateFilter"; "disabled": "disabled"; "value": "value"; "weekdayFormat": "weekdayFormat"; }, { "valueChange": "valueChange"; "calendarCellHover": "calendarCellHover"; "calendarDateChange": "calendarDateChange"; "endDateChange": "endDateChange"; "startDateChange": "startDateChange"; }, never, ["*"], false>;
+}

package/lib/date-range-picker/date-range-picker.module.d.ts

@@ -0,0 +1,16 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./date-range-picker/date-range-picker.component";
+import * as i2 from "./start-date.directive";
+import * as i3 from "./end-date.directive";
+import * as i4 from "@angular/common";
+import * as i5 from "@angular/forms";
+import * as i6 from "../button/button.module";
+import * as i7 from "../calendar/calendar.module";
+import * as i8 from "../shared/shared.module";
+import * as i9 from "../form/form.module";
+import * as i10 from "../dropdown/dropdown.module";
+export declare class DateRangePickerModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<DateRangePickerModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<DateRangePickerModule, [typeof i1.DateRangePickerComponent, typeof i2.StartDateDirective, typeof i3.EndDateDirective], [typeof i4.CommonModule, typeof i5.FormsModule, typeof i5.ReactiveFormsModule, typeof i6.ButtonModule, typeof i7.CalendarModule, typeof i8.SharedModule, typeof i9.FormModule, typeof i10.DropdownModule], [typeof i1.DateRangePickerComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<DateRangePickerModule>;
+}

package/lib/date-range-picker/end-date.directive.d.ts

@@ -0,0 +1,8 @@
+import { ElementRef } from '@angular/core';
+import * as i0 from "@angular/core";
+export declare class EndDateDirective {
+    elementRef: ElementRef;
+    constructor(elementRef: ElementRef);
+    static ɵfac: i0.ɵɵFactoryDeclaration<EndDateDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<EndDateDirective, "[cEndDate]", ["cEndDate"], {}, {}, never, never, false>;
+}

package/lib/date-range-picker/index.d.ts

@@ -0,0 +1 @@
+export * from './public_api';

package/lib/date-range-picker/public_api.d.ts

@@ -0,0 +1,2 @@
+export { DateRangePickerComponent, ICalendarRange } from './date-range-picker/date-range-picker.component';
+export { DateRangePickerModule } from './date-range-picker.module';

package/lib/date-range-picker/start-date.directive.d.ts

@@ -0,0 +1,8 @@
+import { ElementRef } from '@angular/core';
+import * as i0 from "@angular/core";
+export declare class StartDateDirective {
+    elementRef: ElementRef;
+    constructor(elementRef: ElementRef);
+    static ɵfac: i0.ɵɵFactoryDeclaration<StartDateDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<StartDateDirective, "[cStartDate]", ["cStartDate"], {}, {}, never, never, false>;
+}

package/lib/time-picker/index.d.ts

@@ -0,0 +1 @@
+export * from './public_api';

package/lib/time-picker/public_api.d.ts

@@ -0,0 +1,2 @@
+export { TimePickerComponent } from './time-picker.component';
+export { TimePickerModule } from './time-picker.module';

package/lib/time-picker/time-picker-roll-col/time-picker-roll-am-pm.component.d.ts

@@ -0,0 +1,39 @@
+import { AfterViewInit, ElementRef, EventEmitter, OnChanges, QueryList, SimpleChanges } from '@angular/core';
+import { DayPeriod } from '../time.utils';
+import * as i0 from "@angular/core";
+export interface IDayPeriod {
+    value: string;
+    label: string;
+    dayPeriod?: DayPeriod;
+    disabled?: boolean;
+}
+export declare class DayPeriodElementDirective {
+    elementRef: ElementRef;
+    constructor(elementRef: ElementRef);
+    cDayPeriodElement: IDayPeriod;
+    static ɵfac: i0.ɵɵFactoryDeclaration<DayPeriodElementDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<DayPeriodElementDirective, "[cDayPeriodElement]", ["cDayPeriodElement"], { "cDayPeriodElement": "cDayPeriodElement"; }, {}, never, never, false>;
+}
+export declare class TimePickerRollAmPmComponent implements OnChanges, AfterViewInit {
+    elementRef: ElementRef;
+    constructor(elementRef: ElementRef);
+    private init;
+    disabled: boolean;
+    elements: IDayPeriod[];
+    onClick?: (value: number | string) => void;
+    selected?: number | string | null;
+    refresh?: boolean;
+    selectedChange: EventEmitter<any>;
+    get hostClasses(): {
+        'time-picker-roll-col': boolean;
+        disabled: boolean;
+    };
+    dayPeriodElements: QueryList<DayPeriodElementDirective>;
+    ngAfterViewInit(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    scrollToElement(element: any): void;
+    handleElementClick($event: MouseEvent, element: any): void;
+    trackByElement(index: number, element: IDayPeriod): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TimePickerRollAmPmComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TimePickerRollAmPmComponent, "c-time-picker-roll-am-pm", never, { "disabled": "disabled"; "elements": "elements"; "onClick": "onClick"; "selected": "selected"; "refresh": "refresh"; }, { "selectedChange": "selectedChange"; }, never, never, false>;
+}

package/lib/time-picker/time-picker-roll-col/time-picker-roll-col.component.d.ts

@@ -0,0 +1,38 @@
+import { AfterViewInit, ElementRef, EventEmitter, OnChanges, QueryList, SimpleChanges } from '@angular/core';
+import { ITimeValue } from '../time.utils';
+import * as i0 from "@angular/core";
+export interface ITimePickerRollCol {
+    elements: ITimeValue[];
+    onClick?: (value: number | string) => void;
+    selected?: number | string | null;
+}
+export declare class TimeElementDirective {
+    elementRef: ElementRef;
+    constructor(elementRef: ElementRef);
+    cTimeElement: ITimeValue;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TimeElementDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<TimeElementDirective, "[cTimeElement]", ["cTimeElement"], { "cTimeElement": "cTimeElement"; }, {}, never, never, false>;
+}
+export declare class TimePickerRollColComponent implements ITimePickerRollCol, OnChanges, AfterViewInit {
+    elementRef: ElementRef;
+    constructor(elementRef: ElementRef);
+    private init;
+    disabled: boolean;
+    elements: ITimeValue[];
+    onClick?: (value: number | string) => void;
+    selected?: number | string | null;
+    refresh?: boolean;
+    selectedChange: EventEmitter<any>;
+    get hostClasses(): {
+        'time-picker-roll-col': boolean;
+        disabled: boolean;
+    };
+    timeElements: QueryList<TimeElementDirective>;
+    ngAfterViewInit(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    scrollToElement(element: any): void;
+    handleElementClick($event: MouseEvent, element: any): void;
+    trackByElement(index: number, element: ITimeValue): number;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TimePickerRollColComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TimePickerRollColComponent, "c-time-picker-roll-col", ["cTimePickerRollCol"], { "disabled": "disabled"; "elements": "elements"; "onClick": "onClick"; "selected": "selected"; "refresh": "refresh"; }, { "selectedChange": "selectedChange"; }, never, never, false>;
+}

package/lib/time-picker/time-picker.component.d.ts

@@ -0,0 +1,169 @@
+import { EventEmitter, OnChanges, OnInit, SimpleChanges } from '@angular/core';
+import { ControlValueAccessor, FormControl, FormGroup } from '@angular/forms';
+import { BooleanInput } from '@angular/cdk/coercion';
+import { DateTimeFormatOptions, DayPeriod, ITimeValue } from './time.utils';
+import * as i0 from "@angular/core";
+export declare class TimePickerComponent implements OnChanges, OnInit, ControlValueAccessor {
+    constructor();
+    static ngAcceptInputType_cleaner: BooleanInput;
+    static ngAcceptInputType_disabled: BooleanInput;
+    static ngAcceptInputType_indicator: BooleanInput;
+    static ngAcceptInputType_inputReadOnly: BooleanInput;
+    static ngAcceptInputType_seconds: BooleanInput;
+    /**
+     * Toggle visibility or set the content of the cleaner button.
+     * @type boolean
+     * @default true
+     */
+    set cleaner(value: boolean);
+    get cleaner(): boolean;
+    private _cleaner;
+    /**
+     * Sets DateTime format options including timeZone
+     * @type DateTimeFormatOptions
+     * @default {}
+     * @note The date object doesn't store timeZone, it keeps the local timezone of the browser, regardless if you parsed UTC dates.
+     */
+    dateTimeFormatOptions: DateTimeFormatOptions;
+    /**
+     * Toggle the disabled state for the component.
+     * @type boolean
+     * @default false
+     */
+    set disabled(value: boolean);
+    get disabled(): boolean;
+    private _disabled;
+    /**
+     * Filter available hours to pick.
+     * @type (value: number) => boolean;
+     * @default undefined
+     */
+    filterHours?: (value: number) => boolean;
+    /**
+     * Filter available minutes to pick.
+     * @type (value: number) => boolean;
+     * @default undefined
+     */
+    filterMinutes?: (value: number) => boolean;
+    /**
+     * Filter available seconds to pick.
+     * @type (value: number) => boolean;
+     * @default undefined
+     */
+    filterSeconds?: (value: number) => boolean;
+    /**
+     * Toggle visibility or set the content of the input indicator.
+     * @type boolean
+     * @default true
+     */
+    set indicator(value: boolean);
+    get indicator(): boolean;
+    private _indicator;
+    /**
+     * Toggle the readonly state for the component.
+     * @type boolean
+     * @default false
+     */
+    set inputReadOnly(value: boolean);
+    get inputReadOnly(): boolean;
+    private _inputReadOnly;
+    /**
+     * Sets the default locale for components. If not set, it is inherited from the browser.
+     * @type string
+     * @default default
+     */
+    locale: string;
+    /**
+     * Specifies short hint visible in time input.
+     * @type string
+     * @default 'Select time'
+     */
+    placeholder: string;
+    /**
+     * Toggle seconds visibility.
+     * @type boolean
+     * @default false
+     */
+    set seconds(value: boolean);
+    get seconds(): boolean;
+    private _seconds;
+    /**
+     * Size the component small or large.
+     * @type 'sm' | 'lg' | undefined
+     * @default undefined
+     */
+    size?: 'sm' | 'lg';
+    /**
+     * Initial selected time.
+     * @type Date | string | null | number
+     * @default undefined
+     */
+    set time(value: Date | undefined);
+    get time(): Date | undefined;
+    private _time?;
+    private _timeInternal?;
+    /**
+     * Set the time picker variant to a roll or select.
+     * @type 'roll' | 'select'
+     * @default 'roll'
+     */
+    variant: 'roll' | 'select';
+    timeChange: EventEmitter<Date | undefined>;
+    onBlur(): void;
+    listOfHours: ITimeValue[];
+    listOfHours12: ITimeValue[];
+    listOfMinutes: ITimeValue[];
+    listOfSeconds: ITimeValue[];
+    hour12: boolean;
+    dayPeriods: {
+        value: string;
+        label: string;
+    }[];
+    set timeInputValue(value: string);
+    get timeInputValue(): string;
+    private _timeInputValue;
+    selectTime: FormGroup<{
+        selectHours: FormControl<number | null>;
+        selectMinutes: FormControl<number | null>;
+        selectSeconds: FormControl<number | null>;
+        selectDayPeriod: FormControl<DayPeriod | null>;
+    }>;
+    timeInput: FormControl<string | null>;
+    set hour(value: number);
+    get hour(): number;
+    private _hour;
+    set minute(value: number);
+    get minute(): number;
+    private _minute;
+    set second(value: number);
+    get second(): number;
+    private _second;
+    set dayPeriod(value: DayPeriod);
+    get dayPeriod(): DayPeriod;
+    private _dayPeriod;
+    setTime(): void;
+    clearTime(): void;
+    emitTime(time: Date | undefined): void;
+    ngOnInit(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    setTimeLists(): void;
+    updateSelectTime(time?: Date | undefined): void;
+    closestTime(timeArray: ITimeValue[], timeSegment: number): ITimeValue;
+    listOfTimeSegments(getListOfTimeSegments: (locale: string, dateTimeFormatOptions: DateTimeFormatOptions) => ITimeValue[], filterTimeSegments: ((timeSegmentValue: number) => boolean) | undefined): ITimeValue[];
+    handleSelectDayPeriodChange(dayPeriod: DayPeriod): void;
+    handleSelectHoursChange(hour: number): void;
+    handleSelectMinutesChange(minute: number): void;
+    handleSelectSecondsChange(second: number): void;
+    patchSelectTimeValues(): void;
+    trackByHour(index: number, hour: ITimeValue): ITimeValue;
+    onChange: (value: Date | undefined) => void;
+    onTouched: () => void;
+    writeValue(value: any): void;
+    registerOnChange(fn: any): void;
+    registerOnTouched(fn: any): void;
+    setDisabledState(isDisabled: boolean): void;
+    handleTimeInputChange($event: any): void;
+    handleClear($event: MouseEvent): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TimePickerComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TimePickerComponent, "c-time-picker-select", ["cTimePickerSelect"], { "cleaner": "cleaner"; "dateTimeFormatOptions": "dateTimeFormatOptions"; "disabled": "disabled"; "filterHours": "filterHours"; "filterMinutes": "filterMinutes"; "filterSeconds": "filterSeconds"; "indicator": "indicator"; "inputReadOnly": "inputReadOnly"; "locale": "locale"; "placeholder": "placeholder"; "seconds": "seconds"; "size": "size"; "time": "time"; "variant": "variant"; }, { "timeChange": "timeChange"; }, never, never, false>;
+}

package/lib/time-picker/time-picker.module.d.ts

@@ -0,0 +1,14 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./time-picker.component";
+import * as i2 from "./time-picker-roll-col/time-picker-roll-col.component";
+import * as i3 from "./time-picker-roll-col/time-picker-roll-am-pm.component";
+import * as i4 from "@angular/common";
+import * as i5 from "@angular/forms";
+import * as i6 from "../form/form.module";
+import * as i7 from "../button/button.module";
+import * as i8 from "../dropdown/dropdown.module";
+export declare class TimePickerModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<TimePickerModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<TimePickerModule, [typeof i1.TimePickerComponent, typeof i2.TimePickerRollColComponent, typeof i2.TimeElementDirective, typeof i3.TimePickerRollAmPmComponent, typeof i3.DayPeriodElementDirective], [typeof i4.CommonModule, typeof i5.ReactiveFormsModule, typeof i6.FormModule, typeof i7.ButtonModule, typeof i8.DropdownModule], [typeof i1.TimePickerComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<TimePickerModule>;
+}

package/lib/time-picker/time.utils.d.ts

@@ -0,0 +1,57 @@
+export interface DateTimeFormatOptions {
+    localeMatcher?: "best fit" | "lookup" | undefined;
+    weekday?: "long" | "short" | "narrow" | undefined;
+    era?: "long" | "short" | "narrow" | undefined;
+    year?: "numeric" | "2-digit" | undefined;
+    month?: "numeric" | "2-digit" | "long" | "short" | "narrow" | undefined;
+    day?: "numeric" | "2-digit" | undefined;
+    hour?: "numeric" | "2-digit" | undefined;
+    minute?: "numeric" | "2-digit" | undefined;
+    second?: "numeric" | "2-digit" | undefined;
+    timeZoneName?: "long" | "short" | undefined;
+    formatMatcher?: "best fit" | "basic" | undefined;
+    hour12?: boolean | undefined;
+    timeZone?: string | undefined;
+}
+export declare type DayPeriod = ('am' | 'pm');
+export interface ITimeValue {
+    value: number;
+    label: string;
+    dayPeriod?: DayPeriod;
+    disabled?: boolean;
+}
+export interface IDayPeriods {
+    am: string;
+    pm: string;
+}
+export declare const getSupportedLocale: (locale?: string) => string;
+export declare const isHour12: (locale?: string) => boolean;
+export declare const convert12hTo24h: (abbr: 'am' | 'pm', hour: number) => number;
+export declare const convert24hTo12h: (hour: number) => number;
+export declare const convertTimeToDate: (time: Date | string | null | undefined) => Date | null;
+export declare const getAmPm: (date: Date, locale: string, options?: DateTimeFormatOptions) => DayPeriod;
+export declare const isAm: (date: Date) => boolean;
+export declare const isPm: (date: Date) => boolean;
+export declare const isValidTimeZone: (timeZone: unknown) => boolean;
+export declare const getListOfHours: (locale: string, options?: DateTimeFormatOptions) => {
+    value: number;
+    dayPeriod: DayPeriod;
+    label: string;
+}[];
+export declare const getListOfMinutes: (locale: string, options?: DateTimeFormatOptions, valueAsString?: boolean) => {
+    value: number;
+    label: string;
+}[];
+export declare const getListOfSeconds: (locale: string, options?: DateTimeFormatOptions, valueAsString?: boolean) => {
+    value: number;
+    label: string;
+}[];
+export declare const getSelectedHour: (date: Date | null, locale: string) => number | "";
+export declare const getSelectedMinutes: (date: Date | null) => number | "";
+export declare const getSelectedSeconds: (date: Date | null) => number | "";
+export declare const isAmPm: (locale?: string) => boolean;
+export declare const isValidTime: (time: string | Date | number | any) => boolean;
+export declare const getDayPeriods: (locale?: string, options?: DateTimeFormatOptions) => {
+    value: string;
+    label: string;
+}[];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coreui/angular-pro",
-  "version": "4.1.0",
+  "version": "4.2.0-next.0",
   "description": "CoreUI Pro Components Library for Angular",
   "homepage": "https://coreui.io/angular",
   "author": {
@@ -23,7 +23,13 @@
     "@angular/cdk": "^14.0.0",
     "@angular/common": "^14.0.0",
     "@angular/core": "^14.0.0",
-    "@angular/router": "^14.0.0"
+    "@angular/router": "^14.0.0",
+    "date-fns": "^2.28.0"
+  },
+  "peerDependenciesMeta": {
+    "date-fns": {
+      "optional": true
+    }
   },
   "repository": {
     "type": "git",

package/public-api.d.ts

@@ -7,10 +7,12 @@ export * from './lib/badge';
 export * from './lib/breadcrumb';
 export * from './lib/button';
 export * from './lib/button-group';
+export * from './lib/calendar';
 export * from './lib/callout';
 export * from './lib/card';
 export * from './lib/carousel';
 export * from './lib/collapse';
+export * from './lib/date-range-picker';
 export * from './lib/dropdown';
 export * from './lib/element-cover';
 export * from './lib/footer';
@@ -36,6 +38,7 @@ export * from './lib/smart-table';
 export * from './lib/spinner';
 export * from './lib/table';
 export * from './lib/tabs';
+export * from './lib/time-picker';
 export * from './lib/toast';
 export * from './lib/tooltip';
 export * from './lib/utilities';