@acorex/components 18.5.12 → 18.5.14
Sign up to get free protection for your applications and to get access to all the features.
- package/README.md +29 -4
- package/calendar/lib/calendar-range.component.d.ts +2 -1
- package/comment/index.d.ts +1 -1
- package/comment/lib/comment-container/comment-container.component.d.ts +1 -1
- package/comment/lib/comment-item/comment-item.component.d.ts +1 -1
- package/comment/lib/comment-reply-text/comment-reply-text.component.d.ts +5 -0
- package/comment/lib/comment.module.d.ts +6 -6
- package/datetime-box/lib/datetime-box.component.d.ts +1 -1
- package/dialog/lib/dialog.class.d.ts +1 -0
- package/esm2022/calendar/lib/calendar-range.component.mjs +7 -7
- package/esm2022/calendar/lib/calendar.component.mjs +3 -3
- package/esm2022/comment/index.mjs +2 -2
- package/esm2022/comment/lib/comment-container/comment-container.component.mjs +3 -3
- package/esm2022/comment/lib/comment-item/comment-item.component.mjs +4 -5
- package/esm2022/comment/lib/comment-reply-text/comment-reply-text.component.mjs +12 -0
- package/esm2022/comment/lib/comment.module.mjs +7 -7
- package/esm2022/datetime-box/lib/datetime-box.component.mjs +2 -2
- package/esm2022/datetime-picker/lib/datetime-picker.component.mjs +4 -1
- package/esm2022/dialog/lib/dialog.class.mjs +1 -1
- package/esm2022/dialog/lib/dialog.component.mjs +3 -3
- package/esm2022/number-box/lib/number-box.component.mjs +1 -1
- package/esm2022/uploader/index.mjs +2 -1
- package/esm2022/uploader/lib/uploader-browse-handle.directive.mjs +3 -3
- package/esm2022/uploader/lib/uploader-drop-zone.component.mjs +1 -1
- package/esm2022/uploader/lib/uploader-zone.directive.mjs +41 -12
- package/esm2022/uploader/lib/uploader.models.mjs +37 -31
- package/esm2022/uploader/lib/uploader.module.mjs +3 -8
- package/esm2022/uploader/lib/uploader.service.mjs +20 -5
- package/esm2022/wysiwyg/lib/wysiwyg/wysiwyg-container/wysiwyg-container.component.mjs +2 -2
- package/esm2022/wysiwyg/lib/wysiwyg/wysiwyg-toolbar/wysiwyg-toolbar.component.mjs +62 -19
- package/esm2022/wysiwyg/lib/wysiwyg/wysiwyg-view/wysiwyg-view.component.mjs +24 -5
- package/esm2022/wysiwyg/lib/wysiwyg/wysiwyg.service.mjs +2 -1
- package/fesm2022/acorex-components-calendar.mjs +8 -8
- package/fesm2022/acorex-components-calendar.mjs.map +1 -1
- package/fesm2022/acorex-components-comment.mjs +27 -48
- package/fesm2022/acorex-components-comment.mjs.map +1 -1
- package/fesm2022/acorex-components-datetime-box.mjs +1 -1
- package/fesm2022/acorex-components-datetime-box.mjs.map +1 -1
- package/fesm2022/acorex-components-datetime-picker.mjs +3 -0
- package/fesm2022/acorex-components-datetime-picker.mjs.map +1 -1
- package/fesm2022/acorex-components-dialog.mjs +2 -2
- package/fesm2022/acorex-components-dialog.mjs.map +1 -1
- package/fesm2022/acorex-components-number-box.mjs.map +1 -1
- package/fesm2022/acorex-components-uploader.mjs +101 -54
- package/fesm2022/acorex-components-uploader.mjs.map +1 -1
- package/fesm2022/acorex-components-wysiwyg.mjs +84 -22
- package/fesm2022/acorex-components-wysiwyg.mjs.map +1 -1
- package/number-box/lib/number-box.component.d.ts +1 -1
- package/package.json +43 -43
- package/uploader/index.d.ts +1 -0
- package/uploader/lib/uploader-zone.directive.d.ts +9 -5
- package/uploader/lib/uploader.models.d.ts +26 -9
- package/uploader/lib/uploader.module.d.ts +10 -11
- package/uploader/lib/uploader.service.d.ts +8 -4
- package/wysiwyg/lib/wysiwyg/wysiwyg-toolbar/wysiwyg-toolbar.component.d.ts +19 -4
- package/wysiwyg/lib/wysiwyg/wysiwyg-view/wysiwyg-view.component.d.ts +6 -1
- package/wysiwyg/lib/wysiwyg/wysiwyg.service.d.ts +1 -0
- package/comment/lib/comment-input/comment-input.component.d.ts +0 -10
- package/esm2022/comment/lib/comment-input/comment-input.component.mjs +0 -33
@@ -590,7 +590,7 @@ class AXCalendarComponent extends classes((MXValueComponent), MXInteractiveCompo
|
|
590
590
|
useExisting: AXCalendarComponent,
|
591
591
|
},
|
592
592
|
AXUnsubscriber,
|
593
|
-
], 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 <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 <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 <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 <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 <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 <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))}@media (min-width: 768px){ax-calendar{width:max-content}}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 }); }
|
593
|
+
], 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 }); }
|
594
594
|
}
|
595
595
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXCalendarComponent, decorators: [{
|
596
596
|
type: Component,
|
@@ -640,7 +640,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
|
|
640
640
|
useExisting: AXCalendarComponent,
|
641
641
|
},
|
642
642
|
AXUnsubscriber,
|
643
|
-
], 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 <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 <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 <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 <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 <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 <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))}@media (min-width: 768px){ax-calendar{width:max-content}}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"] }]
|
643
|
+
], 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"] }]
|
644
644
|
}], ctorParameters: () => [{ type: i1.AXUnsubscriber }], propDecorators: { __hostClass: [{
|
645
645
|
type: HostBinding,
|
646
646
|
args: ['class']
|
@@ -655,15 +655,15 @@ class AXCalendarRangeComponent extends classes((MXValueComponent), MXInteractive
|
|
655
655
|
this._calendarService = inject(AXCalendarService);
|
656
656
|
this._navText = '';
|
657
657
|
this.getCellClass = (date) => {
|
658
|
-
const d = this._calendarService.create(date, this.type);
|
658
|
+
//const d = this._calendarService.create(date, this.type);
|
659
659
|
const from = this._calendarService.create(this.value.from, this.type);
|
660
660
|
const end = this._calendarService.create(this.value.end, this.type);
|
661
|
-
if (this.value.from &&
|
661
|
+
if (this.value.from && date.equal(from, 'day')) {
|
662
662
|
return 'ax-range-start';
|
663
663
|
}
|
664
|
-
if (this.value.end &&
|
664
|
+
if (this.value.end && date.equal(end, 'day'))
|
665
665
|
return 'ax-range-end';
|
666
|
-
if (this.value.from && this.value.end &&
|
666
|
+
if (this.value.from && this.value.end && date.compare(from, 'day') > 0 && date.compare(end, 'day') < 0)
|
667
667
|
return 'ax-range-between';
|
668
668
|
return null;
|
669
669
|
};
|
@@ -774,7 +774,7 @@ class AXCalendarRangeComponent extends classes((MXValueComponent), MXInteractive
|
|
774
774
|
}
|
775
775
|
}
|
776
776
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXCalendarRangeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
777
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", 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" }, 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
|
777
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.2", 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" }, 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\" [cellClass]=\"getCellClass\" [type]=\"type\" [cellTemplate]=\"cellTemplate\"\n [minValue]=\"minValue\" [maxValue]=\"maxValue\" [depth]=\"depth\" (onSlotClick)=\"handleSlotClick($event)\"\n (onNavigate)=\"handleNavigate()\" (activeViewChange)=\"handleActiveViewChange1()\">\n </ax-calendar>\n <ax-calendar #c2 [showNavigation]=\"false\" [cellClass]=\"getCellClass\" [type]=\"type\" [cellTemplate]=\"cellTemplate\"\n [minValue]=\"minValue\" [maxValue]=\"maxValue\" [depth]=\"depth\" (onSlotClick)=\"handleSlotClick($event)\"\n (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 }); }
|
778
778
|
}
|
779
779
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImport: i0, type: AXCalendarRangeComponent, decorators: [{
|
780
780
|
type: Component,
|
@@ -807,7 +807,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.2", ngImpor
|
|
807
807
|
'holidayDatesChange',
|
808
808
|
'onNavigate',
|
809
809
|
'onSlotClick',
|
810
|
-
], 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
|
810
|
+
], 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\" [cellClass]=\"getCellClass\" [type]=\"type\" [cellTemplate]=\"cellTemplate\"\n [minValue]=\"minValue\" [maxValue]=\"maxValue\" [depth]=\"depth\" (onSlotClick)=\"handleSlotClick($event)\"\n (onNavigate)=\"handleNavigate()\" (activeViewChange)=\"handleActiveViewChange1()\">\n </ax-calendar>\n <ax-calendar #c2 [showNavigation]=\"false\" [cellClass]=\"getCellClass\" [type]=\"type\" [cellTemplate]=\"cellTemplate\"\n [minValue]=\"minValue\" [maxValue]=\"maxValue\" [depth]=\"depth\" (onSlotClick)=\"handleSlotClick($event)\"\n (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"] }]
|
811
811
|
}], ctorParameters: () => [], propDecorators: { _c1: [{
|
812
812
|
type: ViewChild,
|
813
813
|
args: ['c1', { static: true }]
|