@nodro7/angular-mydatepicker
Version:
Angular datepicker
65 lines • 13.3 kB
JavaScript
import { Component, EventEmitter, Input, Output, ViewEncapsulation } from "@angular/core";
import { KeyCode } from "../../enums/key-code.enum";
import { ActiveView } from "../../enums/active-view.enum";
import { UtilService } from "../../services/angular-mydatepicker.util.service";
import { OPTS, MONTHS } from "../../constants/constants";
import * as i0 from "@angular/core";
import * as i1 from "../../services/angular-mydatepicker.util.service";
import * as i2 from "@angular/common";
export class MonthViewComponent {
constructor(utilService) {
this.utilService = utilService;
this.monthCellClicked = new EventEmitter();
this.monthCellKeyDown = new EventEmitter();
this.viewActivated = new EventEmitter();
}
ngOnChanges(changes) {
if (changes.hasOwnProperty(OPTS)) {
this.opts = changes[OPTS].currentValue;
}
if (changes.hasOwnProperty(MONTHS)) {
this.months = changes[MONTHS].currentValue;
}
}
ngAfterViewInit() {
this.viewActivated.emit(ActiveView.Month);
}
onMonthCellClicked(event, cell) {
event.stopPropagation();
if (cell.disabled) {
return;
}
this.monthCellClicked.emit(cell);
}
onMonthCellKeyDown(event, cell) {
const keyCode = this.utilService.getKeyCodeFromEvent(event);
if (keyCode !== KeyCode.tab) {
event.preventDefault();
if (keyCode === KeyCode.enter || keyCode === KeyCode.space) {
this.onMonthCellClicked(event, cell);
}
else if (this.opts.moveFocusByArrowKeys) {
this.monthCellKeyDown.emit(event);
}
}
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: MonthViewComponent, deps: [{ token: i1.UtilService }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.0", type: MonthViewComponent, selector: "lib-month-view", inputs: { opts: "opts", months: "months", viewChanged: "viewChanged" }, outputs: { monthCellClicked: "monthCellClicked", monthCellKeyDown: "monthCellKeyDown", viewActivated: "viewActivated" }, providers: [UtilService], usesOnChanges: true, ngImport: i0, template: "<table class=\"myDpMonthTable\" [ngClass]=\"{'ng-myrtl': opts.rtl, 'myDpFooter': opts.showFooterToday, 'myDpNoFooter': !opts.showFooterToday, 'myDpViewChangeAnimation': opts.viewChangeAnimation && viewChanged}\">\n <tbody>\n <tr *ngFor=\"let mr of months\">\n <td *ngFor=\"let m of mr\"\n id=\"m_{{m.row}}_{{m.col}}\"\n class=\"m_{{m.row}}_{{m.col}} myDpMonthcell\"\n [ngClass]=\"{'myDpSelectedMonth': m.selected, 'myDpDisabled': m.disabled, 'myDpTableSingleMonth': !m.disabled}\"\n [attr.aria-current]=\"m.currMonth ? 'date' : null\"\n [attr.aria-disabled]=\"m.disabled || null\"\n [attr.aria-selected]=\"m.selected || null\"\n [attr.tabindex]=\"!m.disabled ? 0 : -1\"\n (click)=\"onMonthCellClicked($event, m)\"\n (keydown)=\"onMonthCellKeyDown($event, m)\">\n <span class=\"myDpMonthNbr\" *ngIf=\"opts.showMonthNumber\" aria-hidden=\"true\">{{m.nbr}}</span>\n <span class=\"myDpMonthValue\"\n [attr.aria-label]=\"[(m.nbr + '/' + 1 + '/' + m.year | date:'MMMM yyyy')]\"\n [ngClass]=\"{'myDpMarkCurrMonth': m.currMonth && opts.markCurrentMonth}\">{{m.name}}</span>\n </td>\n </tr>\n </tbody>\n</table>\n", dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i2.DatePipe, name: "date" }], encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: MonthViewComponent, decorators: [{
type: Component,
args: [{ selector: "lib-month-view", providers: [UtilService], encapsulation: ViewEncapsulation.None, template: "<table class=\"myDpMonthTable\" [ngClass]=\"{'ng-myrtl': opts.rtl, 'myDpFooter': opts.showFooterToday, 'myDpNoFooter': !opts.showFooterToday, 'myDpViewChangeAnimation': opts.viewChangeAnimation && viewChanged}\">\n <tbody>\n <tr *ngFor=\"let mr of months\">\n <td *ngFor=\"let m of mr\"\n id=\"m_{{m.row}}_{{m.col}}\"\n class=\"m_{{m.row}}_{{m.col}} myDpMonthcell\"\n [ngClass]=\"{'myDpSelectedMonth': m.selected, 'myDpDisabled': m.disabled, 'myDpTableSingleMonth': !m.disabled}\"\n [attr.aria-current]=\"m.currMonth ? 'date' : null\"\n [attr.aria-disabled]=\"m.disabled || null\"\n [attr.aria-selected]=\"m.selected || null\"\n [attr.tabindex]=\"!m.disabled ? 0 : -1\"\n (click)=\"onMonthCellClicked($event, m)\"\n (keydown)=\"onMonthCellKeyDown($event, m)\">\n <span class=\"myDpMonthNbr\" *ngIf=\"opts.showMonthNumber\" aria-hidden=\"true\">{{m.nbr}}</span>\n <span class=\"myDpMonthValue\"\n [attr.aria-label]=\"[(m.nbr + '/' + 1 + '/' + m.year | date:'MMMM yyyy')]\"\n [ngClass]=\"{'myDpMarkCurrMonth': m.currMonth && opts.markCurrentMonth}\">{{m.name}}</span>\n </td>\n </tr>\n </tbody>\n</table>\n" }]
}], ctorParameters: function () { return [{ type: i1.UtilService }]; }, propDecorators: { opts: [{
type: Input
}], months: [{
type: Input
}], viewChanged: [{
type: Input
}], monthCellClicked: [{
type: Output
}], monthCellKeyDown: [{
type: Output
}], viewActivated: [{
type: Output
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibW9udGgtdmlldy5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9hbmd1bGFyLW15ZGF0ZXBpY2tlci9zcmMvbGliL2NvbXBvbmVudHMvbW9udGgtdmlldy9tb250aC12aWV3LmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2FuZ3VsYXItbXlkYXRlcGlja2VyL3NyYy9saWIvY29tcG9uZW50cy9tb250aC12aWV3L21vbnRoLXZpZXcuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFDLFNBQVMsRUFBRSxZQUFZLEVBQUUsS0FBSyxFQUE0QixNQUFNLEVBQWlCLGlCQUFpQixFQUFDLE1BQU0sZUFBZSxDQUFDO0FBR2pJLE9BQU8sRUFBQyxPQUFPLEVBQUMsTUFBTSwyQkFBMkIsQ0FBQztBQUNsRCxPQUFPLEVBQUMsVUFBVSxFQUFDLE1BQU0sOEJBQThCLENBQUM7QUFDeEQsT0FBTyxFQUFDLFdBQVcsRUFBQyxNQUFNLGtEQUFrRCxDQUFDO0FBQzdFLE9BQU8sRUFBQyxJQUFJLEVBQUUsTUFBTSxFQUFDLE1BQU0sMkJBQTJCLENBQUM7Ozs7QUFRdkQsTUFBTSxPQUFPLGtCQUFrQjtJQVM3QixZQUFvQixXQUF3QjtRQUF4QixnQkFBVyxHQUFYLFdBQVcsQ0FBYTtRQUpsQyxxQkFBZ0IsR0FBbUMsSUFBSSxZQUFZLEVBQW9CLENBQUM7UUFDeEYscUJBQWdCLEdBQXNCLElBQUksWUFBWSxFQUFPLENBQUM7UUFDOUQsa0JBQWEsR0FBNkIsSUFBSSxZQUFZLEVBQWMsQ0FBQztJQUVuQyxDQUFDO0lBRWpELFdBQVcsQ0FBQyxPQUFzQjtRQUNoQyxJQUFJLE9BQU8sQ0FBQyxjQUFjLENBQUMsSUFBSSxDQUFDLEVBQUU7WUFDaEMsSUFBSSxDQUFDLElBQUksR0FBRyxPQUFPLENBQUMsSUFBSSxDQUFDLENBQUMsWUFBWSxDQUFDO1NBQ3hDO1FBQ0QsSUFBSSxPQUFPLENBQUMsY0FBYyxDQUFDLE1BQU0sQ0FBQyxFQUFFO1lBQ2xDLElBQUksQ0FBQyxNQUFNLEdBQUcsT0FBTyxDQUFDLE1BQU0sQ0FBQyxDQUFDLFlBQVksQ0FBQztTQUM1QztJQUNILENBQUM7SUFFRCxlQUFlO1FBQ2IsSUFBSSxDQUFDLGFBQWEsQ0FBQyxJQUFJLENBQUMsVUFBVSxDQUFDLEtBQUssQ0FBQyxDQUFDO0lBQzVDLENBQUM7SUFFRCxrQkFBa0IsQ0FBQyxLQUFVLEVBQUUsSUFBc0I7UUFDbkQsS0FBSyxDQUFDLGVBQWUsRUFBRSxDQUFDO1FBRXhCLElBQUksSUFBSSxDQUFDLFFBQVEsRUFBRTtZQUNqQixPQUFPO1NBQ1I7UUFFRCxJQUFJLENBQUMsZ0JBQWdCLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxDQUFDO0lBQ25DLENBQUM7SUFFRCxrQkFBa0IsQ0FBQyxLQUFVLEVBQUUsSUFBc0I7UUFDbkQsTUFBTSxPQUFPLEdBQVcsSUFBSSxDQUFDLFdBQVcsQ0FBQyxtQkFBbUIsQ0FBQyxLQUFLLENBQUMsQ0FBQztRQUNwRSxJQUFJLE9BQU8sS0FBSyxPQUFPLENBQUMsR0FBRyxFQUFFO1lBQzNCLEtBQUssQ0FBQyxjQUFjLEVBQUUsQ0FBQztZQUV2QixJQUFJLE9BQU8sS0FBSyxPQUFPLENBQUMsS0FBSyxJQUFJLE9BQU8sS0FBSyxPQUFPLENBQUMsS0FBSyxFQUFFO2dCQUMxRCxJQUFJLENBQUMsa0JBQWtCLENBQUMsS0FBSyxFQUFFLElBQUksQ0FBQyxDQUFDO2FBQ3RDO2lCQUNJLElBQUksSUFBSSxDQUFDLElBQUksQ0FBQyxvQkFBb0IsRUFBRTtnQkFDdkMsSUFBSSxDQUFDLGdCQUFnQixDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQTthQUNsQztTQUNGO0lBQ0gsQ0FBQzs4R0E5Q1Usa0JBQWtCO2tHQUFsQixrQkFBa0IsME9BSGxCLENBQUMsV0FBVyxDQUFDLCtDQ1gxQixxdENBcUJBOzsyRkRQYSxrQkFBa0I7a0JBTjlCLFNBQVM7K0JBQ0UsZ0JBQWdCLGFBRWYsQ0FBQyxXQUFXLENBQUMsaUJBQ1QsaUJBQWlCLENBQUMsSUFBSTtrR0FHNUIsSUFBSTtzQkFBWixLQUFLO2dCQUNHLE1BQU07c0JBQWQsS0FBSztnQkFDRyxXQUFXO3NCQUFuQixLQUFLO2dCQUVJLGdCQUFnQjtzQkFBekIsTUFBTTtnQkFDRyxnQkFBZ0I7c0JBQXpCLE1BQU07Z0JBQ0csYUFBYTtzQkFBdEIsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7Q29tcG9uZW50LCBFdmVudEVtaXR0ZXIsIElucHV0LCBPbkNoYW5nZXMsIEFmdGVyVmlld0luaXQsIE91dHB1dCwgU2ltcGxlQ2hhbmdlcywgVmlld0VuY2Fwc3VsYXRpb259IGZyb20gXCJAYW5ndWxhci9jb3JlXCI7XG5pbXBvcnQge0lNeUNhbGVuZGFyTW9udGh9IGZyb20gXCIuLi8uLi9pbnRlcmZhY2VzL215LWNhbGVuZGFyLW1vbnRoLmludGVyZmFjZVwiO1xuaW1wb3J0IHtJTXlPcHRpb25zfSBmcm9tIFwiLi4vLi4vaW50ZXJmYWNlcy9teS1vcHRpb25zLmludGVyZmFjZVwiO1xuaW1wb3J0IHtLZXlDb2RlfSBmcm9tIFwiLi4vLi4vZW51bXMva2V5LWNvZGUuZW51bVwiO1xuaW1wb3J0IHtBY3RpdmVWaWV3fSBmcm9tIFwiLi4vLi4vZW51bXMvYWN0aXZlLXZpZXcuZW51bVwiO1xuaW1wb3J0IHtVdGlsU2VydmljZX0gZnJvbSBcIi4uLy4uL3NlcnZpY2VzL2FuZ3VsYXItbXlkYXRlcGlja2VyLnV0aWwuc2VydmljZVwiO1xuaW1wb3J0IHtPUFRTLCBNT05USFN9IGZyb20gXCIuLi8uLi9jb25zdGFudHMvY29uc3RhbnRzXCI7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogXCJsaWItbW9udGgtdmlld1wiLFxuICB0ZW1wbGF0ZVVybDogXCIuL21vbnRoLXZpZXcuY29tcG9uZW50Lmh0bWxcIixcbiAgcHJvdmlkZXJzOiBbVXRpbFNlcnZpY2VdLFxuICBlbmNhcHN1bGF0aW9uOiBWaWV3RW5jYXBzdWxhdGlvbi5Ob25lXG59KVxuZXhwb3J0IGNsYXNzIE1vbnRoVmlld0NvbXBvbmVudCBpbXBsZW1lbnRzIE9uQ2hhbmdlcywgQWZ0ZXJWaWV3SW5pdCB7XG4gIEBJbnB1dCgpIG9wdHM6IElNeU9wdGlvbnM7XG4gIEBJbnB1dCgpIG1vbnRoczogQXJyYXk8QXJyYXk8SU15Q2FsZW5kYXJNb250aD4+O1xuICBASW5wdXQoKSB2aWV3Q2hhbmdlZDogYm9vbGVhbjtcblxuICBAT3V0cHV0KCkgbW9udGhDZWxsQ2xpY2tlZDogRXZlbnRFbWl0dGVyPElNeUNhbGVuZGFyTW9udGg+ID0gbmV3IEV2ZW50RW1pdHRlcjxJTXlDYWxlbmRhck1vbnRoPigpO1xuICBAT3V0cHV0KCkgbW9udGhDZWxsS2V5RG93bjogRXZlbnRFbWl0dGVyPGFueT4gPSBuZXcgRXZlbnRFbWl0dGVyPGFueT4oKTtcbiAgQE91dHB1dCgpIHZpZXdBY3RpdmF0ZWQ6IEV2ZW50RW1pdHRlcjxBY3RpdmVWaWV3PiA9IG5ldyBFdmVudEVtaXR0ZXI8QWN0aXZlVmlldz4oKTtcblxuICBjb25zdHJ1Y3Rvcihwcml2YXRlIHV0aWxTZXJ2aWNlOiBVdGlsU2VydmljZSkgeyB9XG5cbiAgbmdPbkNoYW5nZXMoY2hhbmdlczogU2ltcGxlQ2hhbmdlcyk6IHZvaWQge1xuICAgIGlmIChjaGFuZ2VzLmhhc093blByb3BlcnR5KE9QVFMpKSB7XG4gICAgICB0aGlzLm9wdHMgPSBjaGFuZ2VzW09QVFNdLmN1cnJlbnRWYWx1ZTtcbiAgICB9XG4gICAgaWYgKGNoYW5nZXMuaGFzT3duUHJvcGVydHkoTU9OVEhTKSkge1xuICAgICAgdGhpcy5tb250aHMgPSBjaGFuZ2VzW01PTlRIU10uY3VycmVudFZhbHVlO1xuICAgIH1cbiAgfVxuXG4gIG5nQWZ0ZXJWaWV3SW5pdCgpOiB2b2lkIHtcbiAgICB0aGlzLnZpZXdBY3RpdmF0ZWQuZW1pdChBY3RpdmVWaWV3Lk1vbnRoKTtcbiAgfVxuXG4gIG9uTW9udGhDZWxsQ2xpY2tlZChldmVudDogYW55LCBjZWxsOiBJTXlDYWxlbmRhck1vbnRoKTogdm9pZCB7XG4gICAgZXZlbnQuc3RvcFByb3BhZ2F0aW9uKCk7XG5cbiAgICBpZiAoY2VsbC5kaXNhYmxlZCkge1xuICAgICAgcmV0dXJuO1xuICAgIH1cblxuICAgIHRoaXMubW9udGhDZWxsQ2xpY2tlZC5lbWl0KGNlbGwpO1xuICB9XG5cbiAgb25Nb250aENlbGxLZXlEb3duKGV2ZW50OiBhbnksIGNlbGw6IElNeUNhbGVuZGFyTW9udGgpIHtcbiAgICBjb25zdCBrZXlDb2RlOiBudW1iZXIgPSB0aGlzLnV0aWxTZXJ2aWNlLmdldEtleUNvZGVGcm9tRXZlbnQoZXZlbnQpO1xuICAgIGlmIChrZXlDb2RlICE9PSBLZXlDb2RlLnRhYikge1xuICAgICAgZXZlbnQucHJldmVudERlZmF1bHQoKTtcblxuICAgICAgaWYgKGtleUNvZGUgPT09IEtleUNvZGUuZW50ZXIgfHwga2V5Q29kZSA9PT0gS2V5Q29kZS5zcGFjZSkge1xuICAgICAgICB0aGlzLm9uTW9udGhDZWxsQ2xpY2tlZChldmVudCwgY2VsbCk7XG4gICAgICB9XG4gICAgICBlbHNlIGlmICh0aGlzLm9wdHMubW92ZUZvY3VzQnlBcnJvd0tleXMpIHtcbiAgICAgICAgdGhpcy5tb250aENlbGxLZXlEb3duLmVtaXQoZXZlbnQpXG4gICAgICB9XG4gICAgfVxuICB9XG59XG4iLCI8dGFibGUgY2xhc3M9XCJteURwTW9udGhUYWJsZVwiIFtuZ0NsYXNzXT1cInsnbmctbXlydGwnOiBvcHRzLnJ0bCwgJ215RHBGb290ZXInOiBvcHRzLnNob3dGb290ZXJUb2RheSwgJ215RHBOb0Zvb3Rlcic6ICFvcHRzLnNob3dGb290ZXJUb2RheSwgJ215RHBWaWV3Q2hhbmdlQW5pbWF0aW9uJzogb3B0cy52aWV3Q2hhbmdlQW5pbWF0aW9uICYmIHZpZXdDaGFuZ2VkfVwiPlxuICA8dGJvZHk+XG4gICAgPHRyICpuZ0Zvcj1cImxldCBtciBvZiBtb250aHNcIj5cbiAgICAgIDx0ZCAqbmdGb3I9XCJsZXQgbSBvZiBtclwiXG4gICAgICAgICAgaWQ9XCJtX3t7bS5yb3d9fV97e20uY29sfX1cIlxuICAgICAgICAgIGNsYXNzPVwibV97e20ucm93fX1fe3ttLmNvbH19IG15RHBNb250aGNlbGxcIlxuICAgICAgICAgIFtuZ0NsYXNzXT1cInsnbXlEcFNlbGVjdGVkTW9udGgnOiBtLnNlbGVjdGVkLCAnbXlEcERpc2FibGVkJzogbS5kaXNhYmxlZCwgJ215RHBUYWJsZVNpbmdsZU1vbnRoJzogIW0uZGlzYWJsZWR9XCJcbiAgICAgICAgICBbYXR0ci5hcmlhLWN1cnJlbnRdPVwibS5jdXJyTW9udGggPyAnZGF0ZScgOiBudWxsXCJcbiAgICAgICAgICBbYXR0ci5hcmlhLWRpc2FibGVkXT1cIm0uZGlzYWJsZWQgfHwgbnVsbFwiXG4gICAgICAgICAgW2F0dHIuYXJpYS1zZWxlY3RlZF09XCJtLnNlbGVjdGVkIHx8IG51bGxcIlxuICAgICAgICAgIFthdHRyLnRhYmluZGV4XT1cIiFtLmRpc2FibGVkID8gMCA6IC0xXCJcbiAgICAgICAgICAoY2xpY2spPVwib25Nb250aENlbGxDbGlja2VkKCRldmVudCwgbSlcIlxuICAgICAgICAgIChrZXlkb3duKT1cIm9uTW9udGhDZWxsS2V5RG93bigkZXZlbnQsIG0pXCI+XG4gICAgICAgIDxzcGFuIGNsYXNzPVwibXlEcE1vbnRoTmJyXCIgKm5nSWY9XCJvcHRzLnNob3dNb250aE51bWJlclwiIGFyaWEtaGlkZGVuPVwidHJ1ZVwiPnt7bS5uYnJ9fTwvc3Bhbj5cbiAgICAgICAgPHNwYW4gY2xhc3M9XCJteURwTW9udGhWYWx1ZVwiXG4gICAgICAgICAgW2F0dHIuYXJpYS1sYWJlbF09XCJbKG0ubmJyICsgJy8nICsgMSArICcvJyArIG0ueWVhciB8IGRhdGU6J01NTU0geXl5eScpXVwiXG4gICAgICAgICAgW25nQ2xhc3NdPVwieydteURwTWFya0N1cnJNb250aCc6IG0uY3Vyck1vbnRoICYmIG9wdHMubWFya0N1cnJlbnRNb250aH1cIj57e20ubmFtZX19PC9zcGFuPlxuICAgICAgPC90ZD5cbiAgICA8L3RyPlxuICA8L3Rib2R5PlxuPC90YWJsZT5cbiJdfQ==