UNPKG

@netwin/angular-datetime-picker

Version:
1,317 lines (1,300 loc) 57.8 kB
import * as i0 from '@angular/core'; import { InjectionToken, OutputRef, AfterContentInit, AfterViewChecked, OnInit, OnDestroy, Provider } from '@angular/core'; import * as i1 from '@angular/cdk/platform'; import * as rxjs from 'rxjs'; import { Subject } from 'rxjs'; import { ControlValueAccessor } from '@angular/forms'; declare class NativeDateTimeModule { static ɵfac: i0.ɵɵFactoryDeclaration<NativeDateTimeModule, never>; static ɵmod: i0.ɵɵNgModuleDeclaration<NativeDateTimeModule, never, [typeof i1.PlatformModule], never>; static ɵinj: i0.ɵɵInjectorDeclaration<NativeDateTimeModule>; } declare class OwlNativeDateTimeModule { static ɵfac: i0.ɵɵFactoryDeclaration<OwlNativeDateTimeModule, never>; static ɵmod: i0.ɵɵNgModuleDeclaration<OwlNativeDateTimeModule, never, [typeof NativeDateTimeModule], never>; static ɵinj: i0.ɵɵInjectorDeclaration<OwlNativeDateTimeModule>; } /** InjectionToken for date time picker that can be used to override default locale code. */ declare const OWL_DATE_TIME_LOCALE: InjectionToken<string>; /** Provider for OWL_DATE_TIME_LOCALE injection token. */ declare const OWL_DATE_TIME_LOCALE_PROVIDER: { provide: InjectionToken<string>; useExisting: InjectionToken<string>; }; declare abstract class DateTimeAdapter<T> { /** The locale to use for all dates. */ protected locale: string; /** A stream that emits when the locale changes. */ protected _localeChanges: Subject<string>; localeChanges: rxjs.Observable<string>; /** total milliseconds in a day. */ protected readonly millisecondsInDay = 86400000; /** total milliseconds in a minute. */ protected readonly milliseondsInMinute = 60000; /** * Get the year of the given date */ abstract getYear(date: T): number; /** * Get the month of the given date * 0 -- January * 11 -- December */ abstract getMonth(date: T): number; /** * Get the day of the week of the given date * 0 -- Sunday * 6 -- Saturday */ abstract getDay(date: T): number; /** * Get the day num of the given date */ abstract getDate(date: T): number; /** * Get the hours of the given date */ abstract getHours(date: T): number; /** * Get the minutes of the given date */ abstract getMinutes(date: T): number; /** * Get the seconds of the given date */ abstract getSeconds(date: T): number; /** * Get the milliseconds timestamp of the given date */ abstract getTime(date: T): number; /** * Gets the number of days in the month of the given date. */ abstract getNumDaysInMonth(date: T): number; /** * Get the number of calendar days between the given dates. * If dateLeft is before dateRight, it would return positive value * If dateLeft is after dateRight, it would return negative value */ abstract differenceInCalendarDays(dateLeft: T, dateRight: T): number; /** * Gets the name for the year of the given date. */ abstract getYearName(date: T): string; /** * Get a list of month names */ abstract getMonthNames(style: Intl.DateTimeFormatOptions['month']): Array<string>; /** * Get a list of week names */ abstract getDayOfWeekNames(style: Intl.DateTimeFormatOptions['weekday']): Array<string>; /** * Gets a list of names for the dates of the month. */ abstract getDateNames(): Array<string>; /** * Return a Date object as a string, using the ISO standard */ abstract toIso8601(date: T): string; /** * Check if the give dates are equal */ abstract isEqual(dateLeft: T, dateRight: T): boolean; /** * Check if the give dates are the same day */ abstract isSameDay(dateLeft: T, dateRight: T): boolean; /** * Checks whether the given date is valid. */ abstract isValid(date: T): boolean; /** * Gets date instance that is not valid. */ abstract invalid(): T; /** * Checks whether the given object is considered a date instance by this DateTimeAdapter. */ abstract isDateInstance(obj: unknown): obj is T; /** * Add the specified number of years to the given date */ abstract addCalendarYears(date: T, amount: number): T; /** * Add the specified number of months to the given date */ abstract addCalendarMonths(date: T, amount: number): T; /** * Add the specified number of days to the given date */ abstract addCalendarDays(date: T, amount: number): T; /** * Set the hours to the given date. */ abstract setHours(date: T, amount: number): T; /** * Set the minutes to the given date. */ abstract setMinutes(date: T, amount: number): T; /** * Set the seconds to the given date. */ abstract setSeconds(date: T, amount: number): T; /** * Creates a date with the given year, month, date, hour, minute and second. Does not allow over/under-flow of the * month and date. */ abstract createDate(year: number, month: number, date: number): T; abstract createDate(year: number, month: number, date: number, hours: number, minutes: number, seconds: number): T; /** * Clone the given date */ abstract clone(date: T): T; /** * Get a new moment */ abstract now(): T; /** * Formats a date as a string according to the given format. */ abstract format(date: T, displayFormat: Intl.DateTimeFormatOptions): string; /** * Parse a user-provided value to a Date Object */ abstract parse(value: unknown): T | null; /** * Compare two given dates * 1 if the first date is after the second, * -1 if the first date is before the second * 0 if dates are equal. */ compare(first: T, second: T): number; /** * Check if two given dates are in the same year * 1 if the first date's year is after the second, * -1 if the first date's year is before the second * 0 if two given dates are in the same year */ compareYear(first: T, second: T): number; /** * Attempts to deserialize a value to a valid date object. This is different from parsing in that * deserialize should only accept non-ambiguous, locale-independent formats (e.g. a ISO 8601 * string). The default implementation does not allow any deserialization, it simply checks that * the given value is already a valid date object or null. The `<mat-datepicker>` will call this * method on all of it's `@Input()` properties that accept dates. It is therefore possible to * support passing values from your backend directly to these properties by overriding this method * to also deserialize the format used by your backend. */ deserialize(value: T | null): T | null; /** * Sets the locale used for all dates. */ setLocale(locale: string): void; /** * Get the locale used for all dates. */ getLocale(): string; /** * Clamp the given date between min and max dates. */ clampDate(date: T, min?: T | null, max?: T | null): T; } /** * date-time-format.class */ type OwlDateTimeFormats = { fullPickerInput: Partial<Intl.DateTimeFormatOptions>; datePickerInput: Partial<Intl.DateTimeFormatOptions>; timePickerInput: Partial<Intl.DateTimeFormatOptions>; monthYearLabel: Partial<Intl.DateTimeFormatOptions>; dateA11yLabel: Partial<Intl.DateTimeFormatOptions>; monthYearA11yLabel: Partial<Intl.DateTimeFormatOptions>; }; /** InjectionToken for date time picker that can be used to override default format. */ declare const OWL_DATE_TIME_FORMATS: InjectionToken<OwlDateTimeFormats>; /** * date-time.class */ declare const PickerType: { /** * Shows both calendar and timer views. */ readonly Both: "both"; /** * Shows only the calendar view. */ readonly Calendar: "calendar"; /** * Shows only the timer view. */ readonly Timer: "timer"; }; type PickerType = (typeof PickerType)[keyof typeof PickerType]; declare const SelectMode: { /** * Selects a single date. */ readonly Single: "single"; /** * Selects a date range. */ readonly Range: "range"; /** * Selects a date range from a specific date. * The end date (range[1]) will always be `null` in this mode. */ readonly RangeFrom: "rangeFrom"; /** * Selects a date range up to a specific date. * The start date (range[0]) will always be `null` in this mode. */ readonly RangeTo: "rangeTo"; }; type SelectMode = (typeof SelectMode)[keyof typeof SelectMode]; declare const DateView: { /** * Shows all days of a month in a grid. */ readonly MONTH: "month"; /** * Shows all months of a year in a grid. */ readonly YEAR: "year"; /** * Shows a list of years. */ readonly MULTI_YEARS: "multi-years"; }; type DateViewType = (typeof DateView)[keyof typeof DateView]; declare abstract class OwlDateTime<T> { protected readonly dateTimeAdapter: DateTimeAdapter<T>; protected readonly dateTimeFormats: OwlDateTimeFormats; /** * Whether to show the second's timer */ showSecondsTimer: boolean; /** * Whether the timer is in hour12 format */ hour12Timer: boolean; /** * The view that the calendar should start in. */ startView: DateViewType; /** * Whether to should only the year and multi-year views. */ yearOnly: boolean; /** * Whether to should only the multi-year view. */ multiyearOnly: boolean; /** * Hours to change per step */ stepHour: number; /** * Minutes to change per step */ stepMinute: number; /** * Seconds to change per step */ stepSecond: number; /** * Set the first day of week */ firstDayOfWeek: number | undefined; /** * Whether to hide dates in other months at the start or end of the current month. */ hideOtherMonths: boolean; readonly id: string; abstract disabled: boolean; abstract get selected(): T | null; abstract get selecteds(): Array<T> | null; abstract get dateTimeFilter(): (date: T | null) => boolean; abstract get maxDateTime(): T | null; abstract get minDateTime(): T | null; abstract get selectMode(): SelectMode; abstract get startAt(): T | null; abstract get endAt(): T | null; abstract get opened(): boolean; abstract get pickerType(): PickerType; abstract get isInSingleMode(): boolean; abstract get isInRangeMode(): boolean; abstract select(date: T | Array<T>): void; abstract yearSelected: OutputRef<T>; abstract monthSelected: OutputRef<T>; abstract dateSelected: OutputRef<T>; abstract selectYear(normalizedYear: T): void; abstract selectMonth(normalizedMonth: T): void; abstract selectDate(normalizedDate: T): void; get displayFormat(): Partial<Intl.DateTimeFormatOptions>; /** * Date Time Checker to check if the give dateTime is selectable */ dateTimeChecker: (dateTime: T) => boolean; constructor(); protected getValidDate(obj: unknown): T | null; static ɵfac: i0.ɵɵFactoryDeclaration<OwlDateTime<any>, never>; static ɵdir: i0.ɵɵDirectiveDeclaration<OwlDateTime<any>, never, never, { "showSecondsTimer": { "alias": "showSecondsTimer"; "required": false; }; "hour12Timer": { "alias": "hour12Timer"; "required": false; }; "startView": { "alias": "startView"; "required": false; }; "yearOnly": { "alias": "yearOnly"; "required": false; }; "multiyearOnly": { "alias": "multiyearOnly"; "required": false; }; "stepHour": { "alias": "stepHour"; "required": false; }; "stepMinute": { "alias": "stepMinute"; "required": false; }; "stepSecond": { "alias": "stepSecond"; "required": false; }; "firstDayOfWeek": { "alias": "firstDayOfWeek"; "required": false; }; "hideOtherMonths": { "alias": "hideOtherMonths"; "required": false; }; }, {}, never, never, true, never>; static ngAcceptInputType_showSecondsTimer: unknown; static ngAcceptInputType_hour12Timer: unknown; static ngAcceptInputType_stepHour: unknown; static ngAcceptInputType_stepMinute: unknown; static ngAcceptInputType_stepSecond: unknown; static ngAcceptInputType_firstDayOfWeek: unknown; static ngAcceptInputType_hideOtherMonths: unknown; } declare class CalendarCell { value: number; displayValue: string; ariaLabel: string; enabled: boolean; out: boolean; cellClass: string; constructor(value: number, displayValue: string, ariaLabel: string, enabled: boolean, out?: boolean, cellClass?: string); } declare class OwlCalendarBodyComponent { private readonly elmRef; private readonly ngZone; /** * The cell number of the active cell in the table. */ activeCell: number; /** * The cells to display in the table. */ rows: Array<Array<CalendarCell>>; /** * The number of columns in the table. */ numCols: number; /** * The ratio (width / height) to use for the cells in the table. */ cellRatio: number; /** * The value in the table that corresponds to today. */ todayValue: number; /** * The value in the table that is currently selected. */ selectedValues: Array<number>; /** * Current picker select mode */ selectMode: SelectMode; /** * Emit when a calendar cell is selected */ readonly selectCell: i0.OutputEmitterRef<CalendarCell>; protected handleSelect(cell: CalendarCell): void; protected get isInSingleMode(): boolean; protected get isInRangeMode(): boolean; isActiveCell(rowIndex: number, colIndex: number): boolean; /** * Check if the cell is selected */ isSelected(value: number): boolean; /** * Check if the cell in the range */ isInRange(value: number): boolean; /** * Check if the cell is the range from */ isRangeFrom(value: number): boolean; /** * Check if the cell is the range to */ isRangeTo(value: number): boolean; /** * Focus to a active cell */ focusActiveCell(): void; static ɵfac: i0.ɵɵFactoryDeclaration<OwlCalendarBodyComponent, never>; static ɵcmp: i0.ɵɵComponentDeclaration<OwlCalendarBodyComponent, "[owl-date-time-calendar-body]", ["owlDateTimeCalendarBody"], { "activeCell": { "alias": "activeCell"; "required": false; }; "rows": { "alias": "rows"; "required": false; }; "numCols": { "alias": "numCols"; "required": false; }; "cellRatio": { "alias": "cellRatio"; "required": false; }; "todayValue": { "alias": "todayValue"; "required": false; }; "selectedValues": { "alias": "selectedValues"; "required": false; }; "selectMode": { "alias": "selectMode"; "required": false; }; }, { "selectCell": "selectCell"; }, never, never, true, never>; } declare class OwlCalendarComponent<T> implements AfterContentInit, AfterViewChecked { private readonly elmRef; private readonly pickerIntl; private readonly ngZone; private readonly cdRef; private readonly dateTimeAdapter; private readonly dateTimeFormats; protected readonly DateView: { readonly MONTH: "month"; readonly YEAR: "year"; readonly MULTI_YEARS: "multi-years"; }; get minDate(): T | null; set minDate(value: T | null); get maxDate(): T | null; set maxDate(value: T | null); get pickerMoment(): T; set pickerMoment(value: T); get selected(): T | null; set selected(value: T | null); get selecteds(): Array<T>; set selecteds(values: Array<T>); get periodButtonText(): string; get periodButtonLabel(): string; get todayButtonLabel(): string; get prevButtonLabel(): string; get nextButtonLabel(): string; get currentView(): DateViewType; set currentView(view: DateViewType); get isInSingleMode(): boolean; get isInRangeMode(): boolean; get showControlArrows(): boolean; get isMonthView(): boolean; get isTodayAllowed(): boolean; /** * Date filter for the month and year view */ dateFilter: (date: T) => boolean; /** * Set the first day of week */ firstDayOfWeek: number; /** The minimum selectable date. */ private _minDate; /** The maximum selectable date. */ private _maxDate; /** The current picker moment */ private _pickerMoment; selectMode: SelectMode; /** The currently selected moment. */ private _selected; private _selecteds; /** * The view that the calendar should start in. */ startView: DateViewType; /** * Whether to should only the year and multi-year views. */ yearOnly: boolean; /** * Whether to should only the multi-year view. */ multiyearOnly: boolean; /** * Whether to hide dates in other months at the start or end of the current month. */ hideOtherMonths: boolean; /** * Flag to show today button to jump to today's date. Defaults to `false`. */ showTodayButton: boolean; /** * Emits when the currently picker moment changes. */ readonly pickerMomentChange: i0.OutputEmitterRef<T>; /** * Emits when the selected date changes. */ readonly dateClicked: i0.OutputEmitterRef<T>; /** * Emits when the currently selected date changes. */ readonly selectedChange: i0.OutputEmitterRef<T>; /** * Emits when any date is selected. */ readonly userSelection: i0.OutputEmitterRef<void>; /** * Emits the selected year. This doesn't imply a change on the selected date */ readonly yearSelected: i0.OutputEmitterRef<T>; /** * Emits the selected month. This doesn't imply a change on the selected date */ readonly monthSelected: i0.OutputEmitterRef<T>; private _currentView; constructor(); /** * Used for scheduling that focus should be moved to the active cell on the next tick. * We need to schedule it, rather than do it immediately, because we have to wait * for Angular to re-evaluate the view children. */ private moveFocusOnNextTick; /** * Date filter for the month and year view */ dateFilterForViews: (date: T | null) => boolean; ngAfterContentInit(): void; ngAfterViewChecked(): void; /** * Toggle between month view and year view */ toggleViews(): void; /** * Handles user clicks on the previous button. */ previousClicked(): void; /** * Handles user clicks on the next button. */ nextClicked(): void; jumpToToday(): void; dateSelected(date: T): void; /** * Change the pickerMoment value and switch to a specific view */ goToDateInView(date: T, view: DateViewType): void; /** * Change the pickerMoment value */ handlePickerMomentChange(date: T): void; userSelected(): void; /** * Whether the previous period button is enabled. */ prevButtonEnabled(): boolean; /** * Whether the next period button is enabled. */ nextButtonEnabled(): boolean; /** * Focus to the host element */ focusActiveCell(): void; selectYearInMultiYearView(normalizedYear: T): void; selectMonthInYearView(normalizedMonth: T): void; /** * Whether the two dates represent the same view in the current view mode (month or year). */ private isSameView; /** * Get a valid date object */ private getValidDate; static ɵfac: i0.ɵɵFactoryDeclaration<OwlCalendarComponent<any>, never>; static ɵcmp: i0.ɵɵComponentDeclaration<OwlCalendarComponent<any>, "owl-date-time-calendar", ["owlDateTimeCalendar"], { "minDate": { "alias": "minDate"; "required": false; }; "maxDate": { "alias": "maxDate"; "required": false; }; "pickerMoment": { "alias": "pickerMoment"; "required": false; }; "selected": { "alias": "selected"; "required": false; }; "selecteds": { "alias": "selecteds"; "required": false; }; "dateFilter": { "alias": "dateFilter"; "required": false; }; "firstDayOfWeek": { "alias": "firstDayOfWeek"; "required": false; }; "selectMode": { "alias": "selectMode"; "required": false; }; "startView": { "alias": "startView"; "required": false; }; "yearOnly": { "alias": "yearOnly"; "required": false; }; "multiyearOnly": { "alias": "multiyearOnly"; "required": false; }; "hideOtherMonths": { "alias": "hideOtherMonths"; "required": false; }; "showTodayButton": { "alias": "showTodayButton"; "required": false; }; }, { "pickerMomentChange": "pickerMomentChange"; "dateClicked": "dateClicked"; "selectedChange": "selectedChange"; "userSelection": "userSelection"; "yearSelected": "yearSelected"; "monthSelected": "monthSelected"; }, never, never, true, never>; } declare class OwlTimerComponent<T> { private readonly ngZone; private readonly elmRef; private readonly pickerIntl; private readonly cdRef; private readonly dateTimeAdapter; /** The current picker moment */ private _pickerMoment; get pickerMoment(): T; set pickerMoment(value: T); /** The minimum selectable date time. */ private _minDateTime; get minDateTime(): T | null; set minDateTime(value: T | null); /** The maximum selectable date time. */ private _maxDateTime; get maxDateTime(): T | null; set maxDateTime(value: T | null); private isPM; /** * Whether to show the second's timer */ readonly showSecondsTimer: i0.InputSignal<boolean>; /** * Whether the timer is in hour12 format */ readonly hour12Timer: i0.InputSignal<boolean>; /** * Hours to change per step */ readonly stepHour: i0.InputSignal<number>; /** * Minutes to change per step */ readonly stepMinute: i0.InputSignal<number>; /** * Seconds to change per step */ readonly stepSecond: i0.InputSignal<number>; readonly selectedChange: i0.OutputEmitterRef<T>; protected get hourValue(): number; /** * The value would be displayed in hourBox. * We need this because the value displayed in hourBox it not * the same as the hourValue when the timer is in hour12Timer mode. */ protected get hourBoxValue(): number; protected get minuteValue(): number; protected get secondValue(): number; protected get upHourButtonLabel(): string; protected get downHourButtonLabel(): string; protected get upMinuteButtonLabel(): string; protected get downMinuteButtonLabel(): string; protected get upSecondButtonLabel(): string; protected get downSecondButtonLabel(): string; protected get hour12ButtonLabel(): string; /** * Focus to the host element */ focus(): void; /** * Set the hour value via typing into timer box input * We need this to handle the hour value when the timer is in hour12 mode */ setHourValueViaInput(hours: number): void; setHourValue(hours: number): void; setMinuteValue(minutes: number): void; setSecondValue(seconds: number): void; setMeridiem(event: Event): void; /** * Check if the up hour button is enabled */ upHourEnabled(): boolean; /** * Check if the down hour button is enabled */ downHourEnabled(): boolean; /** * Check if the up minute button is enabled */ upMinuteEnabled(): boolean; /** * Check if the down minute button is enabled */ downMinuteEnabled(): boolean; /** * Check if the up second button is enabled */ upSecondEnabled(): boolean; /** * Check if the down second button is enabled */ downSecondEnabled(): boolean; /** * PickerMoment's hour value +/- certain amount and compare it to the give date * 1 is after the comparedDate * -1 is before the comparedDate * 0 is equal the comparedDate */ private compareHours; /** * PickerMoment's minute value +/- certain amount and compare it to the give date * 1 is after the comparedDate * -1 is before the comparedDate * 0 is equal the comparedDate */ private compareMinutes; /** * PickerMoment's second value +/- certain amount and compare it to the give date * 1 is after the comparedDate * -1 is before the comparedDate * 0 is equal the comparedDate */ private compareSeconds; /** * Get a valid date object */ private getValidDate; static ɵfac: i0.ɵɵFactoryDeclaration<OwlTimerComponent<any>, never>; static ɵcmp: i0.ɵɵComponentDeclaration<OwlTimerComponent<any>, "owl-date-time-timer", ["owlDateTimeTimer"], { "pickerMoment": { "alias": "pickerMoment"; "required": false; }; "minDateTime": { "alias": "minDateTime"; "required": false; }; "maxDateTime": { "alias": "maxDateTime"; "required": false; }; "showSecondsTimer": { "alias": "showSecondsTimer"; "required": false; "isSignal": true; }; "hour12Timer": { "alias": "hour12Timer"; "required": false; "isSignal": true; }; "stepHour": { "alias": "stepHour"; "required": false; "isSignal": true; }; "stepMinute": { "alias": "stepMinute"; "required": false; "isSignal": true; }; "stepSecond": { "alias": "stepSecond"; "required": false; "isSignal": true; }; }, { "selectedChange": "selectedChange"; }, never, never, true, never>; } declare class OwlDateTimeContainerComponent<T> implements OnInit, AfterContentInit { private readonly cdRef; private readonly elmRef; private readonly pickerIntl; private readonly dateTimeAdapter; protected calendar: OwlCalendarComponent<T>; protected timer: OwlTimerComponent<T>; picker: OwlDateTime<T>; activeSelectedIndex: number; private retainStartTime; private retainEndTime; showTodayButton: boolean; /** * The current picker moment. This determines which time period is shown and which date is * highlighted when using keyboard navigation. */ private _clamPickerMoment; get pickerMoment(): T; set pickerMoment(value: T); get pickerType(): PickerType; /** * The range 'from' label */ get fromLabel(): string; /** * The range 'to' label */ get toLabel(): string; /** * The range 'from' formatted value */ get fromFormattedValue(): string; /** * The range 'to' formatted value */ get toFormattedValue(): string; get containerElm(): HTMLElement; ngOnInit(): void; ngAfterContentInit(): void; dateSelected(date: T): void; timeSelected(time: T): void; /** * Handle click on inform radio group */ handleClickOnInfoGroup(event: Event, index: number): void; /** * Handle click on inform radio group */ handleKeydownOnInfoGroup(event: KeyboardEvent, next: HTMLElement, index: number): void; /** * Set the value of activeSelectedIndex */ private setActiveSelectedIndex; private initPicker; /** * Select calendar date in single mode, * it returns null when date is not selected. */ private dateSelectedInSingleMode; /** * Select dates in range Mode */ private dateSelectedInRangeMode; /** * Update the given calendar date's time and check if it is valid * Because the calendar date has 00:00:00 as default time, if the picker type is 'both', * we need to update the given calendar date's time before selecting it. * if it is valid, return the updated dateTime * if it is not valid, return null */ private updateAndCheckCalendarDate; static ɵfac: i0.ɵɵFactoryDeclaration<OwlDateTimeContainerComponent<any>, never>; static ɵcmp: i0.ɵɵComponentDeclaration<OwlDateTimeContainerComponent<any>, "owl-date-time-container", ["owlDateTimeContainer"], { "showTodayButton": { "alias": "showTodayButton"; "required": false; }; }, {}, never, never, true, never>; } declare class OwlDateTimeInlineComponent<T> extends OwlDateTime<T> implements OnInit, ControlValueAccessor { #private; protected readonly container: i0.Signal<OwlDateTimeContainerComponent<any>>; /** * Set the type of the dateTime picker * 'both' -- show both calendar and timer * 'calendar' -- show only calendar * 'timer' -- show only timer */ pickerType: PickerType; disabled: boolean; private _selectMode; get selectMode(): SelectMode; set selectMode(mode: SelectMode); /** The date to open the calendar to initially. */ private _startAt; get startAt(): T | null; set startAt(date: T | null); /** The date to open for range calendar. */ private _endAt; get endAt(): T | null; set endAt(date: T | null); private _dateTimeFilter; get dateTimeFilter(): (date: T | null) => boolean; set dateTimeFilter(filter: (date: T | null) => boolean); /** The minimum valid date. */ private _min; get minDateTime(): T | null; set minDateTime(value: T | null); /** The maximum valid date. */ private _max; get maxDateTime(): T | null; set maxDateTime(value: T | null); private _value; get value(): T | null; set value(value: T | null); private _values; get values(): Array<T>; set values(values: Array<T>); /** * Limit to the amount of days that can be selected at once. */ rangeLimit: number | null; /** * Flag to show today button to jump to today's date. Defaults to `false`. */ showTodayButton: boolean; /** * Variable to hold the old max date time value for when we override it with rangeLimit */ private _initialMaxDateTime; /** * Emits selected year in multi-year view * This doesn't imply a change on the selected date. */ readonly yearSelected: i0.OutputEmitterRef<T>; /** * Emits selected month in year view * This doesn't imply a change on the selected date. */ readonly monthSelected: i0.OutputEmitterRef<T>; /** * Emits selected date */ readonly dateSelected: i0.OutputEmitterRef<T>; private _selected; get selected(): T | null; set selected(value: T | null); private _selecteds; get selecteds(): Array<T>; set selecteds(values: Array<T>); readonly opened = true; get isInSingleMode(): boolean; get isInRangeMode(): boolean; private onModelChange; private onModelTouched; ngOnInit(): void; writeValue(value: unknown): void; registerOnChange(fn: (v: T | Array<T>) => void): void; registerOnTouched(fn: () => void): void; select(date: Array<T> | T): void; /** * Emits the selected year in multi-year view */ selectYear(normalizedYear: T): void; /** * Emits selected month in year view */ selectMonth(normalizedMonth: T): void; /** * Emits the selected date */ selectDate(normalizedDate: T): void; static ɵfac: i0.ɵɵFactoryDeclaration<OwlDateTimeInlineComponent<any>, never>; static ɵcmp: i0.ɵɵComponentDeclaration<OwlDateTimeInlineComponent<any>, "owl-date-time-inline", never, { "pickerType": { "alias": "pickerType"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "selectMode": { "alias": "selectMode"; "required": false; }; "startAt": { "alias": "startAt"; "required": false; }; "endAt": { "alias": "endAt"; "required": false; }; "dateTimeFilter": { "alias": "owlDateTimeFilter"; "required": false; }; "minDateTime": { "alias": "min"; "required": false; }; "maxDateTime": { "alias": "max"; "required": false; }; "value": { "alias": "value"; "required": false; }; "values": { "alias": "values"; "required": false; }; "rangeLimit": { "alias": "rangeLimit"; "required": false; }; "showTodayButton": { "alias": "showTodayButton"; "required": false; }; }, { "yearSelected": "yearSelected"; "monthSelected": "monthSelected"; "dateSelected": "dateSelected"; }, never, never, true, never>; static ngAcceptInputType_disabled: unknown; static ngAcceptInputType_showTodayButton: unknown; } declare class OwlMonthViewComponent<T> implements OnInit, AfterContentInit, OnDestroy { private readonly cdRef; private readonly dateTimeAdapter; private readonly dateTimeFormats; /** * Whether to hide dates in other months at the start or end of the current month. */ hideOtherMonths: boolean; private isDefaultFirstDayOfWeek; /** * Define the first day of a week * Sunday: 0 - Saturday: 6 */ private _firstDayOfWeek; get firstDayOfWeek(): number; set firstDayOfWeek(val: number); /** * The select mode of the picker; */ private _selectMode; get selectMode(): SelectMode; set selectMode(val: SelectMode); /** The currently selected date. */ private _selected; get selected(): T | null; set selected(value: T | null); private _selecteds; get selecteds(): Array<T>; set selecteds(values: Array<T>); private _pickerMoment; get pickerMoment(): T; set pickerMoment(value: T); /** * A function used to filter which dates are selectable */ private _dateFilter; get dateFilter(): (date: T) => boolean; set dateFilter(filter: (date: T) => boolean); /** The minimum selectable date. */ private _minDate; get minDate(): T | null; set minDate(value: T | null); /** The maximum selectable date. */ private _maxDate; get maxDate(): T | null; set maxDate(value: T | null); private _weekdays; get weekdays(): Array<Record<Intl.DateTimeFormatOptions['weekday'], string>>; private _days; get days(): Array<Array<CalendarCell>>; get activeCell(): number; get isInSingleMode(): boolean; get isInRangeMode(): boolean; private firstDateOfMonth; private localeSub; private initiated; private dateNames; /** * The date of the month that today falls on. */ todayDate: number | null; /** * An array to hold all selectedDates' value * the value is the day number in current month */ selectedDates: Array<number>; firstRowOffset: number; /** * Callback to invoke when a new date is selected */ readonly selectedChange: i0.OutputEmitterRef<T>; /** * Callback to invoke when any date is selected. */ readonly userSelection: i0.OutputEmitterRef<void>; /** Emits when any date is activated. */ readonly pickerMomentChange: i0.OutputEmitterRef<T>; /** The body of calendar table */ calendarBodyElm: OwlCalendarBodyComponent; ngOnInit(): void; ngAfterContentInit(): void; ngOnDestroy(): void; /** * Handle a calendarCell selected */ selectCalendarCell(cell: CalendarCell): void; /** * Handle a new date selected */ private selectDate; /** * Handle keydown event on calendar body */ handleCalendarKeydown(event: KeyboardEvent): void; /** * Generate the calendar weekdays array */ private generateWeekDays; /** * Generate the calendar days array */ private generateCalendar; private updateFirstDayOfWeek; /** * Creates CalendarCell for days. */ private createDateCell; /** * Check if the date is valid */ private isDateEnabled; /** * Get a valid date object */ private getValidDate; /** * Check if the give dates are none-null and in the same month */ isSameMonth(dateLeft: T, dateRight: T): boolean; /** * Set the selectedDates value. * In single mode, it has only one value which represent the selected date * In range mode, it would has two values, one for the fromValue and the other for the toValue */ private setSelectedDates; private focusActiveCell; static ɵfac: i0.ɵɵFactoryDeclaration<OwlMonthViewComponent<any>, never>; static ɵcmp: i0.ɵɵComponentDeclaration<OwlMonthViewComponent<any>, "owl-date-time-month-view", ["owlYearView"], { "hideOtherMonths": { "alias": "hideOtherMonths"; "required": false; }; "firstDayOfWeek": { "alias": "firstDayOfWeek"; "required": false; }; "selectMode": { "alias": "selectMode"; "required": false; }; "selected": { "alias": "selected"; "required": false; }; "selecteds": { "alias": "selecteds"; "required": false; }; "pickerMoment": { "alias": "pickerMoment"; "required": false; }; "dateFilter": { "alias": "dateFilter"; "required": false; }; "minDate": { "alias": "minDate"; "required": false; }; "maxDate": { "alias": "maxDate"; "required": false; }; }, { "selectedChange": "selectedChange"; "userSelection": "userSelection"; "pickerMomentChange": "pickerMomentChange"; }, never, never, true, never>; } declare class OwlMultiYearViewComponent<T> implements AfterContentInit { private readonly cdRef; private readonly pickerIntl; private readonly dateTimeAdapter; private readonly options; /** * The select mode of the picker; */ private _selectMode; get selectMode(): SelectMode; set selectMode(val: SelectMode); /** The currently selected date. */ private _selected; get selected(): T | null; set selected(value: T | null); private _selecteds; get selecteds(): Array<T>; set selecteds(values: Array<T>); private _pickerMoment; get pickerMoment(): T | null; set pickerMoment(value: T); /** * A function used to filter which dates are selectable */ private _dateFilter; get dateFilter(): (date: T) => boolean; set dateFilter(filter: (date: T) => boolean); /** The minimum selectable date. */ private _minDate; get minDate(): T | null; set minDate(value: T | null); /** The maximum selectable date. */ private _maxDate; get maxDate(): T | null; set maxDate(value: T | null); private _todayYear; protected get todayYear(): number; private _years; protected get years(): Array<Array<CalendarCell>>; private _selectedYears; protected get selectedYears(): Array<number>; private initiated; protected get isInSingleMode(): boolean; protected get isInRangeMode(): boolean; protected get activeCell(): number | undefined; protected get tableHeader(): string | undefined; protected get prevButtonLabel(): string; protected get nextButtonLabel(): string; /** * Callback to invoke when a new month is selected */ readonly changeYear: i0.OutputEmitterRef<T>; /** * Emits the selected year. This doesn't imply a change on the selected date */ readonly yearSelected: i0.OutputEmitterRef<T>; /** Emits when any date is activated. */ readonly pickerMomentChange: i0.OutputEmitterRef<T>; /** Emits when use keyboard enter to select a calendar cell */ readonly keyboardEnter: i0.OutputEmitterRef<void>; /** The body of calendar table */ protected readonly calendarBodyElm: i0.Signal<OwlCalendarBodyComponent>; ngAfterContentInit(): void; /** * Handle a calendarCell selected */ selectCalendarCell(cell: CalendarCell): void; private selectYear; /** * Generate the previous year list */ prevYearList(event: Event): void; /** * Generate the next year list */ nextYearList(event: Event): void; generateYearList(): void; /** Whether the previous period button is enabled. */ previousEnabled(): boolean; /** Whether the next period button is enabled. */ nextEnabled(): boolean; handleCalendarKeydown(event: KeyboardEvent): void; /** * Creates an CalendarCell for the given year. */ private createYearCell; private setSelectedYears; /** Whether the given year is enabled. */ private isYearEnabled; private isSameYearList; /** * Get a valid date object */ private getValidDate; private focusActiveCell; static ɵfac: i0.ɵɵFactoryDeclaration<OwlMultiYearViewComponent<any>, never>; static ɵcmp: i0.ɵɵComponentDeclaration<OwlMultiYearViewComponent<any>, "owl-date-time-multi-year-view", never, { "selectMode": { "alias": "selectMode"; "required": false; }; "selected": { "alias": "selected"; "required": false; }; "selecteds": { "alias": "selecteds"; "required": false; }; "pickerMoment": { "alias": "pickerMoment"; "required": false; }; "dateFilter": { "alias": "dateFilter"; "required": false; }; "minDate": { "alias": "minDate"; "required": false; }; "maxDate": { "alias": "maxDate"; "required": false; }; }, { "changeYear": "changeYear"; "yearSelected": "yearSelected"; "pickerMomentChange": "pickerMomentChange"; "keyboardEnter": "keyboardEnter"; }, never, never, true, never>; } declare class OwlTimerBoxComponent implements OnInit, OnDestroy { showDivider: boolean; upBtnAriaLabel: string; upBtnDisabled: boolean; downBtnAriaLabel: string; downBtnDisabled: boolean; /** * Value would be displayed in the box * If it is null, the box would display [value] */ boxValue: number; value: number; min: number; max: number; step: number; inputLabel: string; readonly valueChange: i0.OutputEmitterRef<number>; readonly inputChange: i0.OutputEmitterRef<number>; private inputStream; private inputStreamSub; private hasFocus; protected get displayValue(): string; private valueInput; private onValueInputMouseWheelBind; ngOnInit(): void; ngOnDestroy(): void; upBtnClicked(): void; downBtnClicked(): void; handleInputChange(val: string): void; focusIn(): void; focusOut(value: string): void; private updateValue; private updateValueViaInput; private onValueInputMouseWheel; private bindValueInputMouseWheel; private unbindValueInputMouseWheel; static ɵfac: i0.ɵɵFactoryDeclaration<OwlTimerBoxComponent, never>; static ɵcmp: i0.ɵɵComponentDeclaration<OwlTimerBoxComponent, "owl-date-time-timer-box", ["owlDateTimeTimerBox"], { "showDivider": { "alias": "showDivider"; "required": false; }; "upBtnAriaLabel": { "alias": "upBtnAriaLabel"; "required": false; }; "upBtnDisabled": { "alias": "upBtnDisabled"; "required": false; }; "downBtnAriaLabel": { "alias": "downBtnAriaLabel"; "required": false; }; "downBtnDisabled": { "alias": "downBtnDisabled"; "required": false; }; "boxValue": { "alias": "boxValue"; "required": false; }; "value": { "alias": "value"; "required": false; }; "min": { "alias": "min"; "required": false; }; "max": { "alias": "max"; "required": false; }; "step": { "alias": "step"; "required": false; }; "inputLabel": { "alias": "inputLabel"; "required": false; }; }, { "valueChange": "valueChange"; "inputChange": "inputChange"; }, never, never, true, never>; } declare class OwlYearViewComponent<T> implements OnInit, AfterContentInit, OnDestroy { private readonly cdRef; private readonly dateTimeAdapter; private readonly dateTimeFormats; /** * The select mode of the picker; */ private _selectMode; get selectMode(): SelectMode; set selectMode(val: SelectMode); /** The currently selected date. */ private _selected; get selected(): T | null; set selected(value: T | null); private _selecteds; get selecteds(): Array<T>; set selecteds(values: Array<T>); private _pickerMoment; get pickerMoment(): T | null; set pickerMoment(value: T); /** * A function used to filter which dates are selectable */ private _dateFilter; get dateFilter(): (date: T) => boolean; set dateFilter(filter: (date: T) => boolean); /** The minimum selectable date. */ private _minDate; get minDate(): T | null; set minDate(value: T | null); /** The maximum selectable date. */ private _maxDate; get maxDate(): T | null; set maxDate(value: T | null); private readonly monthNames; private _months; protected get months(): Array<Array<CalendarCell>>; protected get activeCell(): number; protected get isInSingleMode(): boolean; protected get isInRangeMode(): boolean; private localeSub; private initiated; todayMonth: number | null; /** * An array to hold all selectedDates' month value * the value is the month number in current year */ selectedMonths: Array<number>; /** * Callback to invoke when a new month is selected */ readonly changeMonth: i0.OutputEmitterRef<T>; /** * Emits the selected year. This doesn't imply a change on the selected date */ readonly monthSelected: i0.OutputEmitterRef<T>; /** Emits when any date is activated. */ readonly pickerMomentChange: i0.OutputEmitterRef<T>; /** Emits when use keyboard enter to select a calendar cell */ readonly keyboardEnter: i0.OutputEmitterRef<void>; /** The body of calendar table */ protected calendarBodyElm: OwlCalendarBodyComponent; ngOnInit(): void; ngAfterContentInit(): void; ngOnDestroy(): void; /** * Handle a calendarCell selected */ selectCalendarCell(cell: CalendarCell): void; /** * Handle a new month selected */ private selectMonth; /** * Handle keydown event on calendar body */ handleCalendarKeydown(event: KeyboardEvent): void; /** * Generate the calendar month list */ private generateMonthList; /** * Creates an CalendarCell for the given month. */ private createMonthCell; /** * Check if the given month is enable */ private isMonthEnabled; /** * Gets the month in this year that the given Date falls on. * Returns null if the given Date is in another year. */ private getMonthInCurrentYear; /** * Set the selectedMonths value * In single mode, it has only one value which represent the month the selected date in * In range mode, it would has two values, one for the month the fromValue in and the other for the month the toValue in */ private setSelectedMonths; /** * Check the given dates are in the same year */ private hasSameYear; /** * Get a valid date object */ private getValidDate; private focusActiveCell; static ɵfac: i0.ɵɵFactoryDeclaration<OwlYearViewComponent<any>, never>; static ɵcmp: i0.ɵɵComponentDeclaration<OwlYearViewComponent<any>, "owl-date-time-year-view", ["owlMonthView"], { "selectMode": { "alias": "selectMode"; "required": false; }; "selected": { "alias": "selected"; "required": false; }; "selecteds": { "alias": "selecteds"; "required": false; }; "pickerMoment": { "alias": "pickerMoment"; "required": false; }; "dateFilter": { "alias": "dateFilter"; "required": false; }; "minDate": { "alias": "minDate"; "required": false; }; "maxDate": { "alias": "maxDate"; "required": false; }; }, { "changeMonth": "changeMonth"; "monthSelected": "monthSelected"; "pickerMomentChange": "pickerMomentChange"; "keyboardEnter": "keyboardEnter"; }, never, never, true, never>; } declare class OwlDateTimeModule { static ɵfac: i0.ɵɵFactoryDeclaration<OwlDateTimeModule, never>; static ɵmod: i0.ɵɵNgModuleDeclaration<OwlDateTimeModule, never, [typeof OwlCalendarBodyComponent, typeof OwlCalendarComponent, typeof OwlDateTimeContainerComponent, typeof OwlDateTimeInlineComponent, typeof OwlMonthViewComponent, typeof OwlMultiYearViewComponent, typeof OwlTimerBoxComponent, typeof OwlTimerComponent, typeof OwlYearViewComponent], [typeof OwlCalendarComponent, typeof OwlDateTimeInlineComponent, typeof OwlMonthViewComponent, typeof OwlMultiYearViewComponent, typeof OwlTimerComponent, typeof OwlYearViewComponent]>; static ɵinj: i0.ɵɵInjectorDeclaration<OwlDateTimeModule>; } declare class OwlDateTimeIntl { /** * Stream that emits whenever the labels here are changed. Use this to notify * components if the labels have changed after initialization. */ readonly changes: Subject<void>; /** A label for the up second button (used by screen readers). */ upSecondLabel: string; /** A label for the down second button (used by screen readers). */ downSecondLabel: string; /** A label for the up minute button (used by screen readers). */ upMinuteLabel: string; /** A label for the down minute button (used by screen readers). */ downMinuteLabel: string; /** A label for the up hour button (used by screen readers). */ upHourLabel: string; /** A label for the down hour button (used by screen readers). */ downHourLabel: string; /** A label for the previous month button (used by screen readers). */ prevMonthLabel: string; /** A label for the next month button (used by screen readers). */ nextMonthLabel: string; /** A label for the previous year button (used by screen readers). */ prevYearLabel: string; /** A label for the next year button (used by screen readers). */ nextYearLabel: string; /** A label for the previous multi-year button (used by screen readers). */ prevMultiYearLabel: string; /** A label for the next multi-year button (used by screen readers). */ nextMultiYearLabel: string; /** A label for the 'switch to month view' button (used by screen readers). */ switchToMonthViewLabel: string; /** A label for the 'switch to year view' button (used by screen readers). */ switchToMultiYearViewLabel: string; /** A label for the range 'from' in picker info */ rangeFromLabel: string; /** A label for the range 'to' in picker info */ rangeToLabel: string; /** A label for the hour12 button (AM) */ hour12AMLabel: string; /** A label for the hour12 button (PM) */ hour12PMLabel: string; /** A label for the today button */ todayButtonLabel: string; static ɵfac: i0.ɵɵFactoryDeclaration<OwlDateTimeIntl, neve