@acorex/components 18.9.5 → 18.9.6
Sign up to get free protection for your applications and to get access to all the features.
|
@@ -701,7 +701,7 @@ class AXCalendarComponent extends classes((MXValueComponent), MXInteractiveCompo
|
|
|
701
701
|
useExisting: AXCalendarComponent,
|
|
702
702
|
},
|
|
703
703
|
AXUnsubscriber,
|
|
704
|
-
], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"ax-header\"></ng-content>\n<div class=\"ax-calendar-body\">\n @for(v of views; let i = $index, first = $first, last = $last; track i){\n @switch (activeView) {\n @case ('year') {\n @if(showNavigation)\n {\n <div class=\"ax-calendar-view-header\">\n <div class=\"ax-calendar-header-info\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-state-disabled\" (click)=\"_handleNavClick($event, 'year')\">\n {{ v.range.startTime.format('YYYY') }} - {{ v.range.endTime.format('YYYY') }}\n </button>\n </div>\n @if(last){\n <div class=\"ax-calendar-header-buttons\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon ax-next\" (click)=\"_handlePrevClick()\"\n [title]=\"'prev' | translate | async\">\n <i class=\"ax-icon ax-icon-chevron-left\"></i>\n </button>\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handleNextClick()\"\n [title]=\"'next' | translate | async\">\n <i class=\"ax-icon ax-icon-chevron-right\"></i>\n </button>\n </div>\n }\n </div>\n }\n <div class=\"ax-calendar-slots ax-calendar-slots-year\" [ngClass]=\"{ 'ax-default': !cellTemplate }\">\n @for(slot of v.slots; track slot.text){\n <div tabindex=\"0\" class=\"ax-calendar-slot\" [ngClass]=\"slot.cssClass\" (click)=\"_handleSlotClick($event, slot)\">\n @if(cellTemplate){\n <div>\n <ng-container *ngTemplateOutlet=\"cellTemplate; context: { $implicit: { slot: slot } }\">\n </ng-container>\n </div>\n } @else {\n <div [title]=\"slot.tooltip\">\n {{ slot.text }}\n </div>\n }\n </div>\n }\n </div>\n }\n @case ('month') {\n @if(showNavigation)\n {\n <div class=\"ax-calendar-view-header\">\n <div class=\"ax-calendar-header-info\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded\" (click)=\"_handleNavClick($event, 'year')\">\n {{ v.range.startTime.format('YYYY') }}\n </button>\n </div>\n @if(last){\n <div class=\"ax-calendar-header-buttons\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handlePrevClick()\"\n [title]=\"'prev' | translate | async\">\n <i class=\"ax-icon ax-icon-chevron-left\"></i>\n </button>\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handleNextClick()\"\n [title]=\"'next' | translate | async\">\n <i class=\"ax-icon ax-icon-chevron-right\"></i>\n </button>\n </div>\n }\n </div>\n }\n <div class=\"ax-calendar-slots ax-calendar-slots-month\" [ngClass]=\"{ 'ax-default': !cellTemplate }\">\n <div tabindex=\"0\" *ngFor=\"let slot of v.slots\" class=\"ax-calendar-slot\" [ngClass]=\"slot.cssClass\"\n (click)=\"_handleSlotClick($event, slot)\">\n\n @if(cellTemplate){\n <div>\n <ng-container *ngTemplateOutlet=\"cellTemplate; context: { $implicit: { slot: slot } }\">\n </ng-container>\n </div>\n }@else {\n <div [title]=\"slot.tooltip\">\n {{getMonthName(slot.date,'short') | translate | async }}\n </div>\n }\n\n </div>\n </div>\n }\n @default {\n @if(showNavigation)\n {\n <div class=\"ax-calendar-view-header\">\n <div class=\"ax-calendar-header-info\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded\" (click)=\"_handleNavClick($event, 'year')\">\n {{ v.range.startTime.format('YYYY') }}\n </button>\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded\" (click)=\"_handleNavClick($event, 'month')\">\n {{getMonthName(v.range.startTime,'long') | translate | async }}\n </button>\n </div>\n @if(last){\n <div class=\"ax-calendar-header-buttons\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handlePrevClick()\"\n [title]=\"'prev' | translate | async\">\n <i class=\"ax-icon ax-icon-chevron-left\"></i>\n </button>\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handleNextClick()\"\n [title]=\"'next' | translate | async\">\n <i class=\"ax-icon ax-icon-chevron-right\"></i>\n </button>\n </div>\n }\n </div>\n }\n <div class=\"ax-calendar-week\">\n <div *ngFor=\"let d of _weekdays\">{{ ('dateTime.weekdays.short.'+d) | translate | async }}</div>\n </div>\n <div class=\"ax-calendar-slots ax-calendar-slots-day\" [ngClass]=\"{ 'ax-default': !cellTemplate }\">\n <ng-container *ngFor=\"let slot of v.slots\">\n <div tabindex=\"0\" class=\"ax-calendar-slot\" [ngClass]=\"slot.cssClass\" (click)=\"_handleSlotClick($event, slot)\">\n @if(cellTemplate){\n <div>\n <ng-container *ngTemplateOutlet=\"cellTemplate; context: { $implicit: { slot: slot } }\">\n </ng-container>\n </div>\n } @else{\n <div [title]=\"slot.tooltip\">\n {{ slot.text }}\n </div>\n }\n\n </div>\n </ng-container>\n </div>\n }\n }\n }\n\n</div>\n<ng-content select=\"ax-footer\"></ng-content>", styles: [".ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover:not(.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover.ax-state-disabled,.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover.ax-state-selected){background-color:rgba(var(--ax-color-primary-200));color:rgba(var(--ax-color-primary-fore-tint))}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible:not(.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible.ax-state-disabled){outline-color:rgba(var(--ax-color-primary-200))}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-today{border-color:rgba(var(--ax-color-primary-200));color:rgba(var(--ax-color-primary-200))}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-today.ax-state-holiday{color:rgba(var(--ax-color-danger-200))!important;border-color:rgba(var(--ax-color-danger-200))!important}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected{background-color:rgba(var(--ax-color-primary-200));color:rgba(var(--ax-color-primary-fore-tint))}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected.ax-state-holiday{outline-color:rgba(var(--ax-color-primary-200))!important;background-color:rgba(var(--ax-color-danger-200))!important;color:rgba(var(--ax-color-danger-fore-tint))!important}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected.ax-state-holiday:hover{background-color:rgba(var(--ax-color-danger-200))!important;border-color:rgba(var(--ax-color-danger-200))!important}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday{color:rgba(var(--ax-color-danger-200))}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday:hover{background-color:rgba(var(--ax-color-danger-200))!important;border-color:rgba(var(--ax-color-danger-200))!important;color:rgba(var(--ax-color-danger-fore-tint))!important}.ax-dark ax-calendar .ax-calendar-footer:is(.ax-dark ax-calendar .ax-calendar-footer:focus,.ax-dark ax-calendar .ax-calendar-footer:focus-visible):not(.ax-state-disabled){outline-color:rgba(var(--ax-color-primary-200))}html[dir=rtl] ax-calendar .ax-calendar-header-buttons .ax-icon{-moz-transform:scale(-1,1);-o-transform:scale(-1,1);-webkit-transform:scale(-1,1);transform:scaleX(-1)}ax-calendar{display:block;width:100%;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity));color:rgba(var(--ax-color-surface-fore),var(--tw-text-opacity))}ax-calendar.ax-state-disabled .ax-calendar-slots{cursor:not-allowed;opacity:.5}ax-calendar.ax-state-readonly .ax-calendar-slots{cursor:text;opacity:.75}ax-calendar .ax-calendar-header{display:flex;justify-content:space-between;padding-left:.25rem;padding-right:.25rem;padding-top:.25rem}ax-calendar .ax-calendar-header .ax-calendar-header-info{font-weight:500}ax-calendar .ax-calendar-header .ax-calendar-header-buttons{display:flex}ax-calendar .ax-calendar-body{display:flex;flex-direction:column}@media (min-width: 1024px){ax-calendar .ax-calendar-body{flex-direction:column}}ax-calendar .ax-calendar-body>div{width:100%;flex:1 1 0%}@media (min-width: 768px){ax-calendar .ax-calendar-body>div{width:20rem}}ax-calendar .ax-calendar-body .ax-calendar-view-header{display:flex;justify-content:space-between;border-bottom-width:1px;border-color:rgba(var(--ax-color-border-default));padding:.5rem}ax-calendar .ax-calendar-body .ax-calendar-view-header .ax-calendar-header-info{font-weight:500}ax-calendar .ax-calendar-body .ax-calendar-view-header .ax-calendar-header-buttons{display:flex}ax-calendar .ax-calendar-body .ax-calendar-slots{display:grid;gap:.25rem;padding:1rem}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot{position:relative;display:flex;cursor:pointer;align-items:center;justify-content:center;border-radius:var(--ax-rounded-border-default);text-align:center;font-size:.875rem;line-height:1.25rem;color:rgba(var(--ax-color-surface-fore));transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:before{content:\"\";float:left;padding-top:100%}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:after{content:\"\";clear:both;display:block}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover:not(ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover.ax-state-disabled,ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover.ax-state-selected){background-color:rgba(var(--ax-color-primary-500));color:rgba(var(--ax-color-primary-fore))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible:not(ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible.ax-state-disabled){outline-width:2px;outline-color:rgba(var(--ax-color-primary-500))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible.ax-state-disabled{outline-style:dashed;outline-width:2px}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-disabled{cursor:not-allowed;opacity:.5}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-readonly{cursor:text;opacity:.75}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-1{grid-column-start:1}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-2{grid-column-start:2}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-3{grid-column-start:3}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-4{grid-column-start:4}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-5{grid-column-start:5}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-6{grid-column-start:6}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-7{grid-column-start:7}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-other{opacity:.05}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-today{border-width:1px;border-color:rgba(var(--ax-color-primary-500));color:rgba(var(--ax-color-primary-500))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-today.ax-state-holiday{border-color:rgba(var(--ax-color-danger-500))!important}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-focused{border-width:1px;border-color:rgba(var(--ax-color-border-default))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected{background-color:rgba(var(--ax-color-primary-500));color:rgba(var(--ax-color-primary-fore))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected.ax-state-holiday{background-color:rgba(var(--ax-color-danger-500))!important;color:rgba(var(--ax-color-danger-fore))!important}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected.ax-state-holiday{color:rgba(var(--ax-color-primary-fore))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday{color:rgba(var(--ax-color-danger-500))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday:hover{background-color:rgba(var(--ax-color-danger-500))!important;border-color:rgba(var(--ax-color-danger-500))!important}ax-calendar .ax-calendar-body .ax-calendar-slots.ax-calendar-slots-day{grid-template-columns:repeat(7,minmax(0,1fr))}ax-calendar .ax-calendar-body .ax-calendar-slots.ax-calendar-slots-year,ax-calendar .ax-calendar-body .ax-calendar-slots.ax-calendar-slots-month{grid-template-columns:repeat(4,minmax(0,1fr))}ax-calendar .ax-calendar-body .ax-calendar-week{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));padding-left:.5rem;padding-right:.5rem;padding-top:.75rem}ax-calendar .ax-calendar-body .ax-calendar-week>div{position:relative;margin:.125rem;display:flex;cursor:pointer;align-items:center;justify-content:center;text-align:center;font-size:.875rem;line-height:1.25rem}ax-calendar .ax-calendar-footer{margin-top:1.25rem;display:flex;align-items:center;justify-content:center}ax-calendar .ax-calendar-footer .ax-today-button{display:block;height:var(--ax-size-default);width:100%;cursor:pointer;border-radius:var(--ax-rounded-border-default);background-color:rgba(var(--ax-color-primary-500));padding-left:1rem;padding-right:1rem;text-align:center;font-size:.875rem;line-height:1.25rem;color:rgba(var(--ax-color-primary-fore))}ax-calendar .ax-calendar-footer .ax-today-button.ax-state-disabled{cursor:not-allowed;opacity:.5}ax-calendar .ax-calendar-footer .ax-today-button.ax-state-readonly{cursor:text;opacity:.75}ax-calendar .ax-calendar-footer .ax-today-button:is(ax-calendar .ax-calendar-footer .ax-today-button:hover):not(.ax-state-disabled){background-color:rgba(var(--ax-color-primary-600))}ax-calendar .ax-calendar-footer .ax-today-button:is(ax-calendar .ax-calendar-footer .ax-today-button:focus,ax-calendar .ax-calendar-footer .ax-today-button:focus-visible):not(.ax-state-disabled){outline-color:rgba(var(--ax-color-primary-500),1)}.ax-calendar-picker{display:flex;width:100%}.ax-calendar-picker ax-picker{flex:1 1 0%}.ax-overlay-pane ax-calendar{border-style:none}\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.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
704
|
+
], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"ax-header\"></ng-content>\n<div class=\"ax-calendar-body\">\n @for(v of views; let i = $index, first = $first, last = $last; track i){\n @switch (activeView) {\n @case ('year') {\n @if(showNavigation)\n {\n <div class=\"ax-calendar-view-header\">\n <div class=\"ax-calendar-header-info\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-state-disabled\" (click)=\"_handleNavClick($event, 'year')\">\n {{ v.range.startTime.format('YYYY') }} - {{ v.range.endTime.format('YYYY') }}\n </button>\n </div>\n @if(last){\n <div class=\"ax-calendar-header-buttons\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon ax-next\" (click)=\"_handlePrevClick()\"\n [title]=\"'prev' | translate | async\">\n <i class=\"ax-icon ax-icon-chevron-left\"></i>\n </button>\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handleNextClick()\"\n [title]=\"'next' | translate | async\">\n <i class=\"ax-icon ax-icon-chevron-right\"></i>\n </button>\n </div>\n }\n </div>\n }\n <div class=\"ax-calendar-slots ax-calendar-slots-year\" [ngClass]=\"{ 'ax-default': !cellTemplate }\">\n @for(slot of v.slots; track slot.text){\n <div tabindex=\"0\" class=\"ax-calendar-slot\" [ngClass]=\"slot.cssClass\" (click)=\"_handleSlotClick($event, slot)\">\n @if(cellTemplate){\n <div>\n <ng-container *ngTemplateOutlet=\"cellTemplate; context: { $implicit: { slot: slot } }\">\n </ng-container>\n </div>\n } @else {\n <div [title]=\"slot.tooltip\">\n {{ slot.text }}\n </div>\n }\n </div>\n }\n </div>\n }\n @case ('month') {\n @if(showNavigation)\n {\n <div class=\"ax-calendar-view-header\">\n <div class=\"ax-calendar-header-info\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded\" (click)=\"_handleNavClick($event, 'year')\">\n {{ v.range.startTime.format('YYYY') }}\n </button>\n </div>\n @if(last){\n <div class=\"ax-calendar-header-buttons\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handlePrevClick()\"\n [title]=\"'prev' | translate | async\">\n <i class=\"ax-icon ax-icon-chevron-left\"></i>\n </button>\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handleNextClick()\"\n [title]=\"'next' | translate | async\">\n <i class=\"ax-icon ax-icon-chevron-right\"></i>\n </button>\n </div>\n }\n </div>\n }\n <div class=\"ax-calendar-slots ax-calendar-slots-month\" [ngClass]=\"{ 'ax-default': !cellTemplate }\">\n <div tabindex=\"0\" *ngFor=\"let slot of v.slots\" class=\"ax-calendar-slot\" [ngClass]=\"slot.cssClass\"\n (click)=\"_handleSlotClick($event, slot)\">\n\n @if(cellTemplate){\n <div>\n <ng-container *ngTemplateOutlet=\"cellTemplate; context: { $implicit: { slot: slot } }\">\n </ng-container>\n </div>\n }@else {\n <div [title]=\"slot.tooltip\">\n {{getMonthName(slot.date,'short') | translate | async }}\n </div>\n }\n\n </div>\n </div>\n }\n @default {\n @if(showNavigation)\n {\n <div class=\"ax-calendar-view-header\">\n <div class=\"ax-calendar-header-info\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded\" (click)=\"_handleNavClick($event, 'year')\">\n {{ v.range.startTime.format('YYYY') }}\n </button>\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded\" (click)=\"_handleNavClick($event, 'month')\">\n {{getMonthName(v.range.startTime,'long') | translate | async }}\n </button>\n </div>\n @if(last){\n <div class=\"ax-calendar-header-buttons\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handlePrevClick()\"\n [title]=\"'prev' | translate | async\">\n <i class=\"ax-icon ax-icon-chevron-left\"></i>\n </button>\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handleNextClick()\"\n [title]=\"'next' | translate | async\">\n <i class=\"ax-icon ax-icon-chevron-right\"></i>\n </button>\n </div>\n }\n </div>\n }\n <div class=\"ax-calendar-week\">\n <div *ngFor=\"let d of _weekdays\">{{ ('dateTime.weekdays.short.'+d) | translate | async }}</div>\n </div>\n <div class=\"ax-calendar-slots ax-calendar-slots-day\" [ngClass]=\"{ 'ax-default': !cellTemplate }\">\n <ng-container *ngFor=\"let slot of v.slots\">\n <div tabindex=\"0\" class=\"ax-calendar-slot\" [ngClass]=\"slot.cssClass\" (click)=\"_handleSlotClick($event, slot)\">\n @if(cellTemplate){\n <div>\n <ng-container *ngTemplateOutlet=\"cellTemplate; context: { $implicit: { slot: slot } }\">\n </ng-container>\n </div>\n } @else{\n <div [title]=\"slot.tooltip\">\n {{ slot.text }}\n </div>\n }\n\n </div>\n </ng-container>\n </div>\n }\n }\n }\n\n</div>\n<ng-content select=\"ax-footer\"></ng-content>", styles: [".ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover:not(.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover.ax-state-disabled,.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover.ax-state-selected){background-color:rgba(var(--ax-color-primary-200));color:rgba(var(--ax-color-primary-fore-tint))}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible:not(.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible.ax-state-disabled){outline-color:rgba(var(--ax-color-primary-200))}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-today{border-color:rgba(var(--ax-color-primary-200));color:rgba(var(--ax-color-primary-200))}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-today.ax-state-holiday{color:rgba(var(--ax-color-danger-200))!important;border-color:rgba(var(--ax-color-danger-200))!important}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected{background-color:rgba(var(--ax-color-primary-200));color:rgba(var(--ax-color-primary-fore-tint))}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected.ax-state-holiday{outline-color:rgba(var(--ax-color-primary-200))!important;background-color:rgba(var(--ax-color-danger-200))!important;color:rgba(var(--ax-color-danger-fore-tint))!important}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected.ax-state-holiday:hover{background-color:rgba(var(--ax-color-danger-200))!important;border-color:rgba(var(--ax-color-danger-200))!important}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday{color:rgba(var(--ax-color-danger-200))}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday:hover{background-color:rgba(var(--ax-color-danger-200))!important;border-color:rgba(var(--ax-color-danger-200))!important;color:rgba(var(--ax-color-danger-fore-tint))!important}.ax-dark ax-calendar .ax-calendar-footer:is(.ax-dark ax-calendar .ax-calendar-footer:focus,.ax-dark ax-calendar .ax-calendar-footer:focus-visible):not(.ax-state-disabled){outline-color:rgba(var(--ax-color-primary-200))}html[dir=rtl] ax-calendar .ax-calendar-header-buttons .ax-icon{-moz-transform:scale(-1,1);-o-transform:scale(-1,1);-webkit-transform:scale(-1,1);transform:scaleX(-1)}ax-calendar{display:block;width:100%;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity));color:rgba(var(--ax-color-surface-fore),var(--tw-text-opacity))}ax-calendar.ax-state-disabled .ax-calendar-slots{cursor:not-allowed;opacity:.5}ax-calendar.ax-state-readonly .ax-calendar-slots{cursor:text}ax-calendar .ax-calendar-header{display:flex;justify-content:space-between;padding-left:.25rem;padding-right:.25rem;padding-top:.25rem}ax-calendar .ax-calendar-header .ax-calendar-header-info{font-weight:500}ax-calendar .ax-calendar-header .ax-calendar-header-buttons{display:flex}ax-calendar .ax-calendar-body{display:flex;flex-direction:column}@media (min-width: 1024px){ax-calendar .ax-calendar-body{flex-direction:column}}ax-calendar .ax-calendar-body>div{width:100%;flex:1 1 0%}@media (min-width: 768px){ax-calendar .ax-calendar-body>div{width:20rem}}ax-calendar .ax-calendar-body .ax-calendar-view-header{display:flex;justify-content:space-between;border-bottom-width:1px;border-color:rgba(var(--ax-color-border-default));padding:.5rem}ax-calendar .ax-calendar-body .ax-calendar-view-header .ax-calendar-header-info{font-weight:500}ax-calendar .ax-calendar-body .ax-calendar-view-header .ax-calendar-header-buttons{display:flex}ax-calendar .ax-calendar-body .ax-calendar-slots{display:grid;gap:.25rem;padding:1rem}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot{position:relative;display:flex;cursor:pointer;align-items:center;justify-content:center;border-radius:var(--ax-rounded-border-default);text-align:center;font-size:.875rem;line-height:1.25rem;color:rgba(var(--ax-color-surface-fore));transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:before{content:\"\";float:left;padding-top:100%}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:after{content:\"\";clear:both;display:block}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover:not(ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover.ax-state-disabled,ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover.ax-state-selected){background-color:rgba(var(--ax-color-primary-500));color:rgba(var(--ax-color-primary-fore))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible:not(ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible.ax-state-disabled){outline-width:2px;outline-color:rgba(var(--ax-color-primary-500))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible.ax-state-disabled{outline-style:dashed;outline-width:2px}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-disabled{cursor:not-allowed;opacity:.5}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-readonly{cursor:text;opacity:.75}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-1{grid-column-start:1}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-2{grid-column-start:2}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-3{grid-column-start:3}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-4{grid-column-start:4}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-5{grid-column-start:5}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-6{grid-column-start:6}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-7{grid-column-start:7}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-other{opacity:.05}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-today{border-width:1px;border-color:rgba(var(--ax-color-primary-500));color:rgba(var(--ax-color-primary-500))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-today.ax-state-holiday{border-color:rgba(var(--ax-color-danger-500))!important}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-focused{border-width:1px;border-color:rgba(var(--ax-color-border-default))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected{background-color:rgba(var(--ax-color-primary-500));color:rgba(var(--ax-color-primary-fore))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected.ax-state-holiday{background-color:rgba(var(--ax-color-danger-500))!important;color:rgba(var(--ax-color-danger-fore))!important}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected.ax-state-holiday{color:rgba(var(--ax-color-primary-fore))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday{color:rgba(var(--ax-color-danger-500))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday:hover{background-color:rgba(var(--ax-color-danger-500))!important;border-color:rgba(var(--ax-color-danger-500))!important}ax-calendar .ax-calendar-body .ax-calendar-slots.ax-calendar-slots-day{grid-template-columns:repeat(7,minmax(0,1fr))}ax-calendar .ax-calendar-body .ax-calendar-slots.ax-calendar-slots-year,ax-calendar .ax-calendar-body .ax-calendar-slots.ax-calendar-slots-month{grid-template-columns:repeat(4,minmax(0,1fr))}ax-calendar .ax-calendar-body .ax-calendar-week{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));padding-left:.5rem;padding-right:.5rem;padding-top:.75rem}ax-calendar .ax-calendar-body .ax-calendar-week>div{position:relative;margin:.125rem;display:flex;cursor:pointer;align-items:center;justify-content:center;text-align:center;font-size:.875rem;line-height:1.25rem}ax-calendar .ax-calendar-footer{margin-top:1.25rem;display:flex;align-items:center;justify-content:center}ax-calendar .ax-calendar-footer .ax-today-button{display:block;height:var(--ax-size-default);width:100%;cursor:pointer;border-radius:var(--ax-rounded-border-default);background-color:rgba(var(--ax-color-primary-500));padding-left:1rem;padding-right:1rem;text-align:center;font-size:.875rem;line-height:1.25rem;color:rgba(var(--ax-color-primary-fore))}ax-calendar .ax-calendar-footer .ax-today-button.ax-state-disabled{cursor:not-allowed;opacity:.5}ax-calendar .ax-calendar-footer .ax-today-button.ax-state-readonly{cursor:text;opacity:.75}ax-calendar .ax-calendar-footer .ax-today-button:is(ax-calendar .ax-calendar-footer .ax-today-button:hover):not(.ax-state-disabled){background-color:rgba(var(--ax-color-primary-600))}ax-calendar .ax-calendar-footer .ax-today-button:is(ax-calendar .ax-calendar-footer .ax-today-button:focus,ax-calendar .ax-calendar-footer .ax-today-button:focus-visible):not(.ax-state-disabled){outline-color:rgba(var(--ax-color-primary-500),1)}.ax-calendar-picker{display:flex;width:100%}.ax-calendar-picker ax-picker{flex:1 1 0%}.ax-overlay-pane ax-calendar{border-style:none}\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.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
705
705
|
}
|
|
706
706
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXCalendarComponent, decorators: [{
|
|
707
707
|
type: Component,
|
|
@@ -751,7 +751,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImpor
|
|
|
751
751
|
useExisting: AXCalendarComponent,
|
|
752
752
|
},
|
|
753
753
|
AXUnsubscriber,
|
|
754
|
-
], template: "<ng-content select=\"ax-header\"></ng-content>\n<div class=\"ax-calendar-body\">\n @for(v of views; let i = $index, first = $first, last = $last; track i){\n @switch (activeView) {\n @case ('year') {\n @if(showNavigation)\n {\n <div class=\"ax-calendar-view-header\">\n <div class=\"ax-calendar-header-info\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-state-disabled\" (click)=\"_handleNavClick($event, 'year')\">\n {{ v.range.startTime.format('YYYY') }} - {{ v.range.endTime.format('YYYY') }}\n </button>\n </div>\n @if(last){\n <div class=\"ax-calendar-header-buttons\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon ax-next\" (click)=\"_handlePrevClick()\"\n [title]=\"'prev' | translate | async\">\n <i class=\"ax-icon ax-icon-chevron-left\"></i>\n </button>\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handleNextClick()\"\n [title]=\"'next' | translate | async\">\n <i class=\"ax-icon ax-icon-chevron-right\"></i>\n </button>\n </div>\n }\n </div>\n }\n <div class=\"ax-calendar-slots ax-calendar-slots-year\" [ngClass]=\"{ 'ax-default': !cellTemplate }\">\n @for(slot of v.slots; track slot.text){\n <div tabindex=\"0\" class=\"ax-calendar-slot\" [ngClass]=\"slot.cssClass\" (click)=\"_handleSlotClick($event, slot)\">\n @if(cellTemplate){\n <div>\n <ng-container *ngTemplateOutlet=\"cellTemplate; context: { $implicit: { slot: slot } }\">\n </ng-container>\n </div>\n } @else {\n <div [title]=\"slot.tooltip\">\n {{ slot.text }}\n </div>\n }\n </div>\n }\n </div>\n }\n @case ('month') {\n @if(showNavigation)\n {\n <div class=\"ax-calendar-view-header\">\n <div class=\"ax-calendar-header-info\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded\" (click)=\"_handleNavClick($event, 'year')\">\n {{ v.range.startTime.format('YYYY') }}\n </button>\n </div>\n @if(last){\n <div class=\"ax-calendar-header-buttons\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handlePrevClick()\"\n [title]=\"'prev' | translate | async\">\n <i class=\"ax-icon ax-icon-chevron-left\"></i>\n </button>\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handleNextClick()\"\n [title]=\"'next' | translate | async\">\n <i class=\"ax-icon ax-icon-chevron-right\"></i>\n </button>\n </div>\n }\n </div>\n }\n <div class=\"ax-calendar-slots ax-calendar-slots-month\" [ngClass]=\"{ 'ax-default': !cellTemplate }\">\n <div tabindex=\"0\" *ngFor=\"let slot of v.slots\" class=\"ax-calendar-slot\" [ngClass]=\"slot.cssClass\"\n (click)=\"_handleSlotClick($event, slot)\">\n\n @if(cellTemplate){\n <div>\n <ng-container *ngTemplateOutlet=\"cellTemplate; context: { $implicit: { slot: slot } }\">\n </ng-container>\n </div>\n }@else {\n <div [title]=\"slot.tooltip\">\n {{getMonthName(slot.date,'short') | translate | async }}\n </div>\n }\n\n </div>\n </div>\n }\n @default {\n @if(showNavigation)\n {\n <div class=\"ax-calendar-view-header\">\n <div class=\"ax-calendar-header-info\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded\" (click)=\"_handleNavClick($event, 'year')\">\n {{ v.range.startTime.format('YYYY') }}\n </button>\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded\" (click)=\"_handleNavClick($event, 'month')\">\n {{getMonthName(v.range.startTime,'long') | translate | async }}\n </button>\n </div>\n @if(last){\n <div class=\"ax-calendar-header-buttons\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handlePrevClick()\"\n [title]=\"'prev' | translate | async\">\n <i class=\"ax-icon ax-icon-chevron-left\"></i>\n </button>\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handleNextClick()\"\n [title]=\"'next' | translate | async\">\n <i class=\"ax-icon ax-icon-chevron-right\"></i>\n </button>\n </div>\n }\n </div>\n }\n <div class=\"ax-calendar-week\">\n <div *ngFor=\"let d of _weekdays\">{{ ('dateTime.weekdays.short.'+d) | translate | async }}</div>\n </div>\n <div class=\"ax-calendar-slots ax-calendar-slots-day\" [ngClass]=\"{ 'ax-default': !cellTemplate }\">\n <ng-container *ngFor=\"let slot of v.slots\">\n <div tabindex=\"0\" class=\"ax-calendar-slot\" [ngClass]=\"slot.cssClass\" (click)=\"_handleSlotClick($event, slot)\">\n @if(cellTemplate){\n <div>\n <ng-container *ngTemplateOutlet=\"cellTemplate; context: { $implicit: { slot: slot } }\">\n </ng-container>\n </div>\n } @else{\n <div [title]=\"slot.tooltip\">\n {{ slot.text }}\n </div>\n }\n\n </div>\n </ng-container>\n </div>\n }\n }\n }\n\n</div>\n<ng-content select=\"ax-footer\"></ng-content>", styles: [".ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover:not(.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover.ax-state-disabled,.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover.ax-state-selected){background-color:rgba(var(--ax-color-primary-200));color:rgba(var(--ax-color-primary-fore-tint))}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible:not(.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible.ax-state-disabled){outline-color:rgba(var(--ax-color-primary-200))}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-today{border-color:rgba(var(--ax-color-primary-200));color:rgba(var(--ax-color-primary-200))}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-today.ax-state-holiday{color:rgba(var(--ax-color-danger-200))!important;border-color:rgba(var(--ax-color-danger-200))!important}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected{background-color:rgba(var(--ax-color-primary-200));color:rgba(var(--ax-color-primary-fore-tint))}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected.ax-state-holiday{outline-color:rgba(var(--ax-color-primary-200))!important;background-color:rgba(var(--ax-color-danger-200))!important;color:rgba(var(--ax-color-danger-fore-tint))!important}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected.ax-state-holiday:hover{background-color:rgba(var(--ax-color-danger-200))!important;border-color:rgba(var(--ax-color-danger-200))!important}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday{color:rgba(var(--ax-color-danger-200))}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday:hover{background-color:rgba(var(--ax-color-danger-200))!important;border-color:rgba(var(--ax-color-danger-200))!important;color:rgba(var(--ax-color-danger-fore-tint))!important}.ax-dark ax-calendar .ax-calendar-footer:is(.ax-dark ax-calendar .ax-calendar-footer:focus,.ax-dark ax-calendar .ax-calendar-footer:focus-visible):not(.ax-state-disabled){outline-color:rgba(var(--ax-color-primary-200))}html[dir=rtl] ax-calendar .ax-calendar-header-buttons .ax-icon{-moz-transform:scale(-1,1);-o-transform:scale(-1,1);-webkit-transform:scale(-1,1);transform:scaleX(-1)}ax-calendar{display:block;width:100%;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity));color:rgba(var(--ax-color-surface-fore),var(--tw-text-opacity))}ax-calendar.ax-state-disabled .ax-calendar-slots{cursor:not-allowed;opacity:.5}ax-calendar.ax-state-readonly .ax-calendar-slots{cursor:text;opacity:.75}ax-calendar .ax-calendar-header{display:flex;justify-content:space-between;padding-left:.25rem;padding-right:.25rem;padding-top:.25rem}ax-calendar .ax-calendar-header .ax-calendar-header-info{font-weight:500}ax-calendar .ax-calendar-header .ax-calendar-header-buttons{display:flex}ax-calendar .ax-calendar-body{display:flex;flex-direction:column}@media (min-width: 1024px){ax-calendar .ax-calendar-body{flex-direction:column}}ax-calendar .ax-calendar-body>div{width:100%;flex:1 1 0%}@media (min-width: 768px){ax-calendar .ax-calendar-body>div{width:20rem}}ax-calendar .ax-calendar-body .ax-calendar-view-header{display:flex;justify-content:space-between;border-bottom-width:1px;border-color:rgba(var(--ax-color-border-default));padding:.5rem}ax-calendar .ax-calendar-body .ax-calendar-view-header .ax-calendar-header-info{font-weight:500}ax-calendar .ax-calendar-body .ax-calendar-view-header .ax-calendar-header-buttons{display:flex}ax-calendar .ax-calendar-body .ax-calendar-slots{display:grid;gap:.25rem;padding:1rem}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot{position:relative;display:flex;cursor:pointer;align-items:center;justify-content:center;border-radius:var(--ax-rounded-border-default);text-align:center;font-size:.875rem;line-height:1.25rem;color:rgba(var(--ax-color-surface-fore));transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:before{content:\"\";float:left;padding-top:100%}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:after{content:\"\";clear:both;display:block}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover:not(ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover.ax-state-disabled,ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover.ax-state-selected){background-color:rgba(var(--ax-color-primary-500));color:rgba(var(--ax-color-primary-fore))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible:not(ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible.ax-state-disabled){outline-width:2px;outline-color:rgba(var(--ax-color-primary-500))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible.ax-state-disabled{outline-style:dashed;outline-width:2px}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-disabled{cursor:not-allowed;opacity:.5}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-readonly{cursor:text;opacity:.75}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-1{grid-column-start:1}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-2{grid-column-start:2}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-3{grid-column-start:3}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-4{grid-column-start:4}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-5{grid-column-start:5}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-6{grid-column-start:6}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-7{grid-column-start:7}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-other{opacity:.05}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-today{border-width:1px;border-color:rgba(var(--ax-color-primary-500));color:rgba(var(--ax-color-primary-500))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-today.ax-state-holiday{border-color:rgba(var(--ax-color-danger-500))!important}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-focused{border-width:1px;border-color:rgba(var(--ax-color-border-default))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected{background-color:rgba(var(--ax-color-primary-500));color:rgba(var(--ax-color-primary-fore))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected.ax-state-holiday{background-color:rgba(var(--ax-color-danger-500))!important;color:rgba(var(--ax-color-danger-fore))!important}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected.ax-state-holiday{color:rgba(var(--ax-color-primary-fore))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday{color:rgba(var(--ax-color-danger-500))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday:hover{background-color:rgba(var(--ax-color-danger-500))!important;border-color:rgba(var(--ax-color-danger-500))!important}ax-calendar .ax-calendar-body .ax-calendar-slots.ax-calendar-slots-day{grid-template-columns:repeat(7,minmax(0,1fr))}ax-calendar .ax-calendar-body .ax-calendar-slots.ax-calendar-slots-year,ax-calendar .ax-calendar-body .ax-calendar-slots.ax-calendar-slots-month{grid-template-columns:repeat(4,minmax(0,1fr))}ax-calendar .ax-calendar-body .ax-calendar-week{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));padding-left:.5rem;padding-right:.5rem;padding-top:.75rem}ax-calendar .ax-calendar-body .ax-calendar-week>div{position:relative;margin:.125rem;display:flex;cursor:pointer;align-items:center;justify-content:center;text-align:center;font-size:.875rem;line-height:1.25rem}ax-calendar .ax-calendar-footer{margin-top:1.25rem;display:flex;align-items:center;justify-content:center}ax-calendar .ax-calendar-footer .ax-today-button{display:block;height:var(--ax-size-default);width:100%;cursor:pointer;border-radius:var(--ax-rounded-border-default);background-color:rgba(var(--ax-color-primary-500));padding-left:1rem;padding-right:1rem;text-align:center;font-size:.875rem;line-height:1.25rem;color:rgba(var(--ax-color-primary-fore))}ax-calendar .ax-calendar-footer .ax-today-button.ax-state-disabled{cursor:not-allowed;opacity:.5}ax-calendar .ax-calendar-footer .ax-today-button.ax-state-readonly{cursor:text;opacity:.75}ax-calendar .ax-calendar-footer .ax-today-button:is(ax-calendar .ax-calendar-footer .ax-today-button:hover):not(.ax-state-disabled){background-color:rgba(var(--ax-color-primary-600))}ax-calendar .ax-calendar-footer .ax-today-button:is(ax-calendar .ax-calendar-footer .ax-today-button:focus,ax-calendar .ax-calendar-footer .ax-today-button:focus-visible):not(.ax-state-disabled){outline-color:rgba(var(--ax-color-primary-500),1)}.ax-calendar-picker{display:flex;width:100%}.ax-calendar-picker ax-picker{flex:1 1 0%}.ax-overlay-pane ax-calendar{border-style:none}\n"] }]
|
|
754
|
+
], template: "<ng-content select=\"ax-header\"></ng-content>\n<div class=\"ax-calendar-body\">\n @for(v of views; let i = $index, first = $first, last = $last; track i){\n @switch (activeView) {\n @case ('year') {\n @if(showNavigation)\n {\n <div class=\"ax-calendar-view-header\">\n <div class=\"ax-calendar-header-info\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-state-disabled\" (click)=\"_handleNavClick($event, 'year')\">\n {{ v.range.startTime.format('YYYY') }} - {{ v.range.endTime.format('YYYY') }}\n </button>\n </div>\n @if(last){\n <div class=\"ax-calendar-header-buttons\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon ax-next\" (click)=\"_handlePrevClick()\"\n [title]=\"'prev' | translate | async\">\n <i class=\"ax-icon ax-icon-chevron-left\"></i>\n </button>\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handleNextClick()\"\n [title]=\"'next' | translate | async\">\n <i class=\"ax-icon ax-icon-chevron-right\"></i>\n </button>\n </div>\n }\n </div>\n }\n <div class=\"ax-calendar-slots ax-calendar-slots-year\" [ngClass]=\"{ 'ax-default': !cellTemplate }\">\n @for(slot of v.slots; track slot.text){\n <div tabindex=\"0\" class=\"ax-calendar-slot\" [ngClass]=\"slot.cssClass\" (click)=\"_handleSlotClick($event, slot)\">\n @if(cellTemplate){\n <div>\n <ng-container *ngTemplateOutlet=\"cellTemplate; context: { $implicit: { slot: slot } }\">\n </ng-container>\n </div>\n } @else {\n <div [title]=\"slot.tooltip\">\n {{ slot.text }}\n </div>\n }\n </div>\n }\n </div>\n }\n @case ('month') {\n @if(showNavigation)\n {\n <div class=\"ax-calendar-view-header\">\n <div class=\"ax-calendar-header-info\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded\" (click)=\"_handleNavClick($event, 'year')\">\n {{ v.range.startTime.format('YYYY') }}\n </button>\n </div>\n @if(last){\n <div class=\"ax-calendar-header-buttons\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handlePrevClick()\"\n [title]=\"'prev' | translate | async\">\n <i class=\"ax-icon ax-icon-chevron-left\"></i>\n </button>\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handleNextClick()\"\n [title]=\"'next' | translate | async\">\n <i class=\"ax-icon ax-icon-chevron-right\"></i>\n </button>\n </div>\n }\n </div>\n }\n <div class=\"ax-calendar-slots ax-calendar-slots-month\" [ngClass]=\"{ 'ax-default': !cellTemplate }\">\n <div tabindex=\"0\" *ngFor=\"let slot of v.slots\" class=\"ax-calendar-slot\" [ngClass]=\"slot.cssClass\"\n (click)=\"_handleSlotClick($event, slot)\">\n\n @if(cellTemplate){\n <div>\n <ng-container *ngTemplateOutlet=\"cellTemplate; context: { $implicit: { slot: slot } }\">\n </ng-container>\n </div>\n }@else {\n <div [title]=\"slot.tooltip\">\n {{getMonthName(slot.date,'short') | translate | async }}\n </div>\n }\n\n </div>\n </div>\n }\n @default {\n @if(showNavigation)\n {\n <div class=\"ax-calendar-view-header\">\n <div class=\"ax-calendar-header-info\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded\" (click)=\"_handleNavClick($event, 'year')\">\n {{ v.range.startTime.format('YYYY') }}\n </button>\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded\" (click)=\"_handleNavClick($event, 'month')\">\n {{getMonthName(v.range.startTime,'long') | translate | async }}\n </button>\n </div>\n @if(last){\n <div class=\"ax-calendar-header-buttons\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handlePrevClick()\"\n [title]=\"'prev' | translate | async\">\n <i class=\"ax-icon ax-icon-chevron-left\"></i>\n </button>\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" [attr.readonly]=\"readonly ? '' : null\"\n class=\"ax-general-button ax-button-rounded ax-button-icon\" (click)=\"_handleNextClick()\"\n [title]=\"'next' | translate | async\">\n <i class=\"ax-icon ax-icon-chevron-right\"></i>\n </button>\n </div>\n }\n </div>\n }\n <div class=\"ax-calendar-week\">\n <div *ngFor=\"let d of _weekdays\">{{ ('dateTime.weekdays.short.'+d) | translate | async }}</div>\n </div>\n <div class=\"ax-calendar-slots ax-calendar-slots-day\" [ngClass]=\"{ 'ax-default': !cellTemplate }\">\n <ng-container *ngFor=\"let slot of v.slots\">\n <div tabindex=\"0\" class=\"ax-calendar-slot\" [ngClass]=\"slot.cssClass\" (click)=\"_handleSlotClick($event, slot)\">\n @if(cellTemplate){\n <div>\n <ng-container *ngTemplateOutlet=\"cellTemplate; context: { $implicit: { slot: slot } }\">\n </ng-container>\n </div>\n } @else{\n <div [title]=\"slot.tooltip\">\n {{ slot.text }}\n </div>\n }\n\n </div>\n </ng-container>\n </div>\n }\n }\n }\n\n</div>\n<ng-content select=\"ax-footer\"></ng-content>", styles: [".ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover:not(.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover.ax-state-disabled,.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover.ax-state-selected){background-color:rgba(var(--ax-color-primary-200));color:rgba(var(--ax-color-primary-fore-tint))}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible:not(.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible.ax-state-disabled){outline-color:rgba(var(--ax-color-primary-200))}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-today{border-color:rgba(var(--ax-color-primary-200));color:rgba(var(--ax-color-primary-200))}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-today.ax-state-holiday{color:rgba(var(--ax-color-danger-200))!important;border-color:rgba(var(--ax-color-danger-200))!important}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected{background-color:rgba(var(--ax-color-primary-200));color:rgba(var(--ax-color-primary-fore-tint))}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected.ax-state-holiday{outline-color:rgba(var(--ax-color-primary-200))!important;background-color:rgba(var(--ax-color-danger-200))!important;color:rgba(var(--ax-color-danger-fore-tint))!important}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected.ax-state-holiday:hover{background-color:rgba(var(--ax-color-danger-200))!important;border-color:rgba(var(--ax-color-danger-200))!important}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday{color:rgba(var(--ax-color-danger-200))}.ax-dark ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday:hover{background-color:rgba(var(--ax-color-danger-200))!important;border-color:rgba(var(--ax-color-danger-200))!important;color:rgba(var(--ax-color-danger-fore-tint))!important}.ax-dark ax-calendar .ax-calendar-footer:is(.ax-dark ax-calendar .ax-calendar-footer:focus,.ax-dark ax-calendar .ax-calendar-footer:focus-visible):not(.ax-state-disabled){outline-color:rgba(var(--ax-color-primary-200))}html[dir=rtl] ax-calendar .ax-calendar-header-buttons .ax-icon{-moz-transform:scale(-1,1);-o-transform:scale(-1,1);-webkit-transform:scale(-1,1);transform:scaleX(-1)}ax-calendar{display:block;width:100%;background-color:rgba(var(--ax-color-surface),var(--tw-bg-opacity));color:rgba(var(--ax-color-surface-fore),var(--tw-text-opacity))}ax-calendar.ax-state-disabled .ax-calendar-slots{cursor:not-allowed;opacity:.5}ax-calendar.ax-state-readonly .ax-calendar-slots{cursor:text}ax-calendar .ax-calendar-header{display:flex;justify-content:space-between;padding-left:.25rem;padding-right:.25rem;padding-top:.25rem}ax-calendar .ax-calendar-header .ax-calendar-header-info{font-weight:500}ax-calendar .ax-calendar-header .ax-calendar-header-buttons{display:flex}ax-calendar .ax-calendar-body{display:flex;flex-direction:column}@media (min-width: 1024px){ax-calendar .ax-calendar-body{flex-direction:column}}ax-calendar .ax-calendar-body>div{width:100%;flex:1 1 0%}@media (min-width: 768px){ax-calendar .ax-calendar-body>div{width:20rem}}ax-calendar .ax-calendar-body .ax-calendar-view-header{display:flex;justify-content:space-between;border-bottom-width:1px;border-color:rgba(var(--ax-color-border-default));padding:.5rem}ax-calendar .ax-calendar-body .ax-calendar-view-header .ax-calendar-header-info{font-weight:500}ax-calendar .ax-calendar-body .ax-calendar-view-header .ax-calendar-header-buttons{display:flex}ax-calendar .ax-calendar-body .ax-calendar-slots{display:grid;gap:.25rem;padding:1rem}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot{position:relative;display:flex;cursor:pointer;align-items:center;justify-content:center;border-radius:var(--ax-rounded-border-default);text-align:center;font-size:.875rem;line-height:1.25rem;color:rgba(var(--ax-color-surface-fore));transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:before{content:\"\";float:left;padding-top:100%}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:after{content:\"\";clear:both;display:block}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover:not(ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover.ax-state-disabled,ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:hover.ax-state-selected){background-color:rgba(var(--ax-color-primary-500));color:rgba(var(--ax-color-primary-fore))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible:not(ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible.ax-state-disabled){outline-width:2px;outline-color:rgba(var(--ax-color-primary-500))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot:focus-visible.ax-state-disabled{outline-style:dashed;outline-width:2px}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-disabled{cursor:not-allowed;opacity:.5}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-readonly{cursor:text;opacity:.75}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-1{grid-column-start:1}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-2{grid-column-start:2}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-3{grid-column-start:3}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-4{grid-column-start:4}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-5{grid-column-start:5}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-6{grid-column-start:6}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-column-start-7{grid-column-start:7}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-other{opacity:.05}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-today{border-width:1px;border-color:rgba(var(--ax-color-primary-500));color:rgba(var(--ax-color-primary-500))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-today.ax-state-holiday{border-color:rgba(var(--ax-color-danger-500))!important}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-focused{border-width:1px;border-color:rgba(var(--ax-color-border-default))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected{background-color:rgba(var(--ax-color-primary-500));color:rgba(var(--ax-color-primary-fore))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected.ax-state-holiday{background-color:rgba(var(--ax-color-danger-500))!important;color:rgba(var(--ax-color-danger-fore))!important}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-selected.ax-state-holiday{color:rgba(var(--ax-color-primary-fore))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday{color:rgba(var(--ax-color-danger-500))}ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-state-holiday:hover{background-color:rgba(var(--ax-color-danger-500))!important;border-color:rgba(var(--ax-color-danger-500))!important}ax-calendar .ax-calendar-body .ax-calendar-slots.ax-calendar-slots-day{grid-template-columns:repeat(7,minmax(0,1fr))}ax-calendar .ax-calendar-body .ax-calendar-slots.ax-calendar-slots-year,ax-calendar .ax-calendar-body .ax-calendar-slots.ax-calendar-slots-month{grid-template-columns:repeat(4,minmax(0,1fr))}ax-calendar .ax-calendar-body .ax-calendar-week{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));padding-left:.5rem;padding-right:.5rem;padding-top:.75rem}ax-calendar .ax-calendar-body .ax-calendar-week>div{position:relative;margin:.125rem;display:flex;cursor:pointer;align-items:center;justify-content:center;text-align:center;font-size:.875rem;line-height:1.25rem}ax-calendar .ax-calendar-footer{margin-top:1.25rem;display:flex;align-items:center;justify-content:center}ax-calendar .ax-calendar-footer .ax-today-button{display:block;height:var(--ax-size-default);width:100%;cursor:pointer;border-radius:var(--ax-rounded-border-default);background-color:rgba(var(--ax-color-primary-500));padding-left:1rem;padding-right:1rem;text-align:center;font-size:.875rem;line-height:1.25rem;color:rgba(var(--ax-color-primary-fore))}ax-calendar .ax-calendar-footer .ax-today-button.ax-state-disabled{cursor:not-allowed;opacity:.5}ax-calendar .ax-calendar-footer .ax-today-button.ax-state-readonly{cursor:text;opacity:.75}ax-calendar .ax-calendar-footer .ax-today-button:is(ax-calendar .ax-calendar-footer .ax-today-button:hover):not(.ax-state-disabled){background-color:rgba(var(--ax-color-primary-600))}ax-calendar .ax-calendar-footer .ax-today-button:is(ax-calendar .ax-calendar-footer .ax-today-button:focus,ax-calendar .ax-calendar-footer .ax-today-button:focus-visible):not(.ax-state-disabled){outline-color:rgba(var(--ax-color-primary-500),1)}.ax-calendar-picker{display:flex;width:100%}.ax-calendar-picker ax-picker{flex:1 1 0%}.ax-overlay-pane ax-calendar{border-style:none}\n"] }]
|
|
755
755
|
}], ctorParameters: () => [{ type: i1.AXUnsubscriber }], propDecorators: { __hostClass: [{
|
|
756
756
|
type: HostBinding,
|
|
757
757
|
args: ['class']
|
|
@@ -819,8 +819,9 @@ class AXCalendarRangeComponent extends classes((MXValueComponent), MXInteractive
|
|
|
819
819
|
}
|
|
820
820
|
}
|
|
821
821
|
else {
|
|
822
|
-
if (e.component == this._c1)
|
|
822
|
+
if (e.component == this._c1) {
|
|
823
823
|
this._syncNav1();
|
|
824
|
+
}
|
|
824
825
|
if (e.component == this._c2) {
|
|
825
826
|
this._syncNav2(this._calendarService.create(e.item, this.type));
|
|
826
827
|
}
|
|
@@ -930,7 +931,17 @@ class AXCalendarRangeComponent extends classes((MXValueComponent), MXInteractive
|
|
|
930
931
|
}
|
|
931
932
|
}
|
|
932
933
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXCalendarRangeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
933
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.0", type: AXCalendarRangeComponent, selector: "ax-calendar-range", inputs: { rtl: "rtl", readonly: "readonly", value: "value", name: "name", disabled: "disabled", depth: "depth", activeView: "activeView", minValue: "minValue", maxValue: "maxValue", disabledDates: "disabledDates", holidayDates: "holidayDates", type: "type", cellTemplate: "cellTemplate", cellClass: "cellClass", showNavigation: "showNavigation" }, outputs: { onOptionChanged: "onOptionChanged", valueChange: "valueChange", onValueChanged: "onValueChanged", onBlur: "onBlur", onFocus: "onFocus", depthChange: "depthChange", typeChange: "typeChange", activeViewChange: "activeViewChange", disabledDatesChange: "disabledDatesChange", holidayDatesChange: "holidayDatesChange", onNavigate: "onNavigate", onSlotClick: "onSlotClick" },
|
|
934
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.0", type: AXCalendarRangeComponent, selector: "ax-calendar-range", inputs: { rtl: "rtl", readonly: "readonly", value: "value", name: "name", disabled: "disabled", depth: "depth", activeView: "activeView", minValue: "minValue", maxValue: "maxValue", disabledDates: "disabledDates", holidayDates: "holidayDates", type: "type", cellTemplate: "cellTemplate", cellClass: "cellClass", showNavigation: "showNavigation" }, outputs: { onOptionChanged: "onOptionChanged", valueChange: "valueChange", onValueChanged: "onValueChanged", onBlur: "onBlur", onFocus: "onFocus", depthChange: "depthChange", typeChange: "typeChange", activeViewChange: "activeViewChange", disabledDatesChange: "disabledDatesChange", holidayDatesChange: "holidayDatesChange", onNavigate: "onNavigate", onSlotClick: "onSlotClick" }, providers: [
|
|
935
|
+
{
|
|
936
|
+
provide: NG_VALUE_ACCESSOR,
|
|
937
|
+
useExisting: forwardRef(() => AXCalendarRangeComponent),
|
|
938
|
+
multi: true,
|
|
939
|
+
},
|
|
940
|
+
{
|
|
941
|
+
provide: AXValuableComponent,
|
|
942
|
+
useExisting: AXCalendarRangeComponent,
|
|
943
|
+
},
|
|
944
|
+
], viewQueries: [{ propertyName: "_c1", first: true, predicate: ["c1"], descendants: true, static: true }, { propertyName: "_c2", first: true, predicate: ["c2"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"ax-calendar-range-header\">\n <ng-content></ng-content>\n <div class=\"ax-calendar-header-range-info\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" class=\"ax-general-button\"\n (click)=\"handleNavClick()\">\n {{ _navText }}\n </button>\n </div>\n <div class=\"ax-calendar-header-range-buttons\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" class=\"ax-general-button ax-button-icon\"\n (click)=\"handlePrevClick()\">\n <i class=\"ax-icon\" [ngClass]=\"{\n 'ax-icon-chevron-left': !rtl,\n 'ax-icon-chevron-right': rtl\n }\"></i>\n </button>\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" class=\"ax-general-button ax-button-icon\"\n (click)=\"handleNextClick()\">\n <i class=\"ax-icon\" [ngClass]=\"{\n 'ax-icon-chevron-left': rtl,\n 'ax-icon-chevron-right': !rtl\n }\"></i>\n </button>\n </div>\n</div>\n<div class=\"ax-calendar-range-body\">\n <ax-calendar #c1 [showNavigation]=\"false\" [readonly]=\"true\" [cellClass]=\"getCellClass\" [type]=\"type\"\n [cellTemplate]=\"cellTemplate\" [minValue]=\"minValue\" [maxValue]=\"maxValue\" [depth]=\"depth\"\n (onSlotClick)=\"handleSlotClick($event)\" (onNavigate)=\"handleNavigate()\"\n (activeViewChange)=\"handleActiveViewChange1()\">\n </ax-calendar>\n <ax-calendar #c2 [showNavigation]=\"false\" [readonly]=\"true\" [cellClass]=\"getCellClass\" [type]=\"type\"\n [cellTemplate]=\"cellTemplate\" [minValue]=\"minValue\" [maxValue]=\"maxValue\" [depth]=\"depth\"\n (onSlotClick)=\"handleSlotClick($event)\" (activeViewChange)=\"handleActiveViewChange2()\">\n </ax-calendar>\n</div>", styles: [".ax-dark ax-calendar-range{background-color:rgba(var(--ax-color-background-default))}.ax-dark ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-range-between{background-color:rgba(var(--ax-color-primary-800));color:rgba(var(--ax-color-primary-fore))}ax-calendar-range{background-color:rgba(var(--ax-color-surface));padding:.5rem;color:rgb(var(--ax-color-text-default));display:block}ax-calendar-range .ax-calendar-range-header{display:flex;justify-content:space-between;padding-left:.25rem;padding-right:.25rem;padding-top:.25rem}ax-calendar-range .ax-calendar-range-header .ax-calendar-header-range-info{font-weight:500}ax-calendar-range .ax-calendar-range-header .ax-calendar-header-range-buttons{display:flex}ax-calendar-range .ax-calendar-range-body{display:flex;flex-direction:row}@media (min-width: 320px) and (max-width: 600px){ax-calendar-range .ax-calendar-range-body{flex-direction:column}}ax-calendar-range ax-calendar{margin:0;padding:0}ax-calendar-range ax-calendar .ax-calendar-body{margin-top:0;padding-top:0}ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-range-between{background-color:rgba(var(--ax-color-primary-200));color:rgba(var(--ax-color-primary-fore-tint))}ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-range-start,ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-range-end{background-color:rgba(var(--ax-color-primary-500));color:rgba(var(--ax-color-primary-fore))}@media (min-width: 768px){ax-calendar-range ax-calendar .ax-calendar-body>div{width:100%!important}}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: AXCalendarComponent, selector: "ax-calendar", inputs: ["rtl", "readonly", "value", "name", "disabled", "depth", "activeView", "minValue", "maxValue", "disabledDates", "holidayDates", "type", "cellTemplate", "cellClass", "showNavigation", "count", "id"], outputs: ["onOptionChanged", "valueChange", "onValueChanged", "minValueChange", "maxValueChange", "onBlur", "onFocus", "depthChange", "typeChange", "activeViewChange", "disabledDatesChange", "holidayDatesChange", "onNavigate", "onSlotClick", "countChange"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
934
945
|
}
|
|
935
946
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AXCalendarRangeComponent, decorators: [{
|
|
936
947
|
type: Component,
|
|
@@ -963,7 +974,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImpor
|
|
|
963
974
|
'holidayDatesChange',
|
|
964
975
|
'onNavigate',
|
|
965
976
|
'onSlotClick',
|
|
966
|
-
],
|
|
977
|
+
], providers: [
|
|
978
|
+
{
|
|
979
|
+
provide: NG_VALUE_ACCESSOR,
|
|
980
|
+
useExisting: forwardRef(() => AXCalendarRangeComponent),
|
|
981
|
+
multi: true,
|
|
982
|
+
},
|
|
983
|
+
{
|
|
984
|
+
provide: AXValuableComponent,
|
|
985
|
+
useExisting: AXCalendarRangeComponent,
|
|
986
|
+
},
|
|
987
|
+
], template: "<div class=\"ax-calendar-range-header\">\n <ng-content></ng-content>\n <div class=\"ax-calendar-header-range-info\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" class=\"ax-general-button\"\n (click)=\"handleNavClick()\">\n {{ _navText }}\n </button>\n </div>\n <div class=\"ax-calendar-header-range-buttons\">\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" class=\"ax-general-button ax-button-icon\"\n (click)=\"handlePrevClick()\">\n <i class=\"ax-icon\" [ngClass]=\"{\n 'ax-icon-chevron-left': !rtl,\n 'ax-icon-chevron-right': rtl\n }\"></i>\n </button>\n <button type=\"button\" [attr.disabled]=\"disabled ? '' : null\" class=\"ax-general-button ax-button-icon\"\n (click)=\"handleNextClick()\">\n <i class=\"ax-icon\" [ngClass]=\"{\n 'ax-icon-chevron-left': rtl,\n 'ax-icon-chevron-right': !rtl\n }\"></i>\n </button>\n </div>\n</div>\n<div class=\"ax-calendar-range-body\">\n <ax-calendar #c1 [showNavigation]=\"false\" [readonly]=\"true\" [cellClass]=\"getCellClass\" [type]=\"type\"\n [cellTemplate]=\"cellTemplate\" [minValue]=\"minValue\" [maxValue]=\"maxValue\" [depth]=\"depth\"\n (onSlotClick)=\"handleSlotClick($event)\" (onNavigate)=\"handleNavigate()\"\n (activeViewChange)=\"handleActiveViewChange1()\">\n </ax-calendar>\n <ax-calendar #c2 [showNavigation]=\"false\" [readonly]=\"true\" [cellClass]=\"getCellClass\" [type]=\"type\"\n [cellTemplate]=\"cellTemplate\" [minValue]=\"minValue\" [maxValue]=\"maxValue\" [depth]=\"depth\"\n (onSlotClick)=\"handleSlotClick($event)\" (activeViewChange)=\"handleActiveViewChange2()\">\n </ax-calendar>\n</div>", styles: [".ax-dark ax-calendar-range{background-color:rgba(var(--ax-color-background-default))}.ax-dark ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-range-between{background-color:rgba(var(--ax-color-primary-800));color:rgba(var(--ax-color-primary-fore))}ax-calendar-range{background-color:rgba(var(--ax-color-surface));padding:.5rem;color:rgb(var(--ax-color-text-default));display:block}ax-calendar-range .ax-calendar-range-header{display:flex;justify-content:space-between;padding-left:.25rem;padding-right:.25rem;padding-top:.25rem}ax-calendar-range .ax-calendar-range-header .ax-calendar-header-range-info{font-weight:500}ax-calendar-range .ax-calendar-range-header .ax-calendar-header-range-buttons{display:flex}ax-calendar-range .ax-calendar-range-body{display:flex;flex-direction:row}@media (min-width: 320px) and (max-width: 600px){ax-calendar-range .ax-calendar-range-body{flex-direction:column}}ax-calendar-range ax-calendar{margin:0;padding:0}ax-calendar-range ax-calendar .ax-calendar-body{margin-top:0;padding-top:0}ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-range-between{background-color:rgba(var(--ax-color-primary-200));color:rgba(var(--ax-color-primary-fore-tint))}ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-range-start,ax-calendar-range ax-calendar .ax-calendar-body .ax-calendar-slots .ax-calendar-slot.ax-range-end{background-color:rgba(var(--ax-color-primary-500));color:rgba(var(--ax-color-primary-fore))}@media (min-width: 768px){ax-calendar-range ax-calendar .ax-calendar-body>div{width:100%!important}}\n"] }]
|
|
967
988
|
}], ctorParameters: () => [], propDecorators: { _c1: [{
|
|
968
989
|
type: ViewChild,
|
|
969
990
|
args: ['c1', { static: true }]
|