UNPKG

igniteui-angular

Version:

Ignite UI for Angular is a dependency-free Angular toolkit for building modern web apps

291 lines (290 loc) • 6.75 kB
import { ElementRef, AfterViewInit } from '@angular/core'; import { ICalendarDate } from './calendar'; import { IgxMonthPickerBase } from './month-picker-base'; import { IgxMonthsViewComponent } from './months-view/months-view.component'; import { IgxYearsViewComponent } from './years-view/years-view.component'; import { IgxDaysViewComponent } from './days-view/days-view.component'; /** * **Ignite UI for Angular Calendar** - * [Documentation](https://www.infragistics.com/products/ignite-ui-angular/angular/components/calendar.html) * * The Ignite UI Calendar provides an easy way to display a calendar and allow users to select dates using single, multiple * or range selection. * * Example: * ```html * <igx-calendar selection="range"></igx-calendar> * ``` */ export declare class IgxCalendarComponent extends IgxMonthPickerBase implements AfterViewInit { /** * Sets/gets the `id` of the calendar. * If not set, the `id` will have value `"igx-calendar-0"`. * ```html * <igx-calendar id = "my-first-calendar"></igx-calendar> * ``` * ```typescript * let calendarId = this.calendar.id; * ``` * @memberof IgxCalendarComponent */ id: string; hasHeader: boolean; /** * Sets/gets whether the calendar header will be in vertical position. * Default value is `false`. * ```html * <igx-calendar [vertical] = "true"></igx-calendar> * ``` * ```typescript * let isVertical = this.calendar.vertical; * ``` */ vertical: boolean; /** * The default `tabindex` attribute for the component. * * @hidden */ tabindex: number; /** * The default aria role attribute for the component. * * @hidden */ role: string; /** * The default aria lebelled by attribute for the component. * * @hidden */ ariaLabelledBy: string; /** * The default css class applied to the component. * * @hidden */ readonly styleVerticalClass: boolean; /** * The default css class applied to the component. * * @hidden */ styleClass: boolean; /** * @hidden */ monthsView: IgxMonthsViewComponent; /** * @hidden */ monthsBtn: ElementRef; /** * @hidden */ dacadeView: IgxYearsViewComponent; /** * @hidden */ daysView: IgxDaysViewComponent; /** * @hidden */ prevMonthBtn: ElementRef; /** * @hidden */ nextMonthBtn: ElementRef; /** * @hidden */ readonly isYearView: boolean; /** * @hidden */ /** * @hidden */ monthAction: string; /** * Gets the header template. * ```typescript * let headerTemplate = this.calendar.headerTeamplate; * ``` * @memberof IgxCalendarComponent */ /** * Sets the header template. * ```html * <igx-calendar headerTemplateDirective = "igxCalendarHeader"></igx-calendar> * ``` * @memberof IgxCalendarComponent */ headerTemplate: any; /** * Gets the subheader template. * ```typescript * let subheaderTemplate = this.calendar.subheaderTemplate; * ``` */ /** * Sets the subheader template. * ```html * <igx-calendar subheaderTemplate = "igxCalendarSubheader"></igx-calendar> * ``` * @memberof IgxCalendarComponent */ subheaderTemplate: any; /** * Gets the context for the template marked with the `igxCalendarHeader` directive. * ```typescript * let headerContext = this.calendar.headerContext; * ``` */ readonly headerContext: { $implicit: { date: Date; full: string; monthView: () => void; yearView: () => void; }; }; /** * Gets the context for the template marked with either `igxCalendarSubHeaderMonth` * or `igxCalendarSubHeaderYear` directive. * ```typescript * let context = this.calendar.context; * ``` */ readonly context: { $implicit: { date: Date; full: string; monthView: () => void; yearView: () => void; }; }; /** * @hidden */ readonly headerDate: Date; /** * @hidden */ private headerTemplateDirective; /** * @hidden */ private subheaderTemplateDirective; /** *@hidden */ private _monthAction; /** *@hidden */ ngAfterViewInit(): void; /** * Returns the locale representation of the month in the month view if enabled, * otherwise returns the default `Date.getMonth()` value. * * @hidden */ formattedMonth(value: Date): string; /** * @hidden */ previousMonth(isKeydownTrigger?: boolean): void; /** * @hidden */ nextMonth(isKeydownTrigger?: boolean): void; /** * @hidden */ startPrevMonthScroll: (isKeydownTrigger?: boolean) => void; /** * @hidden */ startNextMonthScroll: (isKeydownTrigger?: boolean) => void; /** * @hidden */ stopMonthScroll: (event: any) => void; /** * @hidden */ activeViewDecade(): void; /** * @hidden */ activeViewDecadeKB(event: any): void; /** * @hidden */ getFormattedDate(): { weekday: string; monthday: string; }; /** * @hidden */ childClicked(instance: ICalendarDate): void; /** * @hidden */ viewChanged(event: any): void; /** * @hidden */ changeMonth(event: Date): void; /** * @hidden */ activeViewYear(): void; /** * @hidden */ activeViewYearKB(event: any): void; /** * Deselects date(s) (based on the selection type). *```typescript * this.calendar.deselectDate(new Date(`2018-06-12`)); *```` */ deselectDate(value?: Date | Date[]): void; /** * @hidden */ onKeydownPageUp(event: KeyboardEvent): void; /** * @hidden */ onKeydownPageDown(event: KeyboardEvent): void; /** * @hidden */ onKeydownShiftPageUp(event: KeyboardEvent): void; /** * @hidden */ onKeydownShiftPageDown(event: KeyboardEvent): void; /** * @hidden */ onKeydownHome(event: KeyboardEvent): void; /** * @hidden */ onKeydownEnd(event: KeyboardEvent): void; /** * @hidden */ onMouseUp(event: KeyboardEvent): void; /** * Helper method building and returning the context object inside * the calendar templates. * @hidden */ private generateContext; }