@bimeister/pupakit.calendar
Version:
PupaKit Calendar
53 lines • 13 kB
JavaScript
import { ChangeDetectionStrategy, Component, ViewEncapsulation } from '@angular/core';
import { combineLatest } from 'rxjs';
import { map } from 'rxjs/operators';
import { CalendarQuickSelectMode } from '../../declarations/enums/calendar-quick-select-mode.enum';
import '../../declarations/enums/month-index.enum';
import '../../declarations/interfaces/calendar-month.interface';
import '../../declarations/interfaces/calendar-translation.interface';
import { CalendarManipulatorService } from '../../services/calendar-manipulator.service';
import { CalendarStateService } from '../../services/calendar-state.service';
import { CalendarTranslationService } from '../../services/calendar-translation.service';
import * as i0 from "@angular/core";
import * as i1 from "../../services/calendar-manipulator.service";
import * as i2 from "../../services/calendar-translation.service";
import * as i3 from "../../services/calendar-state.service";
import * as i4 from "@angular/common";
import * as i5 from "@bimeister/pupakit.kit";
export class CalendarControlPanelComponent {
constructor(calendarManipulatorService, calendarTranslationService, calendarStateService) {
this.calendarManipulatorService = calendarManipulatorService;
this.calendarTranslationService = calendarTranslationService;
this.calendarStateService = calendarStateService;
this.monthTranslationByIndex$ = this.calendarTranslationService.translation$.pipe(map((translation) => translation.months));
this.displayedMonth$ = combineLatest([
this.calendarManipulatorService.currentCalendarMonth$,
this.monthTranslationByIndex$,
]).pipe(map(([calendarMonth, monthTranslationByIndex]) => ({
year: calendarMonth.year,
month: monthTranslationByIndex[calendarMonth.month],
})));
}
resetScroll() {
this.calendarManipulatorService.resetScroll('smooth');
}
scrollToNextMonth() {
this.calendarManipulatorService.scrollToNextMonth('smooth');
}
scrollToPreviousMonth() {
this.calendarManipulatorService.scrollToPreviousMonth('smooth');
}
setQuickSelectModeMonth() {
this.calendarStateService.setQuickSelectMode(CalendarQuickSelectMode.Month);
}
setQuickSelectModeYear() {
this.calendarStateService.setQuickSelectMode(CalendarQuickSelectMode.Year);
}
}
CalendarControlPanelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: CalendarControlPanelComponent, deps: [{ token: i1.CalendarManipulatorService }, { token: i2.CalendarTranslationService }, { token: i3.CalendarStateService }], target: i0.ɵɵFactoryTarget.Component });
CalendarControlPanelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: CalendarControlPanelComponent, selector: "pupa-calendar-control-panel", ngImport: i0, template: "<div class=\"selection\" *ngIf=\"displayedMonth$ | async as displayedMonth\">\n <pupa-button (click)=\"setQuickSelectModeMonth()\" kind=\"secondary\">\n {{ displayedMonth.month }}\n </pupa-button>\n\n <pupa-button (click)=\"setQuickSelectModeYear()\" kind=\"secondary\">\n {{ displayedMonth.year }}\n </pupa-button>\n</div>\n\n<div class=\"navigation\">\n <pupa-button-icon size=\"m\" kind=\"secondary\" icon=\"app-chevron-down\" (click)=\"scrollToNextMonth()\"></pupa-button-icon>\n\n <pupa-button-icon size=\"m\" kind=\"secondary\" icon=\"ios-radio-button-off\" (click)=\"resetScroll()\"></pupa-button-icon>\n\n <pupa-button-icon\n size=\"m\"\n kind=\"secondary\"\n icon=\"app-chevron-up\"\n (click)=\"scrollToPreviousMonth()\"\n ></pupa-button-icon>\n</div>\n", styles: [":host{display:flex;align-items:center;justify-content:space-between;height:12rem;padding:0 3rem}.selection{display:flex}.navigation{display:flex;gap:1rem}\n"], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5.ButtonComponent, selector: "pupa-button", inputs: ["size", "kind", "type", "disabled", "icon", "iconPosition", "loading", "active", "tabIndex"] }, { kind: "component", type: i5.ButtonIconComponent, selector: "pupa-button-icon", inputs: ["size", "kind", "type", "disabled", "icon", "loading", "active", "tabIndex"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: CalendarControlPanelComponent, decorators: [{
type: Component,
args: [{ selector: 'pupa-calendar-control-panel', encapsulation: ViewEncapsulation.Emulated, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"selection\" *ngIf=\"displayedMonth$ | async as displayedMonth\">\n <pupa-button (click)=\"setQuickSelectModeMonth()\" kind=\"secondary\">\n {{ displayedMonth.month }}\n </pupa-button>\n\n <pupa-button (click)=\"setQuickSelectModeYear()\" kind=\"secondary\">\n {{ displayedMonth.year }}\n </pupa-button>\n</div>\n\n<div class=\"navigation\">\n <pupa-button-icon size=\"m\" kind=\"secondary\" icon=\"app-chevron-down\" (click)=\"scrollToNextMonth()\"></pupa-button-icon>\n\n <pupa-button-icon size=\"m\" kind=\"secondary\" icon=\"ios-radio-button-off\" (click)=\"resetScroll()\"></pupa-button-icon>\n\n <pupa-button-icon\n size=\"m\"\n kind=\"secondary\"\n icon=\"app-chevron-up\"\n (click)=\"scrollToPreviousMonth()\"\n ></pupa-button-icon>\n</div>\n", styles: [":host{display:flex;align-items:center;justify-content:space-between;height:12rem;padding:0 3rem}.selection{display:flex}.navigation{display:flex;gap:1rem}\n"] }]
}], ctorParameters: function () { return [{ type: i1.CalendarManipulatorService }, { type: i2.CalendarTranslationService }, { type: i3.CalendarStateService }]; } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2FsZW5kYXItY29udHJvbC1wYW5lbC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9zcmMvY29tcG9uZW50cy9jYWxlbmRhci1jb250cm9sLXBhbmVsL2NhbGVuZGFyLWNvbnRyb2wtcGFuZWwuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvY2FsZW5kYXItY29udHJvbC1wYW5lbC9jYWxlbmRhci1jb250cm9sLXBhbmVsLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDdEYsT0FBTyxFQUFjLGFBQWEsRUFBRSxNQUFNLE1BQU0sQ0FBQztBQUNqRCxPQUFPLEVBQUUsR0FBRyxFQUFFLE1BQU0sZ0JBQWdCLENBQUM7QUFDckMsT0FBTyxFQUFFLHVCQUF1QixFQUFFLE1BQU0sMERBQTBELENBQUM7QUFDbkcsT0FBMkIsMkNBQTJDLENBQUM7QUFDdkUsT0FBOEIsd0RBQXdELENBQUM7QUFDdkYsT0FBb0MsOERBQThELENBQUM7QUFDbkcsT0FBTyxFQUFFLDBCQUEwQixFQUFFLE1BQU0sNkNBQTZDLENBQUM7QUFDekYsT0FBTyxFQUFFLG9CQUFvQixFQUFFLE1BQU0sdUNBQXVDLENBQUM7QUFDN0UsT0FBTyxFQUFFLDBCQUEwQixFQUFFLE1BQU0sNkNBQTZDLENBQUM7Ozs7Ozs7QUFjekYsTUFBTSxPQUFPLDZCQUE2QjtJQWN4QyxZQUNtQiwwQkFBc0QsRUFDdEQsMEJBQXNELEVBQ3RELG9CQUEwQztRQUYxQywrQkFBMEIsR0FBMUIsMEJBQTBCLENBQTRCO1FBQ3RELCtCQUEwQixHQUExQiwwQkFBMEIsQ0FBNEI7UUFDdEQseUJBQW9CLEdBQXBCLG9CQUFvQixDQUFzQjtRQWhCNUMsNkJBQXdCLEdBQ3ZDLElBQUksQ0FBQywwQkFBMEIsQ0FBQyxZQUFZLENBQUMsSUFBSSxDQUFDLEdBQUcsQ0FBQyxDQUFDLFdBQWdDLEVBQUUsRUFBRSxDQUFDLFdBQVcsQ0FBQyxNQUFNLENBQUMsQ0FBQyxDQUFDO1FBRW5HLG9CQUFlLEdBQStCLGFBQWEsQ0FBQztZQUMxRSxJQUFJLENBQUMsMEJBQTBCLENBQUMscUJBQXFCO1lBQ3JELElBQUksQ0FBQyx3QkFBd0I7U0FDOUIsQ0FBQyxDQUFDLElBQUksQ0FDTCxHQUFHLENBQUMsQ0FBQyxDQUFDLGFBQWEsRUFBRSx1QkFBdUIsQ0FBOEMsRUFBRSxFQUFFLENBQUMsQ0FBQztZQUM5RixJQUFJLEVBQUUsYUFBYSxDQUFDLElBQUk7WUFDeEIsS0FBSyxFQUFFLHVCQUF1QixDQUFDLGFBQWEsQ0FBQyxLQUFLLENBQUM7U0FDcEQsQ0FBQyxDQUFDLENBQ0osQ0FBQztJQU1DLENBQUM7SUFFRyxXQUFXO1FBQ2hCLElBQUksQ0FBQywwQkFBMEIsQ0FBQyxXQUFXLENBQUMsUUFBUSxDQUFDLENBQUM7SUFDeEQsQ0FBQztJQUVNLGlCQUFpQjtRQUN0QixJQUFJLENBQUMsMEJBQTBCLENBQUMsaUJBQWlCLENBQUMsUUFBUSxDQUFDLENBQUM7SUFDOUQsQ0FBQztJQUVNLHFCQUFxQjtRQUMxQixJQUFJLENBQUMsMEJBQTBCLENBQUMscUJBQXFCLENBQUMsUUFBUSxDQUFDLENBQUM7SUFDbEUsQ0FBQztJQUVNLHVCQUF1QjtRQUM1QixJQUFJLENBQUMsb0JBQW9CLENBQUMsa0JBQWtCLENBQUMsdUJBQXVCLENBQUMsS0FBSyxDQUFDLENBQUM7SUFDOUUsQ0FBQztJQUVNLHNCQUFzQjtRQUMzQixJQUFJLENBQUMsb0JBQW9CLENBQUMsa0JBQWtCLENBQUMsdUJBQXVCLENBQUMsSUFBSSxDQUFDLENBQUM7SUFDN0UsQ0FBQzs7MkhBdENVLDZCQUE2QjsrR0FBN0IsNkJBQTZCLG1FQ3ZCMUMsc3hCQXNCQTs0RkRDYSw2QkFBNkI7a0JBUHpDLFNBQVM7K0JBQ0UsNkJBQTZCLGlCQUd4QixpQkFBaUIsQ0FBQyxRQUFRLG1CQUN4Qix1QkFBdUIsQ0FBQyxNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksIENvbXBvbmVudCwgVmlld0VuY2Fwc3VsYXRpb24gfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IE9ic2VydmFibGUsIGNvbWJpbmVMYXRlc3QgfSBmcm9tICdyeGpzJztcbmltcG9ydCB7IG1hcCB9IGZyb20gJ3J4anMvb3BlcmF0b3JzJztcbmltcG9ydCB7IENhbGVuZGFyUXVpY2tTZWxlY3RNb2RlIH0gZnJvbSAnLi4vLi4vZGVjbGFyYXRpb25zL2VudW1zL2NhbGVuZGFyLXF1aWNrLXNlbGVjdC1tb2RlLmVudW0nO1xuaW1wb3J0IHsgTW9udGhJbmRleCB9IGZyb20gJy4uLy4uL2RlY2xhcmF0aW9ucy9lbnVtcy9tb250aC1pbmRleC5lbnVtJztcbmltcG9ydCB7IENhbGVuZGFyTW9udGggfSBmcm9tICcuLi8uLi9kZWNsYXJhdGlvbnMvaW50ZXJmYWNlcy9jYWxlbmRhci1tb250aC5pbnRlcmZhY2UnO1xuaW1wb3J0IHsgQ2FsZW5kYXJUcmFuc2xhdGlvbiB9IGZyb20gJy4uLy4uL2RlY2xhcmF0aW9ucy9pbnRlcmZhY2VzL2NhbGVuZGFyLXRyYW5zbGF0aW9uLmludGVyZmFjZSc7XG5pbXBvcnQgeyBDYWxlbmRhck1hbmlwdWxhdG9yU2VydmljZSB9IGZyb20gJy4uLy4uL3NlcnZpY2VzL2NhbGVuZGFyLW1hbmlwdWxhdG9yLnNlcnZpY2UnO1xuaW1wb3J0IHsgQ2FsZW5kYXJTdGF0ZVNlcnZpY2UgfSBmcm9tICcuLi8uLi9zZXJ2aWNlcy9jYWxlbmRhci1zdGF0ZS5zZXJ2aWNlJztcbmltcG9ydCB7IENhbGVuZGFyVHJhbnNsYXRpb25TZXJ2aWNlIH0gZnJvbSAnLi4vLi4vc2VydmljZXMvY2FsZW5kYXItdHJhbnNsYXRpb24uc2VydmljZSc7XG5cbmludGVyZmFjZSBEaXNwbGF5ZWRNb250aCB7XG4gIHllYXI6IG51bWJlcjtcbiAgbW9udGg6IHN0cmluZztcbn1cblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAncHVwYS1jYWxlbmRhci1jb250cm9sLXBhbmVsJyxcbiAgdGVtcGxhdGVVcmw6ICcuL2NhbGVuZGFyLWNvbnRyb2wtcGFuZWwuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9jYWxlbmRhci1jb250cm9sLXBhbmVsLmNvbXBvbmVudC5zY3NzJ10sXG4gIGVuY2Fwc3VsYXRpb246IFZpZXdFbmNhcHN1bGF0aW9uLkVtdWxhdGVkLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbn0pXG5leHBvcnQgY2xhc3MgQ2FsZW5kYXJDb250cm9sUGFuZWxDb21wb25lbnQge1xuICBwcml2YXRlIHJlYWRvbmx5IG1vbnRoVHJhbnNsYXRpb25CeUluZGV4JDogT2JzZXJ2YWJsZTxSZWNvcmQ8TW9udGhJbmRleCwgc3RyaW5nPj4gPVxuICAgIHRoaXMuY2FsZW5kYXJUcmFuc2xhdGlvblNlcnZpY2UudHJhbnNsYXRpb24kLnBpcGUobWFwKCh0cmFuc2xhdGlvbjogQ2FsZW5kYXJUcmFuc2xhdGlvbikgPT4gdHJhbnNsYXRpb24ubW9udGhzKSk7XG5cbiAgcHVibGljIHJlYWRvbmx5IGRpc3BsYXllZE1vbnRoJDogT2JzZXJ2YWJsZTxEaXNwbGF5ZWRNb250aD4gPSBjb21iaW5lTGF0ZXN0KFtcbiAgICB0aGlzLmNhbGVuZGFyTWFuaXB1bGF0b3JTZXJ2aWNlLmN1cnJlbnRDYWxlbmRhck1vbnRoJCxcbiAgICB0aGlzLm1vbnRoVHJhbnNsYXRpb25CeUluZGV4JCxcbiAgXSkucGlwZShcbiAgICBtYXAoKFtjYWxlbmRhck1vbnRoLCBtb250aFRyYW5zbGF0aW9uQnlJbmRleF06IFtDYWxlbmRhck1vbnRoLCBSZWNvcmQ8TW9udGhJbmRleCwgc3RyaW5nPl0pID0+ICh7XG4gICAgICB5ZWFyOiBjYWxlbmRhck1vbnRoLnllYXIsXG4gICAgICBtb250aDogbW9udGhUcmFuc2xhdGlvbkJ5SW5kZXhbY2FsZW5kYXJNb250aC5tb250aF0sXG4gICAgfSkpXG4gICk7XG5cbiAgY29uc3RydWN0b3IoXG4gICAgcHJpdmF0ZSByZWFkb25seSBjYWxlbmRhck1hbmlwdWxhdG9yU2VydmljZTogQ2FsZW5kYXJNYW5pcHVsYXRvclNlcnZpY2UsXG4gICAgcHJpdmF0ZSByZWFkb25seSBjYWxlbmRhclRyYW5zbGF0aW9uU2VydmljZTogQ2FsZW5kYXJUcmFuc2xhdGlvblNlcnZpY2UsXG4gICAgcHJpdmF0ZSByZWFkb25seSBjYWxlbmRhclN0YXRlU2VydmljZTogQ2FsZW5kYXJTdGF0ZVNlcnZpY2VcbiAgKSB7fVxuXG4gIHB1YmxpYyByZXNldFNjcm9sbCgpOiB2b2lkIHtcbiAgICB0aGlzLmNhbGVuZGFyTWFuaXB1bGF0b3JTZXJ2aWNlLnJlc2V0U2Nyb2xsKCdzbW9vdGgnKTtcbiAgfVxuXG4gIHB1YmxpYyBzY3JvbGxUb05leHRNb250aCgpOiB2b2lkIHtcbiAgICB0aGlzLmNhbGVuZGFyTWFuaXB1bGF0b3JTZXJ2aWNlLnNjcm9sbFRvTmV4dE1vbnRoKCdzbW9vdGgnKTtcbiAgfVxuXG4gIHB1YmxpYyBzY3JvbGxUb1ByZXZpb3VzTW9udGgoKTogdm9pZCB7XG4gICAgdGhpcy5jYWxlbmRhck1hbmlwdWxhdG9yU2VydmljZS5zY3JvbGxUb1ByZXZpb3VzTW9udGgoJ3Ntb290aCcpO1xuICB9XG5cbiAgcHVibGljIHNldFF1aWNrU2VsZWN0TW9kZU1vbnRoKCk6IHZvaWQge1xuICAgIHRoaXMuY2FsZW5kYXJTdGF0ZVNlcnZpY2Uuc2V0UXVpY2tTZWxlY3RNb2RlKENhbGVuZGFyUXVpY2tTZWxlY3RNb2RlLk1vbnRoKTtcbiAgfVxuXG4gIHB1YmxpYyBzZXRRdWlja1NlbGVjdE1vZGVZZWFyKCk6IHZvaWQge1xuICAgIHRoaXMuY2FsZW5kYXJTdGF0ZVNlcnZpY2Uuc2V0UXVpY2tTZWxlY3RNb2RlKENhbGVuZGFyUXVpY2tTZWxlY3RNb2RlLlllYXIpO1xuICB9XG59XG4iLCI8ZGl2IGNsYXNzPVwic2VsZWN0aW9uXCIgKm5nSWY9XCJkaXNwbGF5ZWRNb250aCQgfCBhc3luYyBhcyBkaXNwbGF5ZWRNb250aFwiPlxuICA8cHVwYS1idXR0b24gKGNsaWNrKT1cInNldFF1aWNrU2VsZWN0TW9kZU1vbnRoKClcIiBraW5kPVwic2Vjb25kYXJ5XCI+XG4gICAge3sgZGlzcGxheWVkTW9udGgubW9udGggfX1cbiAgPC9wdXBhLWJ1dHRvbj5cblxuICA8cHVwYS1idXR0b24gKGNsaWNrKT1cInNldFF1aWNrU2VsZWN0TW9kZVllYXIoKVwiIGtpbmQ9XCJzZWNvbmRhcnlcIj5cbiAgICB7eyBkaXNwbGF5ZWRNb250aC55ZWFyIH19XG4gIDwvcHVwYS1idXR0b24+XG48L2Rpdj5cblxuPGRpdiBjbGFzcz1cIm5hdmlnYXRpb25cIj5cbiAgPHB1cGEtYnV0dG9uLWljb24gc2l6ZT1cIm1cIiBraW5kPVwic2Vjb25kYXJ5XCIgaWNvbj1cImFwcC1jaGV2cm9uLWRvd25cIiAoY2xpY2spPVwic2Nyb2xsVG9OZXh0TW9udGgoKVwiPjwvcHVwYS1idXR0b24taWNvbj5cblxuICA8cHVwYS1idXR0b24taWNvbiBzaXplPVwibVwiIGtpbmQ9XCJzZWNvbmRhcnlcIiBpY29uPVwiaW9zLXJhZGlvLWJ1dHRvbi1vZmZcIiAoY2xpY2spPVwicmVzZXRTY3JvbGwoKVwiPjwvcHVwYS1idXR0b24taWNvbj5cblxuICA8cHVwYS1idXR0b24taWNvblxuICAgIHNpemU9XCJtXCJcbiAgICBraW5kPVwic2Vjb25kYXJ5XCJcbiAgICBpY29uPVwiYXBwLWNoZXZyb24tdXBcIlxuICAgIChjbGljayk9XCJzY3JvbGxUb1ByZXZpb3VzTW9udGgoKVwiXG4gID48L3B1cGEtYnV0dG9uLWljb24+XG48L2Rpdj5cbiJdfQ==