@qeydar/datepicker
Version:
A comprehensive Date and Time Picker for Angular with Jalali calendar support
57 lines • 9.05 kB
JavaScript
import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output } from '@angular/core';
import { NgIf } from '@angular/common';
import * as i0 from "@angular/core";
export class CalendarHeaderComponent {
constructor() {
this.mode = 'day';
this.prevDisabled = false;
this.nextDisabled = false;
this.prev = new EventEmitter();
this.next = new EventEmitter();
this.showMonths = new EventEmitter();
this.showYears = new EventEmitter();
}
}
CalendarHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CalendarHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
CalendarHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: CalendarHeaderComponent, isStandalone: true, selector: "qeydar-calendar-header", inputs: { mode: "mode", currentMonthName: "currentMonthName", currentYear: "currentYear", prevDisabled: "prevDisabled", nextDisabled: "nextDisabled" }, outputs: { prev: "prev", next: "next", showMonths: "showMonths", showYears: "showYears" }, ngImport: i0, template: `
<div class="header">
<button class="qeydar-calendar-nav-left" (click)="prev.emit()" [disabled]="prevDisabled" tabindex="-1"></button>
<span class="month-year">
<span *ngIf="mode != 'year'" class="month-name" (click)="showMonths.emit()">{{ currentMonthName }}</span>
<span class="year" (click)="showYears.emit()">{{ currentYear }}</span>
</span>
<button class="qeydar-calendar-nav-right" (click)="next.emit()" [disabled]="nextDisabled" tabindex="-1"></button>
</div>
`, isInline: true, styles: [":root{--dp-color-bg: #fff;--dp-color-surface: #fff;--dp-color-text: #555;--dp-color-muted: #8a8a8a;--dp-color-border: #e5e5e5;--dp-color-primary: #bfeaff;--dp-color-primary-contrast: #fff;--dp-color-primary-text: #0175e0;--dp-color-primary-button: #1890ff;--dp-color-primary-week: #18396cb0;--dp-color-accent: #ff4081;--dp-color-danger: #d32f2f;--dp-color-success: #2e7d32;--dp-color-warning: #f9a825;--dp-color-hover: #e6f7ff;--dp-spacing-0: 0;--dp-spacing-1: 4px;--dp-spacing-2: 8px;--dp-spacing-3: 12px;--dp-spacing-4: 16px;--dp-spacing-5: 20px;--dp-spacing-6: 24px;--dp-spacing-7: 28px;--dp-spacing-8: 32px;--dp-radius-0: 0;--dp-radius-1: 4px;--dp-radius-2: 6px;--dp-radius-3: 8px;--dp-font-size-xs: 11px;--dp-font-size-sm: 12px;--dp-font-size-md: 14px;--dp-font-size-lg: 16px}.header{display:flex;justify-content:space-between;align-items:center;margin-bottom:5px;padding-bottom:2px;border-bottom:1px solid var(--dp-color-border)}.header button{background:none;border:0;font:inherit;color:inherit;font-size:16px;cursor:pointer;padding:4px 5px}.header .month-name,.header .year{color:var(--dp-color-text)}.month-year{display:flex;align-items:center;cursor:pointer;font-size:16px}.month-name,.year{margin:0 5px}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CalendarHeaderComponent, decorators: [{
type: Component,
args: [{ selector: 'qeydar-calendar-header', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgIf], template: `
<div class="header">
<button class="qeydar-calendar-nav-left" (click)="prev.emit()" [disabled]="prevDisabled" tabindex="-1"></button>
<span class="month-year">
<span *ngIf="mode != 'year'" class="month-name" (click)="showMonths.emit()">{{ currentMonthName }}</span>
<span class="year" (click)="showYears.emit()">{{ currentYear }}</span>
</span>
<button class="qeydar-calendar-nav-right" (click)="next.emit()" [disabled]="nextDisabled" tabindex="-1"></button>
</div>
`, styles: [":root{--dp-color-bg: #fff;--dp-color-surface: #fff;--dp-color-text: #555;--dp-color-muted: #8a8a8a;--dp-color-border: #e5e5e5;--dp-color-primary: #bfeaff;--dp-color-primary-contrast: #fff;--dp-color-primary-text: #0175e0;--dp-color-primary-button: #1890ff;--dp-color-primary-week: #18396cb0;--dp-color-accent: #ff4081;--dp-color-danger: #d32f2f;--dp-color-success: #2e7d32;--dp-color-warning: #f9a825;--dp-color-hover: #e6f7ff;--dp-spacing-0: 0;--dp-spacing-1: 4px;--dp-spacing-2: 8px;--dp-spacing-3: 12px;--dp-spacing-4: 16px;--dp-spacing-5: 20px;--dp-spacing-6: 24px;--dp-spacing-7: 28px;--dp-spacing-8: 32px;--dp-radius-0: 0;--dp-radius-1: 4px;--dp-radius-2: 6px;--dp-radius-3: 8px;--dp-font-size-xs: 11px;--dp-font-size-sm: 12px;--dp-font-size-md: 14px;--dp-font-size-lg: 16px}.header{display:flex;justify-content:space-between;align-items:center;margin-bottom:5px;padding-bottom:2px;border-bottom:1px solid var(--dp-color-border)}.header button{background:none;border:0;font:inherit;color:inherit;font-size:16px;cursor:pointer;padding:4px 5px}.header .month-name,.header .year{color:var(--dp-color-text)}.month-year{display:flex;align-items:center;cursor:pointer;font-size:16px}.month-name,.year{margin:0 5px}\n"] }]
}], propDecorators: { mode: [{
type: Input
}], currentMonthName: [{
type: Input
}], currentYear: [{
type: Input
}], prevDisabled: [{
type: Input
}], nextDisabled: [{
type: Input
}], prev: [{
type: Output
}], next: [{
type: Output
}], showMonths: [{
type: Output
}], showYears: [{
type: Output
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2FsZW5kYXItaGVhZGVyLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3FleWRhci1kYXRlcGlja2VyL3NyYy9kYXRlLXBpY2tlci1wb3B1cC9jb21wb25lbnRzL2NhbGVuZGFyLWhlYWRlci5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLHVCQUF1QixFQUFFLFNBQVMsRUFBRSxZQUFZLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUNoRyxPQUFPLEVBQUUsSUFBSSxFQUFFLE1BQU0saUJBQWlCLENBQUM7O0FBbUJ2QyxNQUFNLE9BQU8sdUJBQXVCO0lBakJwQztRQWtCVyxTQUFJLEdBQTZCLEtBQUssQ0FBQztRQUd2QyxpQkFBWSxHQUFHLEtBQUssQ0FBQztRQUNyQixpQkFBWSxHQUFHLEtBQUssQ0FBQztRQUVwQixTQUFJLEdBQUcsSUFBSSxZQUFZLEVBQVEsQ0FBQztRQUNoQyxTQUFJLEdBQUcsSUFBSSxZQUFZLEVBQVEsQ0FBQztRQUNoQyxlQUFVLEdBQUcsSUFBSSxZQUFZLEVBQVEsQ0FBQztRQUN0QyxjQUFTLEdBQUcsSUFBSSxZQUFZLEVBQVEsQ0FBQztLQUNoRDs7b0hBWFksdUJBQXVCO3dHQUF2Qix1QkFBdUIscVVBWHhCOzs7Ozs7Ozs7R0FTVCwwd0NBWFMsSUFBSTsyRkFhSCx1QkFBdUI7a0JBakJuQyxTQUFTOytCQUNFLHdCQUF3QixjQUN0QixJQUFJLG1CQUNDLHVCQUF1QixDQUFDLE1BQU0sV0FDdEMsQ0FBQyxJQUFJLENBQUMsWUFFTDs7Ozs7Ozs7O0dBU1Q7OEJBR1EsSUFBSTtzQkFBWixLQUFLO2dCQUNHLGdCQUFnQjtzQkFBeEIsS0FBSztnQkFDRyxXQUFXO3NCQUFuQixLQUFLO2dCQUNHLFlBQVk7c0JBQXBCLEtBQUs7Z0JBQ0csWUFBWTtzQkFBcEIsS0FBSztnQkFFSSxJQUFJO3NCQUFiLE1BQU07Z0JBQ0csSUFBSTtzQkFBYixNQUFNO2dCQUNHLFVBQVU7c0JBQW5CLE1BQU07Z0JBQ0csU0FBUztzQkFBbEIsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBDb21wb25lbnQsIEV2ZW50RW1pdHRlciwgSW5wdXQsIE91dHB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQgeyBOZ0lmIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcclxuXHJcbkBDb21wb25lbnQoe1xyXG4gIHNlbGVjdG9yOiAncWV5ZGFyLWNhbGVuZGFyLWhlYWRlcicsXHJcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcclxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcclxuICBpbXBvcnRzOiBbTmdJZl0sXHJcbiAgc3R5bGVVcmxzOiBbJy4vY2FsZW5kYXItaGVhZGVyLmNvbXBvbmVudC5zY3NzJ10sXHJcbiAgdGVtcGxhdGU6IGBcclxuICAgIDxkaXYgY2xhc3M9XCJoZWFkZXJcIj5cclxuICAgICAgPGJ1dHRvbiBjbGFzcz1cInFleWRhci1jYWxlbmRhci1uYXYtbGVmdFwiIChjbGljayk9XCJwcmV2LmVtaXQoKVwiIFtkaXNhYmxlZF09XCJwcmV2RGlzYWJsZWRcIiB0YWJpbmRleD1cIi0xXCI+PC9idXR0b24+XHJcbiAgICAgIDxzcGFuIGNsYXNzPVwibW9udGgteWVhclwiPlxyXG4gICAgICAgIDxzcGFuICpuZ0lmPVwibW9kZSAhPSAneWVhcidcIiBjbGFzcz1cIm1vbnRoLW5hbWVcIiAoY2xpY2spPVwic2hvd01vbnRocy5lbWl0KClcIj57eyBjdXJyZW50TW9udGhOYW1lIH19PC9zcGFuPlxyXG4gICAgICAgIDxzcGFuIGNsYXNzPVwieWVhclwiIChjbGljayk9XCJzaG93WWVhcnMuZW1pdCgpXCI+e3sgY3VycmVudFllYXIgfX08L3NwYW4+XHJcbiAgICAgIDwvc3Bhbj5cclxuICAgICAgPGJ1dHRvbiBjbGFzcz1cInFleWRhci1jYWxlbmRhci1uYXYtcmlnaHRcIiAoY2xpY2spPVwibmV4dC5lbWl0KClcIiBbZGlzYWJsZWRdPVwibmV4dERpc2FibGVkXCIgdGFiaW5kZXg9XCItMVwiPjwvYnV0dG9uPlxyXG4gICAgPC9kaXY+XHJcbiAgYFxyXG59KVxyXG5leHBvcnQgY2xhc3MgQ2FsZW5kYXJIZWFkZXJDb21wb25lbnQge1xyXG4gIEBJbnB1dCgpIG1vZGU6ICdkYXknIHwgJ21vbnRoJyB8ICd5ZWFyJyA9ICdkYXknO1xyXG4gIEBJbnB1dCgpIGN1cnJlbnRNb250aE5hbWU6IHN0cmluZztcclxuICBASW5wdXQoKSBjdXJyZW50WWVhcjogbnVtYmVyO1xyXG4gIEBJbnB1dCgpIHByZXZEaXNhYmxlZCA9IGZhbHNlO1xyXG4gIEBJbnB1dCgpIG5leHREaXNhYmxlZCA9IGZhbHNlO1xyXG5cclxuICBAT3V0cHV0KCkgcHJldiA9IG5ldyBFdmVudEVtaXR0ZXI8dm9pZD4oKTtcclxuICBAT3V0cHV0KCkgbmV4dCA9IG5ldyBFdmVudEVtaXR0ZXI8dm9pZD4oKTtcclxuICBAT3V0cHV0KCkgc2hvd01vbnRocyA9IG5ldyBFdmVudEVtaXR0ZXI8dm9pZD4oKTtcclxuICBAT3V0cHV0KCkgc2hvd1llYXJzID0gbmV3IEV2ZW50RW1pdHRlcjx2b2lkPigpO1xyXG59XHJcblxyXG5cclxuIl19