@acorex/components 21.1.0-next.2 → 22.0.0-next.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/acorex-components-accordion.mjs +47 -30
- package/fesm2022/acorex-components-accordion.mjs.map +1 -1
- package/fesm2022/acorex-components-action-sheet.mjs +46 -31
- package/fesm2022/acorex-components-action-sheet.mjs.map +1 -1
- package/fesm2022/acorex-components-alert.mjs +24 -17
- package/fesm2022/acorex-components-alert.mjs.map +1 -1
- package/fesm2022/acorex-components-aspect-ratio.mjs +10 -8
- package/fesm2022/acorex-components-aspect-ratio.mjs.map +1 -1
- package/fesm2022/acorex-components-audio-wave.mjs +13 -10
- package/fesm2022/acorex-components-audio-wave.mjs.map +1 -1
- package/fesm2022/acorex-components-autocomplete.mjs +24 -17
- package/fesm2022/acorex-components-autocomplete.mjs.map +1 -1
- package/fesm2022/acorex-components-avatar.mjs +20 -16
- package/fesm2022/acorex-components-avatar.mjs.map +1 -1
- package/fesm2022/acorex-components-badge.mjs +11 -10
- package/fesm2022/acorex-components-badge.mjs.map +1 -1
- package/fesm2022/acorex-components-bottom-navigation.mjs +19 -16
- package/fesm2022/acorex-components-bottom-navigation.mjs.map +1 -1
- package/fesm2022/acorex-components-breadcrumbs.mjs +16 -14
- package/fesm2022/acorex-components-breadcrumbs.mjs.map +1 -1
- package/fesm2022/acorex-components-button-group.mjs +17 -16
- package/fesm2022/acorex-components-button-group.mjs.map +1 -1
- package/fesm2022/acorex-components-button.mjs +38 -29
- package/fesm2022/acorex-components-button.mjs.map +1 -1
- package/fesm2022/acorex-components-calendar.mjs +44 -30
- package/fesm2022/acorex-components-calendar.mjs.map +1 -1
- package/fesm2022/acorex-components-check-box.mjs +12 -11
- package/fesm2022/acorex-components-check-box.mjs.map +1 -1
- package/fesm2022/acorex-components-chips.mjs +11 -10
- package/fesm2022/acorex-components-chips.mjs.map +1 -1
- package/fesm2022/acorex-components-circular-progress.mjs +19 -14
- package/fesm2022/acorex-components-circular-progress.mjs.map +1 -1
- package/fesm2022/acorex-components-code-editor.mjs +42 -26
- package/fesm2022/acorex-components-code-editor.mjs.map +1 -1
- package/fesm2022/acorex-components-color-box.mjs +20 -15
- package/fesm2022/acorex-components-color-box.mjs.map +1 -1
- package/fesm2022/acorex-components-color-palette.mjs +45 -43
- package/fesm2022/acorex-components-color-palette.mjs.map +1 -1
- package/fesm2022/acorex-components-command.mjs +25 -16
- package/fesm2022/acorex-components-command.mjs.map +1 -1
- package/fesm2022/acorex-components-comment.mjs +42 -41
- package/fesm2022/acorex-components-comment.mjs.map +1 -1
- package/fesm2022/{acorex-components-conversation-composer-action-choice-dialog.component-C28hl7iD.mjs → acorex-components-conversation-composer-action-choice-dialog.component-CNHiM1Sp.mjs} +17 -12
- package/fesm2022/acorex-components-conversation-composer-action-choice-dialog.component-CNHiM1Sp.mjs.map +1 -0
- package/fesm2022/{acorex-components-conversation-open-composer-picker-for-files-Duvap4M4.mjs → acorex-components-conversation-open-composer-picker-for-files-Hh5Oyp3p.mjs} +2 -2
- package/fesm2022/{acorex-components-conversation-open-composer-picker-for-files-Duvap4M4.mjs.map → acorex-components-conversation-open-composer-picker-for-files-Hh5Oyp3p.mjs.map} +1 -1
- package/fesm2022/acorex-components-conversation.mjs +1620 -1156
- package/fesm2022/acorex-components-conversation.mjs.map +1 -1
- package/fesm2022/acorex-components-cron-job.mjs +56 -51
- package/fesm2022/acorex-components-cron-job.mjs.map +1 -1
- package/fesm2022/acorex-components-data-list.mjs +61 -33
- package/fesm2022/acorex-components-data-list.mjs.map +1 -1
- package/fesm2022/acorex-components-data-pager.mjs +42 -47
- package/fesm2022/acorex-components-data-pager.mjs.map +1 -1
- package/fesm2022/acorex-components-data-table.mjs +110 -96
- package/fesm2022/acorex-components-data-table.mjs.map +1 -1
- package/fesm2022/acorex-components-datetime-box.mjs +42 -26
- package/fesm2022/acorex-components-datetime-box.mjs.map +1 -1
- package/fesm2022/acorex-components-datetime-input.mjs +38 -24
- package/fesm2022/acorex-components-datetime-input.mjs.map +1 -1
- package/fesm2022/acorex-components-datetime-picker.mjs +50 -30
- package/fesm2022/acorex-components-datetime-picker.mjs.map +1 -1
- package/fesm2022/acorex-components-decorators.mjs +53 -45
- package/fesm2022/acorex-components-decorators.mjs.map +1 -1
- package/fesm2022/acorex-components-dialog.mjs +17 -15
- package/fesm2022/acorex-components-dialog.mjs.map +1 -1
- package/fesm2022/acorex-components-drawer.mjs +33 -24
- package/fesm2022/acorex-components-drawer.mjs.map +1 -1
- package/fesm2022/acorex-components-dropdown-button.mjs +10 -10
- package/fesm2022/acorex-components-dropdown-button.mjs.map +1 -1
- package/fesm2022/acorex-components-dropdown.mjs +24 -20
- package/fesm2022/acorex-components-dropdown.mjs.map +1 -1
- package/fesm2022/acorex-components-editor.mjs +16 -13
- package/fesm2022/acorex-components-editor.mjs.map +1 -1
- package/fesm2022/acorex-components-fab.mjs +27 -18
- package/fesm2022/acorex-components-fab.mjs.map +1 -1
- package/fesm2022/acorex-components-file-viewer.mjs +149 -99
- package/fesm2022/acorex-components-file-viewer.mjs.map +1 -1
- package/fesm2022/acorex-components-flow-chart.mjs +53 -37
- package/fesm2022/acorex-components-flow-chart.mjs.map +1 -1
- package/fesm2022/acorex-components-form.mjs +45 -34
- package/fesm2022/acorex-components-form.mjs.map +1 -1
- package/fesm2022/acorex-components-grid-layout-builder.mjs +23 -21
- package/fesm2022/acorex-components-grid-layout-builder.mjs.map +1 -1
- package/fesm2022/acorex-components-image-editor.mjs +182 -135
- package/fesm2022/acorex-components-image-editor.mjs.map +1 -1
- package/fesm2022/acorex-components-image.mjs +14 -12
- package/fesm2022/acorex-components-image.mjs.map +1 -1
- package/fesm2022/acorex-components-json-viewer.mjs +15 -11
- package/fesm2022/acorex-components-json-viewer.mjs.map +1 -1
- package/fesm2022/acorex-components-kanban.mjs +41 -22
- package/fesm2022/acorex-components-kanban.mjs.map +1 -1
- package/fesm2022/acorex-components-kbd.mjs +23 -16
- package/fesm2022/acorex-components-kbd.mjs.map +1 -1
- package/fesm2022/acorex-components-label.mjs +10 -10
- package/fesm2022/acorex-components-label.mjs.map +1 -1
- package/fesm2022/acorex-components-list.mjs +26 -18
- package/fesm2022/acorex-components-list.mjs.map +1 -1
- package/fesm2022/acorex-components-loading-dialog.mjs +26 -19
- package/fesm2022/acorex-components-loading-dialog.mjs.map +1 -1
- package/fesm2022/acorex-components-loading.mjs +20 -20
- package/fesm2022/acorex-components-loading.mjs.map +1 -1
- package/fesm2022/acorex-components-map.mjs +79 -47
- package/fesm2022/acorex-components-map.mjs.map +1 -1
- package/fesm2022/acorex-components-media-viewer.mjs +126 -86
- package/fesm2022/acorex-components-media-viewer.mjs.map +1 -1
- package/fesm2022/acorex-components-menu.mjs +71 -52
- package/fesm2022/acorex-components-menu.mjs.map +1 -1
- package/fesm2022/{acorex-components-modal-acorex-components-modal-dF5HUEBH.mjs → acorex-components-modal-acorex-components-modal-Djl-uo9b.mjs} +34 -30
- package/fesm2022/acorex-components-modal-acorex-components-modal-Djl-uo9b.mjs.map +1 -0
- package/fesm2022/{acorex-components-modal-modal-content.component-BGTYje3j.mjs → acorex-components-modal-modal-content.component-BpUsCI8D.mjs} +73 -40
- package/fesm2022/acorex-components-modal-modal-content.component-BpUsCI8D.mjs.map +1 -0
- package/fesm2022/acorex-components-modal.mjs +1 -1
- package/fesm2022/acorex-components-navbar.mjs +9 -9
- package/fesm2022/acorex-components-navbar.mjs.map +1 -1
- package/fesm2022/acorex-components-notification.mjs +41 -27
- package/fesm2022/acorex-components-notification.mjs.map +1 -1
- package/fesm2022/acorex-components-number-box.mjs +32 -21
- package/fesm2022/acorex-components-number-box.mjs.map +1 -1
- package/fesm2022/acorex-components-otp.mjs +18 -14
- package/fesm2022/acorex-components-otp.mjs.map +1 -1
- package/fesm2022/acorex-components-page.mjs +10 -10
- package/fesm2022/acorex-components-paint.mjs +79 -55
- package/fesm2022/acorex-components-paint.mjs.map +1 -1
- package/fesm2022/acorex-components-password-box.mjs +46 -30
- package/fesm2022/acorex-components-password-box.mjs.map +1 -1
- package/fesm2022/acorex-components-pdf-reader.mjs +11 -10
- package/fesm2022/acorex-components-pdf-reader.mjs.map +1 -1
- package/fesm2022/acorex-components-phone-box.mjs +31 -21
- package/fesm2022/acorex-components-phone-box.mjs.map +1 -1
- package/fesm2022/acorex-components-picker.mjs +44 -31
- package/fesm2022/acorex-components-picker.mjs.map +1 -1
- package/fesm2022/acorex-components-popover.mjs +14 -12
- package/fesm2022/acorex-components-popover.mjs.map +1 -1
- package/fesm2022/acorex-components-popup.mjs +32 -24
- package/fesm2022/acorex-components-popup.mjs.map +1 -1
- package/fesm2022/acorex-components-progress-bar.mjs +9 -9
- package/fesm2022/acorex-components-progress-bar.mjs.map +1 -1
- package/fesm2022/acorex-components-qrcode.mjs +28 -19
- package/fesm2022/acorex-components-qrcode.mjs.map +1 -1
- package/fesm2022/acorex-components-query-builder.mjs +19 -14
- package/fesm2022/acorex-components-query-builder.mjs.map +1 -1
- package/fesm2022/acorex-components-radio.mjs +10 -10
- package/fesm2022/acorex-components-radio.mjs.map +1 -1
- package/fesm2022/acorex-components-rail-navigation.mjs +44 -30
- package/fesm2022/acorex-components-rail-navigation.mjs.map +1 -1
- package/fesm2022/acorex-components-range-slider.mjs +60 -35
- package/fesm2022/acorex-components-range-slider.mjs.map +1 -1
- package/fesm2022/acorex-components-rate-picker.mjs +30 -20
- package/fesm2022/acorex-components-rate-picker.mjs.map +1 -1
- package/fesm2022/acorex-components-rest-api-generator.mjs +50 -39
- package/fesm2022/acorex-components-rest-api-generator.mjs.map +1 -1
- package/fesm2022/acorex-components-result.mjs +9 -9
- package/fesm2022/acorex-components-result.mjs.map +1 -1
- package/fesm2022/acorex-components-routing-progress.mjs +9 -9
- package/fesm2022/acorex-components-routing-progress.mjs.map +1 -1
- package/fesm2022/acorex-components-rrule.mjs +52 -35
- package/fesm2022/acorex-components-rrule.mjs.map +1 -1
- package/fesm2022/acorex-components-scheduler-picker.mjs +205 -152
- package/fesm2022/acorex-components-scheduler-picker.mjs.map +1 -1
- package/fesm2022/acorex-components-scheduler.mjs +504 -275
- package/fesm2022/acorex-components-scheduler.mjs.map +1 -1
- package/fesm2022/acorex-components-search-box.mjs +14 -12
- package/fesm2022/acorex-components-search-box.mjs.map +1 -1
- package/fesm2022/acorex-components-select-box.mjs +32 -21
- package/fesm2022/acorex-components-select-box.mjs.map +1 -1
- package/fesm2022/acorex-components-selection-list-2.mjs +16 -13
- package/fesm2022/acorex-components-selection-list-2.mjs.map +1 -1
- package/fesm2022/acorex-components-selection-list.mjs +14 -12
- package/fesm2022/acorex-components-selection-list.mjs.map +1 -1
- package/fesm2022/acorex-components-side-menu.mjs +74 -46
- package/fesm2022/acorex-components-side-menu.mjs.map +1 -1
- package/fesm2022/acorex-components-sidebar.mjs +89 -63
- package/fesm2022/acorex-components-sidebar.mjs.map +1 -1
- package/fesm2022/acorex-components-skeleton.mjs +7 -7
- package/fesm2022/acorex-components-skeleton.mjs.map +1 -1
- package/fesm2022/acorex-components-slider.mjs +10 -10
- package/fesm2022/acorex-components-slider.mjs.map +1 -1
- package/fesm2022/acorex-components-sliding-item.mjs +31 -22
- package/fesm2022/acorex-components-sliding-item.mjs.map +1 -1
- package/fesm2022/acorex-components-step-wizard.mjs +66 -41
- package/fesm2022/acorex-components-step-wizard.mjs.map +1 -1
- package/fesm2022/acorex-components-switch.mjs +13 -13
- package/fesm2022/acorex-components-switch.mjs.map +1 -1
- package/fesm2022/acorex-components-tabs.mjs +27 -23
- package/fesm2022/acorex-components-tabs.mjs.map +1 -1
- package/fesm2022/acorex-components-tag-box.mjs +30 -20
- package/fesm2022/acorex-components-tag-box.mjs.map +1 -1
- package/fesm2022/acorex-components-tag.mjs +9 -9
- package/fesm2022/acorex-components-tag.mjs.map +1 -1
- package/fesm2022/acorex-components-text-area.mjs +10 -10
- package/fesm2022/acorex-components-text-area.mjs.map +1 -1
- package/fesm2022/acorex-components-text-box.mjs +14 -12
- package/fesm2022/acorex-components-text-box.mjs.map +1 -1
- package/fesm2022/acorex-components-time-duration.mjs +46 -28
- package/fesm2022/acorex-components-time-duration.mjs.map +1 -1
- package/fesm2022/acorex-components-time-line.mjs +27 -20
- package/fesm2022/acorex-components-time-line.mjs.map +1 -1
- package/fesm2022/acorex-components-toast.mjs +37 -25
- package/fesm2022/acorex-components-toast.mjs.map +1 -1
- package/fesm2022/acorex-components-toolbar.mjs +17 -13
- package/fesm2022/acorex-components-toolbar.mjs.map +1 -1
- package/fesm2022/acorex-components-tooltip.mjs +18 -15
- package/fesm2022/acorex-components-tooltip.mjs.map +1 -1
- package/fesm2022/acorex-components-tree-view.mjs +106 -59
- package/fesm2022/acorex-components-tree-view.mjs.map +1 -1
- package/fesm2022/acorex-components-uploader.mjs +15 -14
- package/fesm2022/acorex-components-uploader.mjs.map +1 -1
- package/fesm2022/acorex-components-video-player.mjs +11 -10
- package/fesm2022/acorex-components-video-player.mjs.map +1 -1
- package/fesm2022/acorex-components-wysiwyg.mjs +67 -53
- package/fesm2022/acorex-components-wysiwyg.mjs.map +1 -1
- package/package.json +3 -3
- package/types/acorex-components-rrule.d.ts +3 -2
- package/types/acorex-components-side-menu.d.ts +1 -1
- package/fesm2022/acorex-components-conversation-composer-action-choice-dialog.component-C28hl7iD.mjs.map +0 -1
- package/fesm2022/acorex-components-modal-acorex-components-modal-dF5HUEBH.mjs.map +0 -1
- package/fesm2022/acorex-components-modal-modal-content.component-BGTYje3j.mjs.map +0 -1
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { NXComponent, AXComponent } from '@acorex/cdk/common';
|
|
2
|
-
import { AXButtonComponent } from '@acorex/components/button';
|
|
3
2
|
import { AXBadgeComponent } from '@acorex/components/badge';
|
|
3
|
+
import { AXButtonComponent } from '@acorex/components/button';
|
|
4
4
|
import { AXCalendarComponent } from '@acorex/components/calendar';
|
|
5
5
|
import { AXDecoratorIconComponent, AXDecoratorGenericComponent } from '@acorex/components/decorators';
|
|
6
6
|
import { AXPopoverComponent } from '@acorex/components/popover';
|
|
@@ -12,7 +12,7 @@ import { AXLocaleService } from '@acorex/core/locale';
|
|
|
12
12
|
import { AXTranslatorPipe, resolveMultiLanguageString, AXTranslationService } from '@acorex/core/translation';
|
|
13
13
|
import { AXUnsubscriber } from '@acorex/core/utils';
|
|
14
14
|
import * as i0 from '@angular/core';
|
|
15
|
-
import { inject, signal, Injectable, DOCUMENT, input, computed, output, ViewEncapsulation,
|
|
15
|
+
import { inject, signal, Injectable, DOCUMENT, input, computed, output, ViewEncapsulation, Component, DestroyRef, viewChild, linkedSignal, model, effect, untracked, NgModule } from '@angular/core';
|
|
16
16
|
import * as i1 from '@angular/forms';
|
|
17
17
|
import { FormsModule } from '@angular/forms';
|
|
18
18
|
import { filter } from 'rxjs';
|
|
@@ -31,8 +31,10 @@ class AXSchedulerService {
|
|
|
31
31
|
this.BLOCK_DURATION_MINUTES = 30;
|
|
32
32
|
this.MILLISECONDS_PER_MINUTE = 60 * 1000;
|
|
33
33
|
this.MILLISECONDS_PER_DAY = this.HOURS_PER_DAY * this.MINUTES_PER_HOUR * this.MILLISECONDS_PER_MINUTE;
|
|
34
|
-
this.internalWeekend = signal([],
|
|
35
|
-
|
|
34
|
+
this.internalWeekend = signal([], /* @ts-ignore */
|
|
35
|
+
...(ngDevMode ? [{ debugName: "internalWeekend" }] : /* istanbul ignore next */ []));
|
|
36
|
+
this.internalHoliday = signal([], /* @ts-ignore */
|
|
37
|
+
...(ngDevMode ? [{ debugName: "internalHoliday" }] : /* istanbul ignore next */ []));
|
|
36
38
|
}
|
|
37
39
|
/**
|
|
38
40
|
* Checks if two appointments overlap in time.
|
|
@@ -828,10 +830,10 @@ class AXSchedulerService {
|
|
|
828
830
|
resourceId: dropResult.resourceId,
|
|
829
831
|
};
|
|
830
832
|
}
|
|
831
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
832
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
833
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXSchedulerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
834
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXSchedulerService, providedIn: 'root' }); }
|
|
833
835
|
}
|
|
834
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
836
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXSchedulerService, decorators: [{
|
|
835
837
|
type: Injectable,
|
|
836
838
|
args: [{
|
|
837
839
|
providedIn: 'root',
|
|
@@ -845,17 +847,28 @@ class AXSchedulerAgendaViewComponent extends NXComponent {
|
|
|
845
847
|
this.scheduler = inject(AXSchedulerComponent);
|
|
846
848
|
this.calendarService = inject(AXCalendarService);
|
|
847
849
|
this.schedulerService = inject(AXSchedulerService);
|
|
848
|
-
this.daysCount = input(7,
|
|
849
|
-
|
|
850
|
-
this.
|
|
851
|
-
|
|
852
|
-
this.
|
|
853
|
-
|
|
854
|
-
this.
|
|
855
|
-
|
|
856
|
-
this.
|
|
857
|
-
|
|
858
|
-
this.
|
|
850
|
+
this.daysCount = input(7, /* @ts-ignore */
|
|
851
|
+
...(ngDevMode ? [{ debugName: "daysCount" }] : /* istanbul ignore next */ []));
|
|
852
|
+
this.readonly = input(false, /* @ts-ignore */
|
|
853
|
+
...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
|
|
854
|
+
this.draggable = input(true, /* @ts-ignore */
|
|
855
|
+
...(ngDevMode ? [{ debugName: "draggable" }] : /* istanbul ignore next */ []));
|
|
856
|
+
this.hasActions = input(false, /* @ts-ignore */
|
|
857
|
+
...(ngDevMode ? [{ debugName: "hasActions" }] : /* istanbul ignore next */ []));
|
|
858
|
+
this.dragStartDelay = input(0, /* @ts-ignore */
|
|
859
|
+
...(ngDevMode ? [{ debugName: "dragStartDelay" }] : /* istanbul ignore next */ []));
|
|
860
|
+
this.calendar = input(/* @ts-ignore */
|
|
861
|
+
...(ngDevMode ? [undefined, { debugName: "calendar" }] : /* istanbul ignore next */ []));
|
|
862
|
+
this.date = input.required(/* @ts-ignore */
|
|
863
|
+
...(ngDevMode ? [{ debugName: "date" }] : /* istanbul ignore next */ []));
|
|
864
|
+
this.appointments = input([], /* @ts-ignore */
|
|
865
|
+
...(ngDevMode ? [{ debugName: "appointments" }] : /* istanbul ignore next */ []));
|
|
866
|
+
this.tooltipTemplate = input(/* @ts-ignore */
|
|
867
|
+
...(ngDevMode ? [undefined, { debugName: "tooltipTemplate" }] : /* istanbul ignore next */ []));
|
|
868
|
+
this.selectedAppointmentId = input(null, /* @ts-ignore */
|
|
869
|
+
...(ngDevMode ? [{ debugName: "selectedAppointmentId" }] : /* istanbul ignore next */ []));
|
|
870
|
+
this.dragStartSlotId = signal(null, /* @ts-ignore */
|
|
871
|
+
...(ngDevMode ? [{ debugName: "dragStartSlotId" }] : /* istanbul ignore next */ []));
|
|
859
872
|
this.agendaDaysLayout = computed(() => {
|
|
860
873
|
const allOriginalAppointments = this.appointments();
|
|
861
874
|
const agendaStartDate = this.date();
|
|
@@ -885,7 +898,8 @@ class AXSchedulerAgendaViewComponent extends NXComponent {
|
|
|
885
898
|
});
|
|
886
899
|
}
|
|
887
900
|
return result;
|
|
888
|
-
},
|
|
901
|
+
}, /* @ts-ignore */
|
|
902
|
+
...(ngDevMode ? [{ debugName: "agendaDaysLayout" }] : /* istanbul ignore next */ []));
|
|
889
903
|
// Internal outputs to be caught by parent AXSchedulerComponent
|
|
890
904
|
this.slotClickedInternal = output();
|
|
891
905
|
this.slotDblClickedInternal = output();
|
|
@@ -1000,12 +1014,12 @@ class AXSchedulerAgendaViewComponent extends NXComponent {
|
|
|
1000
1014
|
getMultiDayEndDate(segment) {
|
|
1001
1015
|
return segment.originalEndDate;
|
|
1002
1016
|
}
|
|
1003
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1004
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXSchedulerAgendaViewComponent, isStandalone: true, selector: "ax-scheduler-agenda-view", inputs: { daysCount: { classPropertyName: "daysCount", publicName: "daysCount", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, draggable: { classPropertyName: "draggable", publicName: "draggable", isSignal: true, isRequired: false, transformFunction: null }, hasActions: { classPropertyName: "hasActions", publicName: "hasActions", isSignal: true, isRequired: false, transformFunction: null }, dragStartDelay: { classPropertyName: "dragStartDelay", publicName: "dragStartDelay", isSignal: true, isRequired: false, transformFunction: null }, calendar: { classPropertyName: "calendar", publicName: "calendar", isSignal: true, isRequired: false, transformFunction: null }, date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: true, transformFunction: null }, appointments: { classPropertyName: "appointments", publicName: "appointments", isSignal: true, isRequired: false, transformFunction: null }, tooltipTemplate: { classPropertyName: "tooltipTemplate", publicName: "tooltipTemplate", isSignal: true, isRequired: false, transformFunction: null }, selectedAppointmentId: { classPropertyName: "selectedAppointmentId", publicName: "selectedAppointmentId", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { slotClickedInternal: "slotClickedInternal", slotDblClickedInternal: "slotDblClickedInternal", slotRightClickedInternal: "slotRightClickedInternal", appointmentClickedInternal: "appointmentClickedInternal", appointmentDblClickedInternal: "appointmentDblClickedInternal", appointmentRightClickedInternal: "appointmentRightClickedInternal", onActionClickInternal: "onActionClickInternal", onAppointmentDropInternal: "onAppointmentDropInternal" }, host: { properties: { "class.ax-state-readonly": "readonly()" } }, providers: [{ provide: AXComponent, useExisting: AXSchedulerAgendaViewComponent }], usesInheritance: true, ngImport: i0, template: "<div class=\"ax-scheduler-agenda-container\">\n @for (dayData of agendaDaysLayout(); track dayData.date.date.getTime()) {\n <div\n axDropZone\n #zone=\"axDropZone\"\n (onElementDrop)=\"handleDrop($event, dayData.date)\"\n [class.ax-scheduler-slot-hovered]=\"zone.isHovered()\"\n [class.ax-state-today]=\"isToday(dayData.date)\"\n class=\"ax-scheduler-agenda-view-container {{\n dayData.holiday.state !== 'none' ? (dayData.holiday.holiday?.cssClass ?? 'ax-state-holiday') : ''\n }}\"\n [style.--ax-scheduler-holiday-color]=\"dayData.holiday.holiday?.color ?? null\"\n (click)=\"handleSlotEvent($event, dayData.date)\"\n (dblclick)=\"handleSlotEvent($event, dayData.date)\"\n (contextmenu)=\"handleSlotEvent($event, dayData.date)\"\n [attr.data-slot-id]=\"dayData.date.format('YYYYMMDD')\"\n >\n <div class=\"ax-scheduler-agenda-header-date-day\">\n <span\n class=\"ax-scheduler-agenda-header-date-day-char ax-scheduler-truncate\"\n [axTooltip]=\"(dayData.holiday?.holiday?.description ?? dayData.holiday?.holiday?.title ?? '') | translate | async\"\n [axTooltipPlacement]=\"'top-start'\"\n >\n {{ dayData.date | format: 'date' : { format: 'dddd', calendar: calendar() } | async }}\n @if (dayData.holiday.state === 'holiday' && dayData.holiday.holiday.title) {\n ( {{ dayData.holiday.holiday.title | translate | async }} )\n }\n </span>\n <span class=\"ax-scheduler-agenda-header-date-day-num\">\n {{ dayData.date | format: 'date' : { format: 'DD', calendar: calendar() } | async }}\n </span>\n </div>\n <div class=\"ax-scheduler-agenda-appointment-container\">\n @for (segment of dayData.appointments; track segment.id + segment.originalStartDate.getTime()) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragData]=\"segment\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || segment.readonly || readonly()\"\n (pointerdown)=\"getSlotId($event)\"\n (click)=\"handleAppointmentEvent($event, segment)\"\n (dblclick)=\"handleAppointmentEvent($event, segment)\"\n (contextmenu)=\"handleAppointmentEvent($event, segment)\"\n [title]=\"\n tooltipTemplate()\n ? ''\n : segment.title +\n (segment.allDay\n ? ' (All Day)'\n : ' (' +\n (segment.originalStartDate | format: 'time' : { calendar: calendar() } | async) +\n ' - ' +\n (segment.originalEndDate | format: 'time' : { calendar: calendar() } | async) +\n ')')\n \"\n class=\"ax-scheduler-agenda-appointment\"\n [class.all-day-segment]=\"segment.allDay\"\n [class.ax-state-active]=\"isActive(segment.id)\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltip]=\"tooltipTemplate()\"\n [axTooltipContext]=\"segment\"\n >\n <div class=\"ax-scheduler-agenda-appointment-time\">\n <div\n class=\"ax-scheduler-agenda-appointment-time-inner {{\n segment.cssClass ?? 'ax-scheduler-' + (segment.priority ?? 'primary') + '-priority'\n }}\"\n ></div>\n @if (segment.allDay) {\n @if (isMultiDayAppointment(segment)) {\n <span class=\"ax-scheduler-agenda-multiday-info\">\n <span class=\"ax-scheduler-agenda-multiday-badge\">\n {{\n getMultiDayStartDate(segment)\n | format: 'date' : { format: 'D MMM', calendar: calendar() }\n | async\n }}\n -\n {{\n getMultiDayEndDate(segment) | format: 'date' : { format: 'D MMM', calendar: calendar() } | async\n }}\n </span>\n </span>\n } @else {\n <span>{{ '@acorex:dateTime.duration.all-day' | translate | async }}</span>\n }\n } @else {\n @if (isMultiDayAppointment(segment)) {\n <span class=\"ax-scheduler-agenda-multiday-info\">\n <span class=\"ax-scheduler-agenda-multiday-badge\">\n {{\n getMultiDayStartDate(segment)\n | format: 'date' : { format: 'D MMM', calendar: calendar() }\n | async\n }}\n -\n {{\n getMultiDayEndDate(segment) | format: 'date' : { format: 'D MMM', calendar: calendar() } | async\n }}\n </span>\n <span>\n {{\n segment.originalStartDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async\n }}\n -\n {{ segment.originalEndDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}\n </span>\n </span>\n } @else {\n <span>\n {{ segment.originalStartDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}\n -\n {{ segment.originalEndDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}\n </span>\n }\n }\n </div>\n <ax-title class=\"ax-scheduler-agenda-appointment-title ax-scheduler-truncate\">{{ segment.title }}</ax-title>\n <!-- Description could go here if needed -->\n <!-- @if (segment.description) {\n <ax-subtitle>{{ segment.description }}</ax-subtitle>\n } -->\n @if (hasActions()) {\n <ax-icon\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n (click)=\"handleActionClick($event, segment)\"\n >\n </ax-icon>\n }\n </div>\n }\n @if (dayData.appointments.length === 0) {\n <div class=\"ax-scheduler-agenda-no-appointments\">\n {{ '@acorex:common.general.no-record' | translate | async }}\n </div>\n }\n </div>\n </div>\n }\n</div>\n", styles: ["@layer properties;@layer components{ax-scheduler-agenda-view .ax-scheduler-agenda-container{display:flex;height:100%;flex-direction:column}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-view-container{position:relative;display:flex;gap:calc(var(--spacing, .25rem) * 4);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 1);border-block-end:1px solid rgba(var(--ax-sys-color-border-surface))}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-view-container:last-child{border-block-end-width:0}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-view-container.ax-state-today{background-color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-view-container.ax-state-today{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 5%,transparent)}}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-view-container.ax-state-today .ax-scheduler-agenda-header-date-day{color:rgba(var(--ax-sys-color-primary-surface))}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-view-container.ax-state-today .ax-scheduler-agenda-header-date-day .ax-scheduler-month-header-date-day-char{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-view-container.ax-state-today .ax-scheduler-agenda-header-date-day .ax-scheduler-month-header-date-day-num{--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700)}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-view-container.ax-state-holiday .ax-scheduler-agenda-header-date-day{color:var(--ax-scheduler-holiday-color, rgba(var(--ax-sys-color-danger-surface)))}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-view-container.ax-state-holiday .ax-scheduler-agenda-header-date-day.ax-state-today{color:rgba(var(--ax-sys-color-primary-surface))}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-view-container .ax-scheduler-agenda-header-date-day{position:sticky;top:calc(var(--spacing, .25rem) * 4);display:flex;height:calc(var(--spacing, .25rem) * 14);max-width:calc(var(--spacing, .25rem) * 24);min-width:calc(var(--spacing, .25rem) * 24);flex-direction:column;align-items:flex-start;justify-content:center;gap:calc(var(--spacing, .25rem) * 1)}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-view-container .ax-scheduler-agenda-header-date-day .ax-scheduler-agenda-header-date-day-char{max-width:100%;--tw-font-weight: var(--font-weight-light, 300);font-weight:var(--font-weight-light, 300)}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-view-container .ax-scheduler-agenda-header-date-day .ax-scheduler-agenda-header-date-day-num{font-size:var(--text-xl, 1.25rem);line-height:var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-appointment-container{display:flex;width:100%;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 1);color:unset}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-appointment-container .ax-scheduler-agenda-appointment{display:flex;width:100%;flex-direction:row;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 2);overflow:hidden;border-radius:calc(var(--ax-sys-border-radius) / 2);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 1)}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-appointment-container .ax-scheduler-agenda-appointment:hover{background-color:rgba(var(--ax-comp-scheduler-slot-hover-bg, var(--ax-sys-color-primary-surface), .15))}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-appointment-container .ax-scheduler-agenda-appointment .ax-scheduler-agenda-appointment-time-inner{width:calc(var(--spacing, .25rem) * 3);height:calc(var(--spacing, .25rem) * 3)}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-appointment-container .ax-scheduler-agenda-appointment.all-day-segment .ax-scheduler-agenda-appointment-time{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 4);--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-appointment-container .ax-scheduler-agenda-appointment .ax-scheduler-agenda-appointment-time{display:flex;flex-shrink:0;align-items:center;gap:calc(var(--spacing, .25rem) * 4);font-size:.9em;opacity:90%;min-width:10rem}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-appointment-container .ax-scheduler-agenda-appointment .ax-scheduler-agenda-appointment-time .ax-scheduler-agenda-multiday-info{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2)}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-appointment-container .ax-scheduler-agenda-appointment .ax-scheduler-agenda-appointment-time .ax-scheduler-agenda-multiday-badge{display:inline-flex;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 1);border-radius:var(--radius-md, .375rem);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1);font-size:.8rem;--tw-leading: 1.2;line-height:1.2;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);white-space:nowrap;background-color:rgba(var(--ax-sys-color-primary-surface),.12);color:rgba(var(--ax-sys-color-primary-surface))}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-appointment-container .ax-scheduler-agenda-appointment .ax-scheduler-agenda-appointment-title{width:100%;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-appointment-container .ax-scheduler-agenda-appointment .ax-scheduler-action-icon{width:auto;cursor:pointer}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-appointment-container .ax-scheduler-agenda-no-appointments{text-align:center;color:rgba(var(--ax-sys-color-on-surface));font-style:italic}@supports (color: color-mix(in lab,red,red)){ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-appointment-container .ax-scheduler-agenda-no-appointments{color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 60%,transparent)}}ax-scheduler-agenda-view:not(.ax-state-readonly) .ax-scheduler-agenda-appointment{cursor:pointer}ax-scheduler-agenda-view:not(.ax-state-readonly) .ax-scheduler-agenda-view-container{cursor:pointer;transition-property:background-color;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));transition-duration:var(--ax-sys-transition-duration);transition-timing-function:var(--ax-sys-transition-timing-function)}}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-leading{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-font-weight: initial;--tw-leading: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: AXDragDirective, selector: "[axDrag]", inputs: ["axDrag", "dragData", "dragDisabled", "dragTransition", "dragElementClone", "dropZoneGroup", "dragStartDelay", "dragResetOnDblClick", "dragLockAxis", "dragClonedTemplate", "dragCursor", "dragBoundary", "dragTransitionDuration"], outputs: ["dragPositionChanged"] }, { kind: "directive", type: AXTooltipDirective, selector: "[axTooltip]", inputs: ["axTooltipDisabled", "axTooltip", "axTooltipContext", "axTooltipPlacement", "axTooltipOffsetX", "axTooltipOffsetY", "axTooltipOpenAfter", "axTooltipCloseAfter"] }, { kind: "directive", type: AXDropZoneDirective, selector: "[axDropZone]", inputs: ["dropZoneGroup"], outputs: ["onElementDrop", "onElementHover"], exportAs: ["axDropZone"] }, { kind: "component", type: AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXFormatPipe, name: "format" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
1017
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXSchedulerAgendaViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
1018
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXSchedulerAgendaViewComponent, isStandalone: true, selector: "ax-scheduler-agenda-view", inputs: { daysCount: { classPropertyName: "daysCount", publicName: "daysCount", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, draggable: { classPropertyName: "draggable", publicName: "draggable", isSignal: true, isRequired: false, transformFunction: null }, hasActions: { classPropertyName: "hasActions", publicName: "hasActions", isSignal: true, isRequired: false, transformFunction: null }, dragStartDelay: { classPropertyName: "dragStartDelay", publicName: "dragStartDelay", isSignal: true, isRequired: false, transformFunction: null }, calendar: { classPropertyName: "calendar", publicName: "calendar", isSignal: true, isRequired: false, transformFunction: null }, date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: true, transformFunction: null }, appointments: { classPropertyName: "appointments", publicName: "appointments", isSignal: true, isRequired: false, transformFunction: null }, tooltipTemplate: { classPropertyName: "tooltipTemplate", publicName: "tooltipTemplate", isSignal: true, isRequired: false, transformFunction: null }, selectedAppointmentId: { classPropertyName: "selectedAppointmentId", publicName: "selectedAppointmentId", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { slotClickedInternal: "slotClickedInternal", slotDblClickedInternal: "slotDblClickedInternal", slotRightClickedInternal: "slotRightClickedInternal", appointmentClickedInternal: "appointmentClickedInternal", appointmentDblClickedInternal: "appointmentDblClickedInternal", appointmentRightClickedInternal: "appointmentRightClickedInternal", onActionClickInternal: "onActionClickInternal", onAppointmentDropInternal: "onAppointmentDropInternal" }, host: { properties: { "class.ax-state-readonly": "readonly()" } }, providers: [{ provide: AXComponent, useExisting: AXSchedulerAgendaViewComponent }], usesInheritance: true, ngImport: i0, template: "<div class=\"ax-scheduler-agenda-container\">\n @for (dayData of agendaDaysLayout(); track dayData.date.date.getTime()) {\n <div\n axDropZone\n #zone=\"axDropZone\"\n (onElementDrop)=\"handleDrop($event, dayData.date)\"\n [class.ax-scheduler-slot-hovered]=\"zone.isHovered()\"\n [class.ax-state-today]=\"isToday(dayData.date)\"\n class=\"ax-scheduler-agenda-view-container {{\n dayData.holiday.state !== 'none' ? (dayData.holiday.holiday?.cssClass ?? 'ax-state-holiday') : ''\n }}\"\n [style.--ax-scheduler-holiday-color]=\"dayData.holiday.holiday?.color ?? null\"\n (click)=\"handleSlotEvent($event, dayData.date)\"\n (dblclick)=\"handleSlotEvent($event, dayData.date)\"\n (contextmenu)=\"handleSlotEvent($event, dayData.date)\"\n [attr.data-slot-id]=\"dayData.date.format('YYYYMMDD')\"\n >\n <div class=\"ax-scheduler-agenda-header-date-day\">\n <span\n class=\"ax-scheduler-agenda-header-date-day-char ax-scheduler-truncate\"\n [axTooltip]=\"(dayData.holiday?.holiday?.description ?? dayData.holiday?.holiday?.title ?? '') | translate | async\"\n [axTooltipPlacement]=\"'top-start'\"\n >\n {{ dayData.date | format: 'date' : { format: 'dddd', calendar: calendar() } | async }}\n @if (dayData.holiday.state === 'holiday' && dayData.holiday.holiday.title) {\n ( {{ dayData.holiday.holiday.title | translate | async }} )\n }\n </span>\n <span class=\"ax-scheduler-agenda-header-date-day-num\">\n {{ dayData.date | format: 'date' : { format: 'DD', calendar: calendar() } | async }}\n </span>\n </div>\n <div class=\"ax-scheduler-agenda-appointment-container\">\n @for (segment of dayData.appointments; track segment.id + segment.originalStartDate.getTime()) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragData]=\"segment\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || segment.readonly || readonly()\"\n (pointerdown)=\"getSlotId($event)\"\n (click)=\"handleAppointmentEvent($event, segment)\"\n (dblclick)=\"handleAppointmentEvent($event, segment)\"\n (contextmenu)=\"handleAppointmentEvent($event, segment)\"\n [title]=\"\n tooltipTemplate()\n ? ''\n : segment.title +\n (segment.allDay\n ? ' (All Day)'\n : ' (' +\n (segment.originalStartDate | format: 'time' : { calendar: calendar() } | async) +\n ' - ' +\n (segment.originalEndDate | format: 'time' : { calendar: calendar() } | async) +\n ')')\n \"\n class=\"ax-scheduler-agenda-appointment\"\n [class.all-day-segment]=\"segment.allDay\"\n [class.ax-state-active]=\"isActive(segment.id)\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltip]=\"tooltipTemplate()\"\n [axTooltipContext]=\"segment\"\n >\n <div class=\"ax-scheduler-agenda-appointment-time\">\n <div\n class=\"ax-scheduler-agenda-appointment-time-inner {{\n segment.cssClass ?? 'ax-scheduler-' + (segment.priority ?? 'primary') + '-priority'\n }}\"\n ></div>\n @if (segment.allDay) {\n @if (isMultiDayAppointment(segment)) {\n <span class=\"ax-scheduler-agenda-multiday-info\">\n <span class=\"ax-scheduler-agenda-multiday-badge\">\n {{\n getMultiDayStartDate(segment)\n | format: 'date' : { format: 'D MMM', calendar: calendar() }\n | async\n }}\n -\n {{\n getMultiDayEndDate(segment) | format: 'date' : { format: 'D MMM', calendar: calendar() } | async\n }}\n </span>\n </span>\n } @else {\n <span>{{ '@acorex:dateTime.duration.all-day' | translate | async }}</span>\n }\n } @else {\n @if (isMultiDayAppointment(segment)) {\n <span class=\"ax-scheduler-agenda-multiday-info\">\n <span class=\"ax-scheduler-agenda-multiday-badge\">\n {{\n getMultiDayStartDate(segment)\n | format: 'date' : { format: 'D MMM', calendar: calendar() }\n | async\n }}\n -\n {{\n getMultiDayEndDate(segment) | format: 'date' : { format: 'D MMM', calendar: calendar() } | async\n }}\n </span>\n <span>\n {{\n segment.originalStartDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async\n }}\n -\n {{ segment.originalEndDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}\n </span>\n </span>\n } @else {\n <span>\n {{ segment.originalStartDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}\n -\n {{ segment.originalEndDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}\n </span>\n }\n }\n </div>\n <ax-title class=\"ax-scheduler-agenda-appointment-title ax-scheduler-truncate\">{{ segment.title }}</ax-title>\n <!-- Description could go here if needed -->\n <!-- @if (segment.description) {\n <ax-subtitle>{{ segment.description }}</ax-subtitle>\n } -->\n @if (hasActions()) {\n <ax-icon\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n (click)=\"handleActionClick($event, segment)\"\n >\n </ax-icon>\n }\n </div>\n }\n @if (dayData.appointments.length === 0) {\n <div class=\"ax-scheduler-agenda-no-appointments\">\n {{ '@acorex:common.general.no-record' | translate | async }}\n </div>\n }\n </div>\n </div>\n }\n</div>\n", styles: ["@layer properties;@layer components{ax-scheduler-agenda-view .ax-scheduler-agenda-container{display:flex;height:100%;flex-direction:column}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-view-container{position:relative;display:flex;gap:calc(var(--spacing, .25rem) * 4);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 1);border-block-end:1px solid rgba(var(--ax-sys-color-border-surface))}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-view-container:last-child{border-block-end-width:0}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-view-container.ax-state-today{background-color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-view-container.ax-state-today{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 5%,transparent)}}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-view-container.ax-state-today .ax-scheduler-agenda-header-date-day{color:rgba(var(--ax-sys-color-primary-surface))}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-view-container.ax-state-today .ax-scheduler-agenda-header-date-day .ax-scheduler-month-header-date-day-char{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-view-container.ax-state-today .ax-scheduler-agenda-header-date-day .ax-scheduler-month-header-date-day-num{--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700)}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-view-container.ax-state-holiday .ax-scheduler-agenda-header-date-day{color:var(--ax-scheduler-holiday-color, rgba(var(--ax-sys-color-danger-surface)))}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-view-container.ax-state-holiday .ax-scheduler-agenda-header-date-day.ax-state-today{color:rgba(var(--ax-sys-color-primary-surface))}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-view-container .ax-scheduler-agenda-header-date-day{position:sticky;top:calc(var(--spacing, .25rem) * 4);display:flex;height:calc(var(--spacing, .25rem) * 14);max-width:calc(var(--spacing, .25rem) * 24);min-width:calc(var(--spacing, .25rem) * 24);flex-direction:column;align-items:flex-start;justify-content:center;gap:calc(var(--spacing, .25rem) * 1)}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-view-container .ax-scheduler-agenda-header-date-day .ax-scheduler-agenda-header-date-day-char{max-width:100%;--tw-font-weight: var(--font-weight-light, 300);font-weight:var(--font-weight-light, 300)}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-view-container .ax-scheduler-agenda-header-date-day .ax-scheduler-agenda-header-date-day-num{font-size:var(--text-xl, 1.25rem);line-height:var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-appointment-container{display:flex;width:100%;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 1);color:unset}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-appointment-container .ax-scheduler-agenda-appointment{display:flex;width:100%;flex-direction:row;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 2);overflow:hidden;border-radius:calc(var(--ax-sys-border-radius) / 2);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 1)}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-appointment-container .ax-scheduler-agenda-appointment:hover{background-color:rgba(var(--ax-comp-scheduler-slot-hover-bg, var(--ax-sys-color-primary-surface), .15))}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-appointment-container .ax-scheduler-agenda-appointment .ax-scheduler-agenda-appointment-time-inner{width:calc(var(--spacing, .25rem) * 3);height:calc(var(--spacing, .25rem) * 3)}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-appointment-container .ax-scheduler-agenda-appointment.all-day-segment .ax-scheduler-agenda-appointment-time{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 4);--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-appointment-container .ax-scheduler-agenda-appointment .ax-scheduler-agenda-appointment-time{display:flex;flex-shrink:0;align-items:center;gap:calc(var(--spacing, .25rem) * 4);font-size:.9em;opacity:90%;min-width:10rem}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-appointment-container .ax-scheduler-agenda-appointment .ax-scheduler-agenda-appointment-time .ax-scheduler-agenda-multiday-info{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2)}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-appointment-container .ax-scheduler-agenda-appointment .ax-scheduler-agenda-appointment-time .ax-scheduler-agenda-multiday-badge{display:inline-flex;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 1);border-radius:var(--radius-md, .375rem);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1);font-size:.8rem;--tw-leading: 1.2;line-height:1.2;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);white-space:nowrap;background-color:rgba(var(--ax-sys-color-primary-surface),.12);color:rgba(var(--ax-sys-color-primary-surface))}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-appointment-container .ax-scheduler-agenda-appointment .ax-scheduler-agenda-appointment-title{width:100%;--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-appointment-container .ax-scheduler-agenda-appointment .ax-scheduler-action-icon{width:auto;cursor:pointer}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-appointment-container .ax-scheduler-agenda-no-appointments{text-align:center;color:rgba(var(--ax-sys-color-on-surface));font-style:italic}@supports (color: color-mix(in lab,red,red)){ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-appointment-container .ax-scheduler-agenda-no-appointments{color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 60%,transparent)}}ax-scheduler-agenda-view:not(.ax-state-readonly) .ax-scheduler-agenda-appointment{cursor:pointer}ax-scheduler-agenda-view:not(.ax-state-readonly) .ax-scheduler-agenda-view-container{cursor:pointer;transition-property:background-color;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));transition-duration:var(--ax-sys-transition-duration);transition-timing-function:var(--ax-sys-transition-timing-function)}}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-leading{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-font-weight: initial;--tw-leading: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: AXDragDirective, selector: "[axDrag]", inputs: ["axDrag", "dragData", "dragDisabled", "dragTransition", "dragElementClone", "dropZoneGroup", "dragStartDelay", "dragResetOnDblClick", "dragLockAxis", "dragClonedTemplate", "dragCursor", "dragBoundary", "dragTransitionDuration"], outputs: ["dragPositionChanged"] }, { kind: "directive", type: AXTooltipDirective, selector: "[axTooltip]", inputs: ["axTooltipDisabled", "axTooltip", "axTooltipContext", "axTooltipPlacement", "axTooltipOffsetX", "axTooltipOffsetY", "axTooltipOpenAfter", "axTooltipCloseAfter"] }, { kind: "directive", type: AXDropZoneDirective, selector: "[axDropZone]", inputs: ["dropZoneGroup"], outputs: ["onElementDrop", "onElementHover"], exportAs: ["axDropZone"] }, { kind: "component", type: AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXFormatPipe, name: "format" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
1005
1019
|
}
|
|
1006
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1020
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXSchedulerAgendaViewComponent, decorators: [{
|
|
1007
1021
|
type: Component,
|
|
1008
|
-
args: [{ selector: 'ax-scheduler-agenda-view',
|
|
1022
|
+
args: [{ selector: 'ax-scheduler-agenda-view', encapsulation: ViewEncapsulation.None, host: {
|
|
1009
1023
|
'[class.ax-state-readonly]': 'readonly()',
|
|
1010
1024
|
}, imports: [
|
|
1011
1025
|
AsyncPipe,
|
|
@@ -1028,23 +1042,39 @@ class AXSchedulerDayViewComponent extends NXComponent {
|
|
|
1028
1042
|
this.calendarService = inject(AXCalendarService);
|
|
1029
1043
|
this.schedulerService = inject(AXSchedulerService);
|
|
1030
1044
|
this.GAP_PX = 1;
|
|
1031
|
-
this.rtl = input(false,
|
|
1032
|
-
|
|
1033
|
-
this.
|
|
1034
|
-
|
|
1035
|
-
this.
|
|
1036
|
-
|
|
1037
|
-
this.
|
|
1038
|
-
|
|
1039
|
-
this.
|
|
1040
|
-
|
|
1041
|
-
this.
|
|
1042
|
-
|
|
1043
|
-
this.
|
|
1044
|
-
|
|
1045
|
+
this.rtl = input(false, /* @ts-ignore */
|
|
1046
|
+
...(ngDevMode ? [{ debugName: "rtl" }] : /* istanbul ignore next */ []));
|
|
1047
|
+
this.readonly = input(false, /* @ts-ignore */
|
|
1048
|
+
...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
|
|
1049
|
+
this.draggable = input(true, /* @ts-ignore */
|
|
1050
|
+
...(ngDevMode ? [{ debugName: "draggable" }] : /* istanbul ignore next */ []));
|
|
1051
|
+
this.hasActions = input(false, /* @ts-ignore */
|
|
1052
|
+
...(ngDevMode ? [{ debugName: "hasActions" }] : /* istanbul ignore next */ []));
|
|
1053
|
+
this.dragStartDelay = input(0, /* @ts-ignore */
|
|
1054
|
+
...(ngDevMode ? [{ debugName: "dragStartDelay" }] : /* istanbul ignore next */ []));
|
|
1055
|
+
this.calendar = input(/* @ts-ignore */
|
|
1056
|
+
...(ngDevMode ? [undefined, { debugName: "calendar" }] : /* istanbul ignore next */ []));
|
|
1057
|
+
this.date = input.required(/* @ts-ignore */
|
|
1058
|
+
...(ngDevMode ? [{ debugName: "date" }] : /* istanbul ignore next */ []));
|
|
1059
|
+
this.endDayHour = input.required(/* @ts-ignore */
|
|
1060
|
+
...(ngDevMode ? [{ debugName: "endDayHour" }] : /* istanbul ignore next */ []));
|
|
1061
|
+
this.startDayHour = input.required(/* @ts-ignore */
|
|
1062
|
+
...(ngDevMode ? [{ debugName: "startDayHour" }] : /* istanbul ignore next */ []));
|
|
1063
|
+
this.showCurrentTimeIndicator = input(true, /* @ts-ignore */
|
|
1064
|
+
...(ngDevMode ? [{ debugName: "showCurrentTimeIndicator" }] : /* istanbul ignore next */ []));
|
|
1065
|
+
this.scrollToCurrentTimeIndicator = input(false, /* @ts-ignore */
|
|
1066
|
+
...(ngDevMode ? [{ debugName: "scrollToCurrentTimeIndicator" }] : /* istanbul ignore next */ []));
|
|
1067
|
+
this.appointments = input([], /* @ts-ignore */
|
|
1068
|
+
...(ngDevMode ? [{ debugName: "appointments" }] : /* istanbul ignore next */ []));
|
|
1069
|
+
this.tooltipTemplate = input(/* @ts-ignore */
|
|
1070
|
+
...(ngDevMode ? [undefined, { debugName: "tooltipTemplate" }] : /* istanbul ignore next */ []));
|
|
1071
|
+
this.selectedAppointmentId = input(null, /* @ts-ignore */
|
|
1072
|
+
...(ngDevMode ? [{ debugName: "selectedAppointmentId" }] : /* istanbul ignore next */ []));
|
|
1045
1073
|
// ViewChild for current time line element
|
|
1046
|
-
this.currentTimeLineElement = viewChild('currentTimeLine',
|
|
1047
|
-
|
|
1074
|
+
this.currentTimeLineElement = viewChild('currentTimeLine', /* @ts-ignore */
|
|
1075
|
+
...(ngDevMode ? [{ debugName: "currentTimeLineElement" }] : /* istanbul ignore next */ []));
|
|
1076
|
+
this.dragStartSlotId = signal(null, /* @ts-ignore */
|
|
1077
|
+
...(ngDevMode ? [{ debugName: "dragStartSlotId" }] : /* istanbul ignore next */ []));
|
|
1048
1078
|
this.processedAppointmentsForLayout = computed(() => {
|
|
1049
1079
|
const viewDate = this.date();
|
|
1050
1080
|
const startH = this.startDayHour();
|
|
@@ -1061,14 +1091,17 @@ class AXSchedulerDayViewComponent extends NXComponent {
|
|
|
1061
1091
|
}
|
|
1062
1092
|
}
|
|
1063
1093
|
return segmentsForThisDay;
|
|
1064
|
-
},
|
|
1094
|
+
}, /* @ts-ignore */
|
|
1095
|
+
...(ngDevMode ? [{ debugName: "processedAppointmentsForLayout" }] : /* istanbul ignore next */ []));
|
|
1065
1096
|
this.allDayAppointments = computed(() => {
|
|
1066
1097
|
// Use segments from processedAppointmentsForLayout to get continuation flags
|
|
1067
1098
|
return this.processedAppointmentsForLayout()?.filter((e) => e && e.allDay) ?? [];
|
|
1068
|
-
},
|
|
1099
|
+
}, /* @ts-ignore */
|
|
1100
|
+
...(ngDevMode ? [{ debugName: "allDayAppointments" }] : /* istanbul ignore next */ []));
|
|
1069
1101
|
this.singleDayAppointments = computed(() => {
|
|
1070
1102
|
return this.processedAppointmentsForLayout()?.filter((e) => e && !e.allDay) ?? [];
|
|
1071
|
-
},
|
|
1103
|
+
}, /* @ts-ignore */
|
|
1104
|
+
...(ngDevMode ? [{ debugName: "singleDayAppointments" }] : /* istanbul ignore next */ []));
|
|
1072
1105
|
this.slotClickedInternal = output();
|
|
1073
1106
|
this.slotDblClickedInternal = output();
|
|
1074
1107
|
this.slotRightClickedInternal = output();
|
|
@@ -1100,7 +1133,8 @@ class AXSchedulerDayViewComponent extends NXComponent {
|
|
|
1100
1133
|
hours.push(time);
|
|
1101
1134
|
}
|
|
1102
1135
|
return hours;
|
|
1103
|
-
},
|
|
1136
|
+
}, /* @ts-ignore */
|
|
1137
|
+
...(ngDevMode ? [{ debugName: "hoursArray" }] : /* istanbul ignore next */ []));
|
|
1104
1138
|
this.appointmentLayouts = computed(() => {
|
|
1105
1139
|
const layouts = new Map();
|
|
1106
1140
|
const appointmentsToLayout = this.singleDayAppointments();
|
|
@@ -1151,7 +1185,8 @@ class AXSchedulerDayViewComponent extends NXComponent {
|
|
|
1151
1185
|
});
|
|
1152
1186
|
}
|
|
1153
1187
|
return layouts;
|
|
1154
|
-
},
|
|
1188
|
+
}, /* @ts-ignore */
|
|
1189
|
+
...(ngDevMode ? [{ debugName: "appointmentLayouts" }] : /* istanbul ignore next */ []));
|
|
1155
1190
|
}
|
|
1156
1191
|
isActive(appointmentId) {
|
|
1157
1192
|
return this.selectedAppointmentId() === appointmentId;
|
|
@@ -1382,12 +1417,12 @@ class AXSchedulerDayViewComponent extends NXComponent {
|
|
|
1382
1417
|
.find((el) => el instanceof HTMLElement && el.dataset['slotId'] !== undefined);
|
|
1383
1418
|
this.dragStartSlotId.set(dropListElement ? dropListElement.dataset['slotId'] : null);
|
|
1384
1419
|
}
|
|
1385
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1386
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXSchedulerDayViewComponent, isStandalone: true, selector: "ax-scheduler-day-view", inputs: { rtl: { classPropertyName: "rtl", publicName: "rtl", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, draggable: { classPropertyName: "draggable", publicName: "draggable", isSignal: true, isRequired: false, transformFunction: null }, hasActions: { classPropertyName: "hasActions", publicName: "hasActions", isSignal: true, isRequired: false, transformFunction: null }, dragStartDelay: { classPropertyName: "dragStartDelay", publicName: "dragStartDelay", isSignal: true, isRequired: false, transformFunction: null }, calendar: { classPropertyName: "calendar", publicName: "calendar", isSignal: true, isRequired: false, transformFunction: null }, date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: true, transformFunction: null }, endDayHour: { classPropertyName: "endDayHour", publicName: "endDayHour", isSignal: true, isRequired: true, transformFunction: null }, startDayHour: { classPropertyName: "startDayHour", publicName: "startDayHour", isSignal: true, isRequired: true, transformFunction: null }, showCurrentTimeIndicator: { classPropertyName: "showCurrentTimeIndicator", publicName: "showCurrentTimeIndicator", isSignal: true, isRequired: false, transformFunction: null }, scrollToCurrentTimeIndicator: { classPropertyName: "scrollToCurrentTimeIndicator", publicName: "scrollToCurrentTimeIndicator", isSignal: true, isRequired: false, transformFunction: null }, appointments: { classPropertyName: "appointments", publicName: "appointments", isSignal: true, isRequired: false, transformFunction: null }, tooltipTemplate: { classPropertyName: "tooltipTemplate", publicName: "tooltipTemplate", isSignal: true, isRequired: false, transformFunction: null }, selectedAppointmentId: { classPropertyName: "selectedAppointmentId", publicName: "selectedAppointmentId", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { slotClickedInternal: "slotClickedInternal", slotDblClickedInternal: "slotDblClickedInternal", slotRightClickedInternal: "slotRightClickedInternal", appointmentClickedInternal: "appointmentClickedInternal", appointmentDblClickedInternal: "appointmentDblClickedInternal", appointmentRightClickedInternal: "appointmentRightClickedInternal", onActionClickInternal: "onActionClickInternal", onAppointmentDropInternal: "onAppointmentDropInternal" }, host: { properties: { "class.ax-state-readonly": "readonly()" } }, providers: [{ provide: AXComponent, useExisting: AXSchedulerDayViewComponent }], viewQueries: [{ propertyName: "currentTimeLineElement", first: true, predicate: ["currentTimeLine"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"ax-scheduler-day-header\">\n <div class=\"ax-scheduler-day-header-table\" aria-hidden=\"true\">\n <div>\n {{ '@acorex:dateTime.duration.all-day' | translate | async }}\n </div>\n </div>\n <div\n axDropZone\n #zone=\"axDropZone\"\n (onElementDrop)=\"handleAllDayDrop($event)\"\n [class.ax-scheduler-slot-hovered]=\"zone.isHovered()\"\n (click)=\"handleAllDaySlotEvent($event)\"\n (dblclick)=\"handleAllDaySlotEvent($event)\"\n (contextmenu)=\"handleAllDaySlotEvent($event)\"\n class=\"ax-scheduler-day-header-table-container\"\n [attr.data-slot-id]=\"date().format('YYYYMMDD') + '-allday'\"\n >\n <div class=\"ax-scheduler-day-header-appointment-container\">\n @if (allDayAppointments().length) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || allDayAppointments()[0].readonly || readonly()\"\n (pointerdown)=\"getSlotId($event)\"\n [dragData]=\"allDayAppointments()[0]\"\n (click)=\"handleAppointmentEvent($event, allDayAppointments()[0])\"\n (dblclick)=\"handleAppointmentEvent($event, allDayAppointments()[0])\"\n (contextmenu)=\"handleAppointmentEvent($event, allDayAppointments()[0])\"\n [title]=\"tooltipTemplate() ? '' : allDayAppointments()[0].title\"\n class=\"ax-scheduler-header-day-appointment\"\n [class.ax-continuation-from-previous]=\"allDayAppointments()[0].isContinuationFromPreviousDay\"\n [class.ax-continuation-to-next]=\"allDayAppointments()[0].isContinuationToNextDay\"\n [class.ax-state-active]=\"isActive(allDayAppointments()[0].id)\"\n [class]=\"\n allDayAppointments()[0].cssClass ??\n 'ax-scheduler-' + (allDayAppointments()[0].priority ?? 'primary') + '-priority'\n \"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltipContext]=\"allDayAppointments()[0]\"\n [axTooltip]=\"tooltipTemplate()\"\n >\n <ax-title>\n <span class=\"ax-scheduler-truncate\">{{ allDayAppointments()[0].title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, allDayAppointments()[0])\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n >\n </ax-icon>\n }\n </ax-title>\n <ax-subtitle>\n {{ allDayAppointments()[0].startDate | format: 'date' : { calendar: calendar() } | async }}\n -\n {{ allDayAppointments()[0].endDate | format: 'date' : { calendar: calendar() } | async }}\n </ax-subtitle>\n </div>\n }\n @if (allDayAppointments().length > 1) {\n <div\n #moreAppointments\n class=\"ax-scheduler-day-header-more-tag\"\n [class]=\"\n allDayAppointments()[1].cssClass ??\n 'ax-scheduler-' + (allDayAppointments()[1].priority ?? 'primary') + '-priority'\n \"\n >\n {{\n '@acorex:common.general.more-items'\n | translate: { params: { number: allDayAppointments().length - 1 } }\n | async\n }}\n </div>\n <ax-popover [target]=\"moreAppointments\">\n <div class=\"ax-scheduler-popover\" [class.ax-state-readonly]=\"readonly()\" axDropZone>\n @for (appointment of allDayAppointments(); track appointment.id; let first = $first) {\n @if (!first) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragData]=\"appointment\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || appointment.readonly || readonly()\"\n (click)=\"handleAppointmentEvent($event, appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, appointment)\"\n [title]=\"tooltipTemplate() ? '' : appointment.title\"\n class=\"ax-scheduler-popover-appointment\"\n [class.ax-continuation-from-previous]=\"appointment.isContinuationFromPreviousDay\"\n [class.ax-continuation-to-next]=\"appointment.isContinuationToNextDay\"\n [class.ax-state-active]=\"isActive(appointment.id)\"\n [class]=\"appointment.cssClass ?? 'ax-scheduler-' + (appointment.priority ?? 'primary') + '-priority'\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltipContext]=\"appointment\"\n [axTooltip]=\"tooltipTemplate()\"\n >\n <ax-title>\n @if (appointment.isContinuationFromPreviousDay) {\n <span class=\"ax-continuation-arrow\">{{ rtl() ? '\u2192 ' : '\u2190 ' }}</span>\n }\n <span class=\"ax-scheduler-truncate\">{{ appointment.title }}</span>\n @if (appointment.isContinuationToNextDay) {\n <span class=\"ax-continuation-arrow\">{{ rtl() ? ' \u2190' : ' \u2192' }}</span>\n }\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, appointment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n >\n </ax-icon>\n }\n </ax-title>\n <ax-subtitle>\n {{ appointment.originalStartDate | format: 'date' : { calendar: calendar() } | async }}\n -\n {{ appointment.originalEndDate | format: 'date' : { calendar: calendar() } | async }}\n </ax-subtitle>\n </div>\n }\n }\n </div>\n </ax-popover>\n }\n </div>\n </div>\n</div>\n\n<div class=\"ax-scheduler-day-time-container\">\n <table class=\"ax-scheduler-day-time\" aria-hidden=\"true\" [border]=\"1\">\n @for (time of hoursArray(); track time.date.getTime()) {\n <div>\n {{ time | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}\n </div>\n }\n </table>\n <div class=\"ax-scheduler-day-table-container\">\n <!-- Current Time Line Indicator -->\n @if (showCurrentTimeIndicator() && getCurrentTimePositionWithOffset() !== null) {\n <div\n #currentTimeLine\n class=\"ax-scheduler-current-time-line\"\n [style.inset-block-start]=\"getCurrentTimePositionWithOffset()\"\n ></div>\n }\n <div class=\"ax-scheduler-day-appointment-container\">\n @for (appointment of singleDayAppointments(); track appointment.id) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragData]=\"appointment\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || appointment.readonly || readonly()\"\n (pointerdown)=\"getSlotId($event)\"\n (click)=\"handleAppointmentEvent($event, appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, appointment)\"\n [title]=\"tooltipTemplate() ? '' : appointment.title\"\n class=\"ax-scheduler-day-appointment\"\n [class.ax-continuation-from-previous]=\"appointment.isContinuationFromPreviousDay\"\n [class.ax-continuation-to-next]=\"appointment.isContinuationToNextDay\"\n [class.ax-state-active]=\"isActive(appointment.id)\"\n [style.width]=\"getAppointmentWidth(appointment.id)\"\n [style.height]=\"getAppointmentHeight(appointment.id)\"\n [style.inset-block-start]=\"getAppointmentTop(appointment.id)\"\n [style.inset-inline-start]=\"getAppointmentLeft(appointment.id)\"\n [class]=\"appointment.cssClass ?? 'ax-scheduler-' + (appointment.priority ?? 'primary') + '-priority'\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltipContext]=\"appointment\"\n [axTooltip]=\"tooltipTemplate()\"\n >\n <ax-title>\n <span class=\"ax-scheduler-truncate\">{{ appointment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, appointment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n >\n </ax-icon>\n }\n </ax-title>\n <ax-subtitle>\n {{ appointment.originalStartDate | format: 'time' : { calendar: calendar() } | async }} -\n {{ appointment.originalEndDate | format: 'time' : { calendar: calendar() } | async }}\n </ax-subtitle>\n </div>\n }\n </div>\n <div aria-hidden=\"true\" class=\"ax-scheduler-day-slot\">\n @for (time of hoursArray(); track time.date.getTime()) {\n <div\n axDropZone\n #zone=\"axDropZone\"\n (onElementDrop)=\"handleSingleDayDrop($event, time)\"\n [class.ax-scheduler-slot-hovered]=\"zone.isHovered()\"\n (click)=\"handleSingleSlotEvent($event, time)\"\n (dblclick)=\"handleSingleSlotEvent($event, time)\"\n (contextmenu)=\"handleSingleSlotEvent($event, time)\"\n [attr.data-slot-id]=\"time.format('YYYYMMDD-HHmm')\"\n ></div>\n <div\n axDropZone\n #zone2=\"axDropZone\"\n [class.ax-scheduler-slot-hovered]=\"zone2.isHovered()\"\n (onElementDrop)=\"handleSingleDayDrop($event, time.add('minute', 30))\"\n (click)=\"handleSingleSlotEvent($event, time.add('minute', 30))\"\n (dblclick)=\"handleSingleSlotEvent($event, time.add('minute', 30))\"\n (contextmenu)=\"handleSingleSlotEvent($event, time.add('minute', 30))\"\n [attr.data-slot-id]=\"time.add('minute', 30).format('YYYYMMDD-HHmm')\"\n ></div>\n }\n </div>\n </div>\n</div>\n", styles: ["@layer properties;@layer components{ax-scheduler-day-view{position:relative;display:block;min-width:var(--ax-comp-scheduler-width);background-color:inherit}ax-scheduler-day-view .ax-scheduler-day-header{position:sticky;top:calc(var(--spacing, .25rem) * 0);z-index:10;display:flex;width:100%;border-style:var(--tw-border-style);border-width:1px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:var(--ax-comp-scheduler-all-day-bg,inherit)}ax-scheduler-day-view .ax-scheduler-day-header .ax-scheduler-day-header-table{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 0);z-index:10;background-color:inherit}ax-scheduler-day-view .ax-scheduler-day-header .ax-scheduler-day-header-table div{display:flex;height:var(--ax-comp-scheduler-basic-view-blocks-height);width:var(--ax-comp-scheduler-basic-view-blocks-width);align-items:center;justify-content:center;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-day-view .ax-scheduler-day-header .ax-scheduler-day-header-table-container{display:flex;width:100%}ax-scheduler-day-view .ax-scheduler-day-header .ax-scheduler-day-header-table-container .ax-scheduler-day-header-appointment-container{display:flex;width:calc(100% - 2.5rem);gap:calc(var(--spacing, .25rem) * 4)}ax-scheduler-day-view .ax-scheduler-day-header .ax-scheduler-day-header-table-container .ax-scheduler-day-header-appointment-container .ax-scheduler-header-day-appointment{display:flex;width:100%;flex-direction:column;justify-content:center;overflow:hidden;border-radius:calc(var(--ax-sys-border-radius) / 2);padding-inline:calc(var(--spacing, .25rem) * 2)}ax-scheduler-day-view .ax-scheduler-day-header .ax-scheduler-day-header-table-container .ax-scheduler-day-header-appointment-container .ax-scheduler-day-header-more-tag{display:flex;cursor:pointer;flex-direction:column;justify-content:center;border-radius:var(--ax-sys-border-radius);padding-inline:calc(var(--spacing, .25rem) * 2);text-wrap:nowrap}ax-scheduler-day-view .ax-scheduler-day-time-container{display:flex;width:100%;background-color:inherit}ax-scheduler-day-view .ax-scheduler-day-time-container .ax-scheduler-day-time{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 0);z-index:15;background-color:var(--ax-comp-scheduler-all-day-bg,inherit)}ax-scheduler-day-view .ax-scheduler-day-time-container .ax-scheduler-day-time div{position:relative;display:block;height:calc(var(--ax-comp-scheduler-basic-view-blocks-height) * 2);width:var(--ax-comp-scheduler-basic-view-blocks-width);border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));text-align:center}ax-scheduler-day-view .ax-scheduler-day-time-container .ax-scheduler-day-table-container{position:relative;width:100%}ax-scheduler-day-view .ax-scheduler-day-time-container .ax-scheduler-day-table-container .ax-scheduler-day-appointment-container{position:absolute;top:calc(var(--spacing, .25rem) * 0);width:calc(100% - 2.5rem)}ax-scheduler-day-view .ax-scheduler-day-time-container .ax-scheduler-day-table-container .ax-scheduler-day-appointment-container .ax-scheduler-day-appointment{position:absolute;inset-inline-start:calc(var(--spacing, .25rem) * 0);display:flex;width:100%;flex-direction:column;overflow:hidden;border-radius:calc(var(--ax-sys-border-radius) / 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1)}ax-scheduler-day-view .ax-scheduler-day-time-container .ax-scheduler-day-table-container .ax-scheduler-day-slot{width:100%}ax-scheduler-day-view .ax-scheduler-day-time-container .ax-scheduler-day-table-container .ax-scheduler-day-slot div{display:block;height:var(--ax-comp-scheduler-basic-view-blocks-height);border-top-style:var(--tw-border-style);border-top-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 2)}ax-scheduler-day-view .ax-scheduler-day-time-container .ax-scheduler-day-table-container .ax-scheduler-day-slot div:first-child{border-top-style:var(--tw-border-style);border-top-width:0px}ax-scheduler-day-view:not(.ax-state-readonly) .ax-scheduler-header-day-appointment,ax-scheduler-day-view:not(.ax-state-readonly) .ax-scheduler-day-appointment{cursor:pointer}ax-scheduler-day-view:not(.ax-state-readonly) .ax-scheduler-day-header-table-container,ax-scheduler-day-view:not(.ax-state-readonly) .ax-scheduler-day-slot>div{cursor:pointer;transition-property:background-color;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s))}:is(ax-scheduler-day-view:not(.ax-state-readonly) .ax-scheduler-day-header-table-container,ax-scheduler-day-view:not(.ax-state-readonly) .ax-scheduler-day-slot>div):hover{background-color:rgba(var(--ax-comp-scheduler-slot-hover-bg,var(--ax-sys-color-primary-surface),.1))}ax-scheduler-day-view ax-title{display:flex;justify-content:space-between}ax-scheduler-day-view ax-title .ax-scheduler-action-icon{width:auto;cursor:pointer}ax-scheduler-day-view .ax-scheduler-current-time-line{inset-inline:calc(var(--spacing, .25rem) * 0);height:calc(var(--spacing, .25rem) * .5)}ax-scheduler-day-view .ax-scheduler-current-time-line:before{inset-inline-start:-6px;top:-5px}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: AXDragDirective, selector: "[axDrag]", inputs: ["axDrag", "dragData", "dragDisabled", "dragTransition", "dragElementClone", "dropZoneGroup", "dragStartDelay", "dragResetOnDblClick", "dragLockAxis", "dragClonedTemplate", "dragCursor", "dragBoundary", "dragTransitionDuration"], outputs: ["dragPositionChanged"] }, { kind: "component", type: AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disablePanelClass", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "closeOnScroll", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "directive", type: AXTooltipDirective, selector: "[axTooltip]", inputs: ["axTooltipDisabled", "axTooltip", "axTooltipContext", "axTooltipPlacement", "axTooltipOffsetX", "axTooltipOffsetY", "axTooltipOpenAfter", "axTooltipCloseAfter"] }, { kind: "directive", type: AXDropZoneDirective, selector: "[axDropZone]", inputs: ["dropZoneGroup"], outputs: ["onElementDrop", "onElementHover"], exportAs: ["axDropZone"] }, { kind: "component", type: AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXFormatPipe, name: "format" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
1420
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXSchedulerDayViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
1421
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXSchedulerDayViewComponent, isStandalone: true, selector: "ax-scheduler-day-view", inputs: { rtl: { classPropertyName: "rtl", publicName: "rtl", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, draggable: { classPropertyName: "draggable", publicName: "draggable", isSignal: true, isRequired: false, transformFunction: null }, hasActions: { classPropertyName: "hasActions", publicName: "hasActions", isSignal: true, isRequired: false, transformFunction: null }, dragStartDelay: { classPropertyName: "dragStartDelay", publicName: "dragStartDelay", isSignal: true, isRequired: false, transformFunction: null }, calendar: { classPropertyName: "calendar", publicName: "calendar", isSignal: true, isRequired: false, transformFunction: null }, date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: true, transformFunction: null }, endDayHour: { classPropertyName: "endDayHour", publicName: "endDayHour", isSignal: true, isRequired: true, transformFunction: null }, startDayHour: { classPropertyName: "startDayHour", publicName: "startDayHour", isSignal: true, isRequired: true, transformFunction: null }, showCurrentTimeIndicator: { classPropertyName: "showCurrentTimeIndicator", publicName: "showCurrentTimeIndicator", isSignal: true, isRequired: false, transformFunction: null }, scrollToCurrentTimeIndicator: { classPropertyName: "scrollToCurrentTimeIndicator", publicName: "scrollToCurrentTimeIndicator", isSignal: true, isRequired: false, transformFunction: null }, appointments: { classPropertyName: "appointments", publicName: "appointments", isSignal: true, isRequired: false, transformFunction: null }, tooltipTemplate: { classPropertyName: "tooltipTemplate", publicName: "tooltipTemplate", isSignal: true, isRequired: false, transformFunction: null }, selectedAppointmentId: { classPropertyName: "selectedAppointmentId", publicName: "selectedAppointmentId", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { slotClickedInternal: "slotClickedInternal", slotDblClickedInternal: "slotDblClickedInternal", slotRightClickedInternal: "slotRightClickedInternal", appointmentClickedInternal: "appointmentClickedInternal", appointmentDblClickedInternal: "appointmentDblClickedInternal", appointmentRightClickedInternal: "appointmentRightClickedInternal", onActionClickInternal: "onActionClickInternal", onAppointmentDropInternal: "onAppointmentDropInternal" }, host: { properties: { "class.ax-state-readonly": "readonly()" } }, providers: [{ provide: AXComponent, useExisting: AXSchedulerDayViewComponent }], viewQueries: [{ propertyName: "currentTimeLineElement", first: true, predicate: ["currentTimeLine"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"ax-scheduler-day-header\">\n <div class=\"ax-scheduler-day-header-table\" aria-hidden=\"true\">\n <div>\n {{ '@acorex:dateTime.duration.all-day' | translate | async }}\n </div>\n </div>\n <div\n axDropZone\n #zone=\"axDropZone\"\n (onElementDrop)=\"handleAllDayDrop($event)\"\n [class.ax-scheduler-slot-hovered]=\"zone.isHovered()\"\n (click)=\"handleAllDaySlotEvent($event)\"\n (dblclick)=\"handleAllDaySlotEvent($event)\"\n (contextmenu)=\"handleAllDaySlotEvent($event)\"\n class=\"ax-scheduler-day-header-table-container\"\n [attr.data-slot-id]=\"date().format('YYYYMMDD') + '-allday'\"\n >\n <div class=\"ax-scheduler-day-header-appointment-container\">\n @if (allDayAppointments().length) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || allDayAppointments()[0].readonly || readonly()\"\n (pointerdown)=\"getSlotId($event)\"\n [dragData]=\"allDayAppointments()[0]\"\n (click)=\"handleAppointmentEvent($event, allDayAppointments()[0])\"\n (dblclick)=\"handleAppointmentEvent($event, allDayAppointments()[0])\"\n (contextmenu)=\"handleAppointmentEvent($event, allDayAppointments()[0])\"\n [title]=\"tooltipTemplate() ? '' : allDayAppointments()[0].title\"\n class=\"ax-scheduler-header-day-appointment\"\n [class.ax-continuation-from-previous]=\"allDayAppointments()[0].isContinuationFromPreviousDay\"\n [class.ax-continuation-to-next]=\"allDayAppointments()[0].isContinuationToNextDay\"\n [class.ax-state-active]=\"isActive(allDayAppointments()[0].id)\"\n [class]=\"\n allDayAppointments()[0].cssClass ??\n 'ax-scheduler-' + (allDayAppointments()[0].priority ?? 'primary') + '-priority'\n \"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltipContext]=\"allDayAppointments()[0]\"\n [axTooltip]=\"tooltipTemplate()\"\n >\n <ax-title>\n <span class=\"ax-scheduler-truncate\">{{ allDayAppointments()[0].title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, allDayAppointments()[0])\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n >\n </ax-icon>\n }\n </ax-title>\n <ax-subtitle>\n {{ allDayAppointments()[0].startDate | format: 'date' : { calendar: calendar() } | async }}\n -\n {{ allDayAppointments()[0].endDate | format: 'date' : { calendar: calendar() } | async }}\n </ax-subtitle>\n </div>\n }\n @if (allDayAppointments().length > 1) {\n <div\n #moreAppointments\n class=\"ax-scheduler-day-header-more-tag\"\n [class]=\"\n allDayAppointments()[1].cssClass ??\n 'ax-scheduler-' + (allDayAppointments()[1].priority ?? 'primary') + '-priority'\n \"\n >\n {{\n '@acorex:common.general.more-items'\n | translate: { params: { number: allDayAppointments().length - 1 } }\n | async\n }}\n </div>\n <ax-popover [target]=\"moreAppointments\">\n <div class=\"ax-scheduler-popover\" [class.ax-state-readonly]=\"readonly()\" axDropZone>\n @for (appointment of allDayAppointments(); track appointment.id; let first = $first) {\n @if (!first) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragData]=\"appointment\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || appointment.readonly || readonly()\"\n (click)=\"handleAppointmentEvent($event, appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, appointment)\"\n [title]=\"tooltipTemplate() ? '' : appointment.title\"\n class=\"ax-scheduler-popover-appointment\"\n [class.ax-continuation-from-previous]=\"appointment.isContinuationFromPreviousDay\"\n [class.ax-continuation-to-next]=\"appointment.isContinuationToNextDay\"\n [class.ax-state-active]=\"isActive(appointment.id)\"\n [class]=\"appointment.cssClass ?? 'ax-scheduler-' + (appointment.priority ?? 'primary') + '-priority'\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltipContext]=\"appointment\"\n [axTooltip]=\"tooltipTemplate()\"\n >\n <ax-title>\n @if (appointment.isContinuationFromPreviousDay) {\n <span class=\"ax-continuation-arrow\">{{ rtl() ? '\u2192 ' : '\u2190 ' }}</span>\n }\n <span class=\"ax-scheduler-truncate\">{{ appointment.title }}</span>\n @if (appointment.isContinuationToNextDay) {\n <span class=\"ax-continuation-arrow\">{{ rtl() ? ' \u2190' : ' \u2192' }}</span>\n }\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, appointment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n >\n </ax-icon>\n }\n </ax-title>\n <ax-subtitle>\n {{ appointment.originalStartDate | format: 'date' : { calendar: calendar() } | async }}\n -\n {{ appointment.originalEndDate | format: 'date' : { calendar: calendar() } | async }}\n </ax-subtitle>\n </div>\n }\n }\n </div>\n </ax-popover>\n }\n </div>\n </div>\n</div>\n\n<div class=\"ax-scheduler-day-time-container\">\n <table class=\"ax-scheduler-day-time\" aria-hidden=\"true\" [border]=\"1\">\n @for (time of hoursArray(); track time.date.getTime()) {\n <div>\n {{ time | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}\n </div>\n }\n </table>\n <div class=\"ax-scheduler-day-table-container\">\n <!-- Current Time Line Indicator -->\n @if (showCurrentTimeIndicator() && getCurrentTimePositionWithOffset() !== null) {\n <div\n #currentTimeLine\n class=\"ax-scheduler-current-time-line\"\n [style.inset-block-start]=\"getCurrentTimePositionWithOffset()\"\n ></div>\n }\n <div class=\"ax-scheduler-day-appointment-container\">\n @for (appointment of singleDayAppointments(); track appointment.id) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragData]=\"appointment\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || appointment.readonly || readonly()\"\n (pointerdown)=\"getSlotId($event)\"\n (click)=\"handleAppointmentEvent($event, appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, appointment)\"\n [title]=\"tooltipTemplate() ? '' : appointment.title\"\n class=\"ax-scheduler-day-appointment\"\n [class.ax-continuation-from-previous]=\"appointment.isContinuationFromPreviousDay\"\n [class.ax-continuation-to-next]=\"appointment.isContinuationToNextDay\"\n [class.ax-state-active]=\"isActive(appointment.id)\"\n [style.width]=\"getAppointmentWidth(appointment.id)\"\n [style.height]=\"getAppointmentHeight(appointment.id)\"\n [style.inset-block-start]=\"getAppointmentTop(appointment.id)\"\n [style.inset-inline-start]=\"getAppointmentLeft(appointment.id)\"\n [class]=\"appointment.cssClass ?? 'ax-scheduler-' + (appointment.priority ?? 'primary') + '-priority'\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltipContext]=\"appointment\"\n [axTooltip]=\"tooltipTemplate()\"\n >\n <ax-title>\n <span class=\"ax-scheduler-truncate\">{{ appointment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, appointment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n >\n </ax-icon>\n }\n </ax-title>\n <ax-subtitle>\n {{ appointment.originalStartDate | format: 'time' : { calendar: calendar() } | async }} -\n {{ appointment.originalEndDate | format: 'time' : { calendar: calendar() } | async }}\n </ax-subtitle>\n </div>\n }\n </div>\n <div aria-hidden=\"true\" class=\"ax-scheduler-day-slot\">\n @for (time of hoursArray(); track time.date.getTime()) {\n <div\n axDropZone\n #zone=\"axDropZone\"\n (onElementDrop)=\"handleSingleDayDrop($event, time)\"\n [class.ax-scheduler-slot-hovered]=\"zone.isHovered()\"\n (click)=\"handleSingleSlotEvent($event, time)\"\n (dblclick)=\"handleSingleSlotEvent($event, time)\"\n (contextmenu)=\"handleSingleSlotEvent($event, time)\"\n [attr.data-slot-id]=\"time.format('YYYYMMDD-HHmm')\"\n ></div>\n <div\n axDropZone\n #zone2=\"axDropZone\"\n [class.ax-scheduler-slot-hovered]=\"zone2.isHovered()\"\n (onElementDrop)=\"handleSingleDayDrop($event, time.add('minute', 30))\"\n (click)=\"handleSingleSlotEvent($event, time.add('minute', 30))\"\n (dblclick)=\"handleSingleSlotEvent($event, time.add('minute', 30))\"\n (contextmenu)=\"handleSingleSlotEvent($event, time.add('minute', 30))\"\n [attr.data-slot-id]=\"time.add('minute', 30).format('YYYYMMDD-HHmm')\"\n ></div>\n }\n </div>\n </div>\n</div>\n", styles: ["@layer properties;@layer components{ax-scheduler-day-view{position:relative;display:block;min-width:var(--ax-comp-scheduler-width);background-color:inherit}ax-scheduler-day-view .ax-scheduler-day-header{position:sticky;top:calc(var(--spacing, .25rem) * 0);z-index:10;display:flex;width:100%;border-style:var(--tw-border-style);border-width:1px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:var(--ax-comp-scheduler-all-day-bg,inherit)}ax-scheduler-day-view .ax-scheduler-day-header .ax-scheduler-day-header-table{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 0);z-index:10;background-color:inherit}ax-scheduler-day-view .ax-scheduler-day-header .ax-scheduler-day-header-table div{display:flex;height:var(--ax-comp-scheduler-basic-view-blocks-height);width:var(--ax-comp-scheduler-basic-view-blocks-width);align-items:center;justify-content:center;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-day-view .ax-scheduler-day-header .ax-scheduler-day-header-table-container{display:flex;width:100%}ax-scheduler-day-view .ax-scheduler-day-header .ax-scheduler-day-header-table-container .ax-scheduler-day-header-appointment-container{display:flex;width:calc(100% - 2.5rem);gap:calc(var(--spacing, .25rem) * 4)}ax-scheduler-day-view .ax-scheduler-day-header .ax-scheduler-day-header-table-container .ax-scheduler-day-header-appointment-container .ax-scheduler-header-day-appointment{display:flex;width:100%;flex-direction:column;justify-content:center;overflow:hidden;border-radius:calc(var(--ax-sys-border-radius) / 2);padding-inline:calc(var(--spacing, .25rem) * 2)}ax-scheduler-day-view .ax-scheduler-day-header .ax-scheduler-day-header-table-container .ax-scheduler-day-header-appointment-container .ax-scheduler-day-header-more-tag{display:flex;cursor:pointer;flex-direction:column;justify-content:center;border-radius:var(--ax-sys-border-radius);padding-inline:calc(var(--spacing, .25rem) * 2);text-wrap:nowrap}ax-scheduler-day-view .ax-scheduler-day-time-container{display:flex;width:100%;background-color:inherit}ax-scheduler-day-view .ax-scheduler-day-time-container .ax-scheduler-day-time{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 0);z-index:15;background-color:var(--ax-comp-scheduler-all-day-bg,inherit)}ax-scheduler-day-view .ax-scheduler-day-time-container .ax-scheduler-day-time div{position:relative;display:block;height:calc(var(--ax-comp-scheduler-basic-view-blocks-height) * 2);width:var(--ax-comp-scheduler-basic-view-blocks-width);border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));text-align:center}ax-scheduler-day-view .ax-scheduler-day-time-container .ax-scheduler-day-table-container{position:relative;width:100%}ax-scheduler-day-view .ax-scheduler-day-time-container .ax-scheduler-day-table-container .ax-scheduler-day-appointment-container{position:absolute;top:calc(var(--spacing, .25rem) * 0);width:calc(100% - 2.5rem)}ax-scheduler-day-view .ax-scheduler-day-time-container .ax-scheduler-day-table-container .ax-scheduler-day-appointment-container .ax-scheduler-day-appointment{position:absolute;inset-inline-start:calc(var(--spacing, .25rem) * 0);display:flex;width:100%;flex-direction:column;overflow:hidden;border-radius:calc(var(--ax-sys-border-radius) / 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1)}ax-scheduler-day-view .ax-scheduler-day-time-container .ax-scheduler-day-table-container .ax-scheduler-day-slot{width:100%}ax-scheduler-day-view .ax-scheduler-day-time-container .ax-scheduler-day-table-container .ax-scheduler-day-slot div{display:block;height:var(--ax-comp-scheduler-basic-view-blocks-height);border-top-style:var(--tw-border-style);border-top-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 2)}ax-scheduler-day-view .ax-scheduler-day-time-container .ax-scheduler-day-table-container .ax-scheduler-day-slot div:first-child{border-top-style:var(--tw-border-style);border-top-width:0px}ax-scheduler-day-view:not(.ax-state-readonly) .ax-scheduler-header-day-appointment,ax-scheduler-day-view:not(.ax-state-readonly) .ax-scheduler-day-appointment{cursor:pointer}ax-scheduler-day-view:not(.ax-state-readonly) .ax-scheduler-day-header-table-container,ax-scheduler-day-view:not(.ax-state-readonly) .ax-scheduler-day-slot>div{cursor:pointer;transition-property:background-color;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s))}:is(ax-scheduler-day-view:not(.ax-state-readonly) .ax-scheduler-day-header-table-container,ax-scheduler-day-view:not(.ax-state-readonly) .ax-scheduler-day-slot>div):hover{background-color:rgba(var(--ax-comp-scheduler-slot-hover-bg,var(--ax-sys-color-primary-surface),.1))}ax-scheduler-day-view ax-title{display:flex;justify-content:space-between}ax-scheduler-day-view ax-title .ax-scheduler-action-icon{width:auto;cursor:pointer}ax-scheduler-day-view .ax-scheduler-current-time-line{inset-inline:calc(var(--spacing, .25rem) * 0);height:calc(var(--spacing, .25rem) * .5)}ax-scheduler-day-view .ax-scheduler-current-time-line:before{inset-inline-start:-6px;top:-5px}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: AXDragDirective, selector: "[axDrag]", inputs: ["axDrag", "dragData", "dragDisabled", "dragTransition", "dragElementClone", "dropZoneGroup", "dragStartDelay", "dragResetOnDblClick", "dragLockAxis", "dragClonedTemplate", "dragCursor", "dragBoundary", "dragTransitionDuration"], outputs: ["dragPositionChanged"] }, { kind: "component", type: AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disablePanelClass", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "closeOnScroll", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "directive", type: AXTooltipDirective, selector: "[axTooltip]", inputs: ["axTooltipDisabled", "axTooltip", "axTooltipContext", "axTooltipPlacement", "axTooltipOffsetX", "axTooltipOffsetY", "axTooltipOpenAfter", "axTooltipCloseAfter"] }, { kind: "directive", type: AXDropZoneDirective, selector: "[axDropZone]", inputs: ["dropZoneGroup"], outputs: ["onElementDrop", "onElementHover"], exportAs: ["axDropZone"] }, { kind: "component", type: AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXFormatPipe, name: "format" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
1387
1422
|
}
|
|
1388
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1423
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXSchedulerDayViewComponent, decorators: [{
|
|
1389
1424
|
type: Component,
|
|
1390
|
-
args: [{ selector: 'ax-scheduler-day-view',
|
|
1425
|
+
args: [{ selector: 'ax-scheduler-day-view', encapsulation: ViewEncapsulation.None, host: {
|
|
1391
1426
|
'[class.ax-state-readonly]': 'readonly()',
|
|
1392
1427
|
}, imports: [
|
|
1393
1428
|
AsyncPipe,
|
|
@@ -1411,20 +1446,31 @@ class AXSchedulerMonthViewComponent extends NXComponent {
|
|
|
1411
1446
|
this.localeService = inject(AXLocaleService);
|
|
1412
1447
|
this.schedulerService = inject(AXSchedulerService);
|
|
1413
1448
|
// --- Inputs ---
|
|
1414
|
-
this.readonly = input(false,
|
|
1415
|
-
|
|
1416
|
-
this.
|
|
1417
|
-
|
|
1418
|
-
this.
|
|
1419
|
-
|
|
1420
|
-
this.
|
|
1421
|
-
|
|
1422
|
-
this.
|
|
1423
|
-
|
|
1449
|
+
this.readonly = input(false, /* @ts-ignore */
|
|
1450
|
+
...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
|
|
1451
|
+
this.draggable = input(true, /* @ts-ignore */
|
|
1452
|
+
...(ngDevMode ? [{ debugName: "draggable" }] : /* istanbul ignore next */ []));
|
|
1453
|
+
this.hasActions = input(false, /* @ts-ignore */
|
|
1454
|
+
...(ngDevMode ? [{ debugName: "hasActions" }] : /* istanbul ignore next */ []));
|
|
1455
|
+
this.dragStartDelay = input(0, /* @ts-ignore */
|
|
1456
|
+
...(ngDevMode ? [{ debugName: "dragStartDelay" }] : /* istanbul ignore next */ []));
|
|
1457
|
+
this.calendar = input(/* @ts-ignore */
|
|
1458
|
+
...(ngDevMode ? [undefined, { debugName: "calendar" }] : /* istanbul ignore next */ []));
|
|
1459
|
+
this.date = input.required(/* @ts-ignore */
|
|
1460
|
+
...(ngDevMode ? [{ debugName: "date" }] : /* istanbul ignore next */ []));
|
|
1461
|
+
this.appointments = input([], /* @ts-ignore */
|
|
1462
|
+
...(ngDevMode ? [{ debugName: "appointments" }] : /* istanbul ignore next */ []));
|
|
1463
|
+
this.firstDayOfWeek = input(/* @ts-ignore */
|
|
1464
|
+
...(ngDevMode ? [undefined, { debugName: "firstDayOfWeek" }] : /* istanbul ignore next */ []));
|
|
1465
|
+
this.selectedAppointmentId = input(null, /* @ts-ignore */
|
|
1466
|
+
...(ngDevMode ? [{ debugName: "selectedAppointmentId" }] : /* istanbul ignore next */ []));
|
|
1467
|
+
this.tooltipTemplate = input(/* @ts-ignore */
|
|
1468
|
+
...(ngDevMode ? [undefined, { debugName: "tooltipTemplate" }] : /* istanbul ignore next */ []));
|
|
1424
1469
|
// --- Constants ---
|
|
1425
1470
|
this.DAYS_IN_WEEK = 7;
|
|
1426
1471
|
this.MAX_VISIBLE_APPOINTMENTS_PER_DAY = 2;
|
|
1427
|
-
this.dragStartSlotId = signal(null,
|
|
1472
|
+
this.dragStartSlotId = signal(null, /* @ts-ignore */
|
|
1473
|
+
...(ngDevMode ? [{ debugName: "dragStartSlotId" }] : /* istanbul ignore next */ []));
|
|
1428
1474
|
// Internal outputs to be caught by parent AXSchedulerComponent
|
|
1429
1475
|
this.slotClickedInternal = output();
|
|
1430
1476
|
this.slotDblClickedInternal = output();
|
|
@@ -1452,7 +1498,8 @@ class AXSchedulerMonthViewComponent extends NXComponent {
|
|
|
1452
1498
|
this.monthStartDate = computed(() => {
|
|
1453
1499
|
const d = this.date();
|
|
1454
1500
|
return d ? d.startOf('month') : null;
|
|
1455
|
-
},
|
|
1501
|
+
}, /* @ts-ignore */
|
|
1502
|
+
...(ngDevMode ? [{ debugName: "monthStartDate" }] : /* istanbul ignore next */ []));
|
|
1456
1503
|
// Generate the list of weekday names based on the firstDayOfWeek
|
|
1457
1504
|
this.daysArray = computed(() => {
|
|
1458
1505
|
const currentDate = this.date();
|
|
@@ -1460,7 +1507,8 @@ class AXSchedulerMonthViewComponent extends NXComponent {
|
|
|
1460
1507
|
firstDayOfWeek: this.firstDayOfWeek(),
|
|
1461
1508
|
});
|
|
1462
1509
|
return Array.from({ length: 7 }, (_, index) => headerStartDate.add('day', index));
|
|
1463
|
-
},
|
|
1510
|
+
}, /* @ts-ignore */
|
|
1511
|
+
...(ngDevMode ? [{ debugName: "daysArray" }] : /* istanbul ignore next */ []));
|
|
1464
1512
|
// --- Calendar Grid Calculation ---
|
|
1465
1513
|
this.calendarDaysInfo = computed(() => {
|
|
1466
1514
|
const monthStart = this.monthStartDate();
|
|
@@ -1515,7 +1563,8 @@ class AXSchedulerMonthViewComponent extends NXComponent {
|
|
|
1515
1563
|
currentDay = currentDay.add('day', 1);
|
|
1516
1564
|
}
|
|
1517
1565
|
return { days: days, weeksNeeded: actualWeeksToShow };
|
|
1518
|
-
},
|
|
1566
|
+
}, /* @ts-ignore */
|
|
1567
|
+
...(ngDevMode ? [{ debugName: "calendarDaysInfo" }] : /* istanbul ignore next */ []));
|
|
1519
1568
|
// Calculate spanning appointments with their grid positions
|
|
1520
1569
|
this.spanningAppointments = computed(() => {
|
|
1521
1570
|
const { days } = this.calendarDaysInfo();
|
|
@@ -1613,12 +1662,14 @@ class AXSchedulerMonthViewComponent extends NXComponent {
|
|
|
1613
1662
|
});
|
|
1614
1663
|
}
|
|
1615
1664
|
return spanningResult;
|
|
1616
|
-
},
|
|
1665
|
+
}, /* @ts-ignore */
|
|
1666
|
+
...(ngDevMode ? [{ debugName: "spanningAppointments" }] : /* istanbul ignore next */ []));
|
|
1617
1667
|
// Get the set of multi-day appointment IDs for exclusion from per-day rendering
|
|
1618
1668
|
this.multiDayAppointmentIds = computed(() => {
|
|
1619
1669
|
const spanning = this.spanningAppointments();
|
|
1620
1670
|
return new Set(spanning.map((s) => s.appointment.id));
|
|
1621
|
-
},
|
|
1671
|
+
}, /* @ts-ignore */
|
|
1672
|
+
...(ngDevMode ? [{ debugName: "multiDayAppointmentIds" }] : /* istanbul ignore next */ []));
|
|
1622
1673
|
// --- Day Cell Layout Calculation ---
|
|
1623
1674
|
this.dayCellLayouts = computed(() => {
|
|
1624
1675
|
const { days: initialDaysInfo } = this.calendarDaysInfo();
|
|
@@ -1669,7 +1720,8 @@ class AXSchedulerMonthViewComponent extends NXComponent {
|
|
|
1669
1720
|
gridIndex,
|
|
1670
1721
|
};
|
|
1671
1722
|
});
|
|
1672
|
-
},
|
|
1723
|
+
}, /* @ts-ignore */
|
|
1724
|
+
...(ngDevMode ? [{ debugName: "dayCellLayouts" }] : /* istanbul ignore next */ []));
|
|
1673
1725
|
// --- Dynamic Grid Rows ---
|
|
1674
1726
|
this.gridTemplateRowsStyle = computed(() => {
|
|
1675
1727
|
const { weeksNeeded } = this.calendarDaysInfo();
|
|
@@ -1677,7 +1729,8 @@ class AXSchedulerMonthViewComponent extends NXComponent {
|
|
|
1677
1729
|
return `repeat(6, minmax(0, 1fr))`; // Fallback, ensures grid is at least somewhat sensible
|
|
1678
1730
|
}
|
|
1679
1731
|
return `repeat(${weeksNeeded}, minmax(0, 1fr))`; // Use 1fr for equal distribution
|
|
1680
|
-
},
|
|
1732
|
+
}, /* @ts-ignore */
|
|
1733
|
+
...(ngDevMode ? [{ debugName: "gridTemplateRowsStyle" }] : /* istanbul ignore next */ []));
|
|
1681
1734
|
// Group spanning appointments by their week row for proper rendering
|
|
1682
1735
|
this.spanningAppointmentsByWeekRow = computed(() => {
|
|
1683
1736
|
const spanning = this.spanningAppointments();
|
|
@@ -1719,12 +1772,14 @@ class AXSchedulerMonthViewComponent extends NXComponent {
|
|
|
1719
1772
|
}
|
|
1720
1773
|
}
|
|
1721
1774
|
return result;
|
|
1722
|
-
},
|
|
1775
|
+
}, /* @ts-ignore */
|
|
1776
|
+
...(ngDevMode ? [{ debugName: "spanningAppointmentsByWeekRow" }] : /* istanbul ignore next */ []));
|
|
1723
1777
|
// Get the number of week rows in the current month view
|
|
1724
1778
|
this.weekRowsArray = computed(() => {
|
|
1725
1779
|
const { weeksNeeded } = this.calendarDaysInfo();
|
|
1726
1780
|
return Array.from({ length: weeksNeeded }, (_, i) => i);
|
|
1727
|
-
},
|
|
1781
|
+
}, /* @ts-ignore */
|
|
1782
|
+
...(ngDevMode ? [{ debugName: "weekRowsArray" }] : /* istanbul ignore next */ []));
|
|
1728
1783
|
// Calculate the maximum row index (number of stacked spanning appointments - 1) for each week row
|
|
1729
1784
|
this.maxSpanningRowsPerWeek = computed(() => {
|
|
1730
1785
|
const byWeekRow = this.spanningAppointmentsByWeekRow();
|
|
@@ -1739,7 +1794,8 @@ class AXSchedulerMonthViewComponent extends NXComponent {
|
|
|
1739
1794
|
result.set(weekRowIndex, maxRowIndex + 1); // +1 to get count from 0-based index
|
|
1740
1795
|
}
|
|
1741
1796
|
return result;
|
|
1742
|
-
},
|
|
1797
|
+
}, /* @ts-ignore */
|
|
1798
|
+
...(ngDevMode ? [{ debugName: "maxSpanningRowsPerWeek" }] : /* istanbul ignore next */ []));
|
|
1743
1799
|
}
|
|
1744
1800
|
isActive(appointmentId) {
|
|
1745
1801
|
return this.selectedAppointmentId() === appointmentId;
|
|
@@ -1822,12 +1878,12 @@ class AXSchedulerMonthViewComponent extends NXComponent {
|
|
|
1822
1878
|
const weekRowIndex = Math.floor(gridIndex / this.DAYS_IN_WEEK);
|
|
1823
1879
|
return this.maxSpanningRowsPerWeek().get(weekRowIndex) ?? 0;
|
|
1824
1880
|
}
|
|
1825
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1826
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXSchedulerMonthViewComponent, isStandalone: true, selector: "ax-scheduler-month-view", inputs: { readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, draggable: { classPropertyName: "draggable", publicName: "draggable", isSignal: true, isRequired: false, transformFunction: null }, hasActions: { classPropertyName: "hasActions", publicName: "hasActions", isSignal: true, isRequired: false, transformFunction: null }, dragStartDelay: { classPropertyName: "dragStartDelay", publicName: "dragStartDelay", isSignal: true, isRequired: false, transformFunction: null }, calendar: { classPropertyName: "calendar", publicName: "calendar", isSignal: true, isRequired: false, transformFunction: null }, date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: true, transformFunction: null }, appointments: { classPropertyName: "appointments", publicName: "appointments", isSignal: true, isRequired: false, transformFunction: null }, firstDayOfWeek: { classPropertyName: "firstDayOfWeek", publicName: "firstDayOfWeek", isSignal: true, isRequired: false, transformFunction: null }, selectedAppointmentId: { classPropertyName: "selectedAppointmentId", publicName: "selectedAppointmentId", isSignal: true, isRequired: false, transformFunction: null }, tooltipTemplate: { classPropertyName: "tooltipTemplate", publicName: "tooltipTemplate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { slotClickedInternal: "slotClickedInternal", slotDblClickedInternal: "slotDblClickedInternal", slotRightClickedInternal: "slotRightClickedInternal", appointmentClickedInternal: "appointmentClickedInternal", appointmentDblClickedInternal: "appointmentDblClickedInternal", appointmentRightClickedInternal: "appointmentRightClickedInternal", onActionClickInternal: "onActionClickInternal", onAppointmentDropInternal: "onAppointmentDropInternal" }, host: { properties: { "class.ax-state-readonly": "readonly()" } }, providers: [{ provide: AXComponent, useExisting: AXSchedulerMonthViewComponent }], usesInheritance: true, ngImport: i0, template: "<div class=\"ax-scheduler-month-container\">\n <!-- Weekday Header -->\n <div class=\"ax-scheduler-month-weekdays\">\n @for (day of daysArray(); track day.date.getTime()) {\n <div class=\"ax-scheduler-month-weekday\">\n {{ day | format: 'date' : { format: 'dddd', calendar: calendar() } | async }}\n </div>\n }\n </div>\n\n <!-- Calendar Grid Wrapper -->\n <div class=\"ax-scheduler-month-grid-wrapper\">\n <!-- Spanning Appointments Layer -->\n <div class=\"ax-scheduler-month-spanning-layer\" [style.gridTemplateRows]=\"gridTemplateRowsStyle()\">\n @for (weekRowIndex of weekRowsArray(); track weekRowIndex) {\n <div class=\"ax-scheduler-month-spanning-week-row\">\n @for (\n spanning of getSpanningAppointmentsForWeekRow(weekRowIndex);\n track spanning.appointment.id + spanning.gridStartIndex\n ) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragData]=\"spanning.appointment\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || spanning.appointment.readonly || readonly()\"\n (pointerdown)=\"getSlotId($event)\"\n (click)=\"handleAppointmentEvent($event, spanning.appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, spanning.appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, spanning.appointment)\"\n [title]=\"\n tooltipTemplate()\n ? ''\n : spanning.appointment.title +\n ' (' +\n (spanning.appointment.startDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async) +\n ' - ' +\n (spanning.appointment.endDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async) +\n ')'\n \"\n class=\"ax-scheduler-month-spanning-appointment\"\n [class.ax-spanning-start-clipped]=\"spanning.isStartClipped\"\n [class.ax-spanning-end-clipped]=\"spanning.isEndClipped\"\n [class.ax-state-active]=\"isActive(spanning.appointment.id)\"\n [class]=\"\n spanning.appointment.cssClass ??\n 'ax-scheduler-' + (spanning.appointment.priority ?? 'primary') + '-priority'\n \"\n [style.grid-column]=\"(spanning.gridStartIndex % 7) + 1 + ' / span ' + spanning.spanCount\"\n [style.grid-row]=\"spanning.rowIndex + 1\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltip]=\"tooltipTemplate()\"\n [axTooltipContext]=\"spanning.appointment\"\n >\n <span class=\"ax-spanning-appointment-title\">\n <span class=\"ax-scheduler-truncate\">{{ spanning.appointment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, spanning.appointment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n >\n </ax-icon>\n }\n </span>\n </div>\n }\n </div>\n }\n </div>\n\n <!-- Calendar Grid -->\n <div class=\"ax-scheduler-month-grid\" [style.gridTemplateRows]=\"gridTemplateRowsStyle()\">\n @for (dayCell of dayCellLayouts(); track dayCell.date.date.getTime()) {\n <div\n axDropZone\n #zone=\"axDropZone\"\n (onElementDrop)=\"handleDrop($event, dayCell.date)\"\n [class.ax-scheduler-slot-hovered]=\"zone.isHovered()\"\n (click)=\"handleSlotEvent($event, dayCell.date)\"\n (dblclick)=\"handleSlotEvent($event, dayCell.date)\"\n (contextmenu)=\"handleSlotEvent($event, dayCell.date)\"\n class=\"ax-scheduler-month-day-cell {{\n dayCell.isHoliday ? (dayCell.holidayCssClass ?? 'ax-state-holiday') : ''\n }}\"\n [style.--ax-scheduler-holiday-color]=\"dayCell.holidayColor ?? null\"\n [class.ax-state-today]=\"dayCell.isToday\"\n [class.ax-other-month]=\"!dayCell.isCurrentMonth\"\n [attr.data-slot-id]=\"dayCell.date.format('YYYYMMDD')\"\n >\n <div class=\"ax-scheduler-month-day-header\">\n <span class=\"ax-scheduler-month-day-number ax-scheduler-truncate\" [axTooltip]=\"dayCell.holidayDescription ?? ''\">\n {{ dayCell.date.dayOfMonth }}\n\n @if (dayCell.holidayTitle) {\n ( {{ dayCell.holidayTitle }} )\n }\n </span>\n </div>\n <div\n class=\"ax-scheduler-month-day-appointments\"\n [style.--spanning-rows-count]=\"getSpanningRowsCountForDayCell(dayCell.gridIndex)\"\n >\n <!-- Visible Single-day Appointment Segments -->\n @for (segment of dayCell.visibleAppointments; track segment.id + segment.originalStartDate) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragData]=\"segment\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || segment.readonly || readonly()\"\n (pointerdown)=\"getSlotId($event)\"\n (click)=\"handleAppointmentEvent($event, segment)\"\n (dblclick)=\"handleAppointmentEvent($event, segment)\"\n (contextmenu)=\"handleAppointmentEvent($event, segment)\"\n [title]=\"\n tooltipTemplate()\n ? ''\n : segment.title +\n (segment.allDay\n ? ''\n : ' (' +\n (segment.originalStartDate | format: 'time' : { calendar: calendar() } | async) +\n ' - ' +\n (segment.originalEndDate | format: 'time' : { calendar: calendar() } | async) +\n ')')\n \"\n [class.all-day-segment]=\"segment.allDay\"\n class=\"ax-scheduler-month-appointment-chip\"\n [class.ax-state-active]=\"isActive(segment.id)\"\n [class]=\"segment.cssClass ?? 'ax-scheduler-' + (segment.priority ?? 'primary') + '-priority'\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltip]=\"tooltipTemplate()\"\n [axTooltipContext]=\"segment\"\n >\n <span class=\"ax-appointment-chip-title\">\n <span class=\"ax-scheduler-truncate\">{{ segment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, segment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n >\n </ax-icon>\n }\n </span>\n @if (!segment.allDay) {\n <span>\n {{ segment.originalStartDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}\n -\n {{ segment.originalEndDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}\n </span>\n }\n </div>\n }\n <!-- Overflow Badge and Popover -->\n @if (dayCell.overflowCount > 0) {\n <div #moreAppointments class=\"ax-scheduler-month-overflow-badge\" (click)=\"$event.stopPropagation()\">\n <!-- Stop propagation to prevent slot click -->\n +{{\n '@acorex:common.general.more-items' | translate: { params: { number: dayCell.overflowCount } } | async\n }}\n </div>\n <ax-popover [target]=\"moreAppointments\" placement=\"bottom-start\" trigger=\"click\">\n <div\n axDropZone\n [class.ax-state-readonly]=\"readonly()\"\n class=\"ax-scheduler-popover ax-scheduler-month-popover-appointment\"\n >\n @for (segment of dayCell.hiddenAppointments; track segment.id + segment.originalStartDate) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragData]=\"segment\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || segment.readonly || readonly()\"\n (click)=\"handleAppointmentEvent($event, segment); $event.stopPropagation()\"\n (dblclick)=\"handleAppointmentEvent($event, segment); $event.stopPropagation()\"\n (contextmenu)=\"handleAppointmentEvent($event, segment); $event.stopPropagation()\"\n [title]=\"\n tooltipTemplate()\n ? ''\n : segment.title +\n (segment.allDay\n ? ''\n : ' (' +\n (segment.originalStartDate | format: 'time' : { calendar: calendar() } | async) +\n ' - ' +\n (segment.originalEndDate | format: 'time' : { calendar: calendar() } | async) +\n ')')\n \"\n class=\"ax-scheduler-popover-appointment\"\n [class.all-day-segment]=\"segment.allDay\"\n [class.ax-state-active]=\"isActive(segment.id)\"\n [class]=\"segment.cssClass ?? 'ax-scheduler-' + (segment.priority ?? 'primary') + '-priority'\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltip]=\"tooltipTemplate()\"\n [axTooltipContext]=\"segment\"\n >\n <span class=\"ax-appointment-chip-title\">\n <span class=\"ax-scheduler-truncate\">{{ segment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, segment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n >\n </ax-icon>\n }\n </span>\n @if (!segment.allDay) {\n <span>\n {{\n segment.originalStartDate\n | format: 'time' : { format: 'HH:mm', calendar: calendar() }\n | async\n }}\n -\n {{\n segment.originalEndDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async\n }}\n </span>\n }\n </div>\n }\n </div>\n </ax-popover>\n }\n </div>\n </div>\n }\n </div>\n </div>\n</div>\n", styles: ["@layer properties;@layer components{ax-scheduler-month-view{--ax-scheduler-month-spanning-row-height: 1.25rem;--ax-scheduler-month-spanning-row-gap: .25rem;display:block;height:100%;min-width:var(--ax-comp-scheduler-width);background-color:inherit}ax-scheduler-month-view .ax-scheduler-month-container{display:flex;height:100%;flex-direction:column;background-color:inherit}ax-scheduler-month-view .ax-scheduler-month-weekdays{position:sticky;top:calc(var(--spacing, .25rem) * 0);z-index:10;display:grid;width:100%;flex-shrink:0;grid-template-columns:repeat(7,minmax(0,1fr));border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:var(--ax-comp-scheduler-all-day-bg,inherit);padding-inline:calc(var(--spacing, .25rem) * 0);padding-block:calc(var(--spacing, .25rem) * 2);text-align:center}ax-scheduler-month-view .ax-scheduler-month-weekdays .ax-scheduler-month-weekday{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-month-view .ax-scheduler-month-grid-wrapper{position:relative;display:grid;flex-grow:1}ax-scheduler-month-view .ax-scheduler-month-spanning-layer{pointer-events:none;position:absolute;inset:calc(var(--spacing, .25rem) * 0);z-index:5;display:grid;width:100%;grid-auto-rows:minmax(5rem,auto);grid-template-columns:1fr;border-inline-start:1px solid transparent}ax-scheduler-month-view .ax-scheduler-month-spanning-layer .ax-scheduler-month-spanning-week-row{position:relative;display:grid;align-content:flex-start;padding-top:calc(var(--spacing, .25rem) * 6);row-gap:var(--ax-scheduler-month-spanning-row-gap);grid-auto-rows:var(--ax-scheduler-month-spanning-row-height);grid-template-columns:repeat(7,minmax(0,1fr))}ax-scheduler-month-view .ax-scheduler-month-spanning-layer .ax-scheduler-month-spanning-week-row .ax-scheduler-month-spanning-appointment{z-index:6;cursor:pointer;overflow:hidden;text-overflow:ellipsis;border-radius:var(--radius-sm, .25rem);padding-inline:calc(var(--spacing, .25rem) * 1);padding-block:calc(var(--spacing, .25rem) * .5);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));white-space:nowrap;margin-inline:.125rem;pointer-events:auto}ax-scheduler-month-view .ax-scheduler-month-spanning-layer .ax-scheduler-month-spanning-week-row .ax-scheduler-month-spanning-appointment .ax-spanning-appointment-title{display:flex;height:100%;align-items:center;justify-content:space-between;padding-inline:calc(var(--spacing, .25rem) * 2)}ax-scheduler-month-view .ax-scheduler-month-spanning-layer .ax-scheduler-month-spanning-week-row .ax-scheduler-month-spanning-appointment .ax-spanning-appointment-title .ax-scheduler-truncate{min-width:calc(var(--spacing, .25rem) * 0);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ax-scheduler-month-view .ax-scheduler-month-spanning-layer .ax-scheduler-month-spanning-week-row .ax-scheduler-month-spanning-appointment .ax-spanning-appointment-title .ax-scheduler-action-icon{margin-inline-start:calc(var(--spacing, .25rem) * 1);width:auto;flex-shrink:0;cursor:pointer}ax-scheduler-month-view .ax-scheduler-month-spanning-layer .ax-scheduler-month-spanning-week-row .ax-scheduler-month-spanning-appointment.ax-spanning-start-clipped{position:relative;border-start-start-radius:0;border-end-start-radius:0;margin-inline-start:0}ax-scheduler-month-view .ax-scheduler-month-spanning-layer .ax-scheduler-month-spanning-week-row .ax-scheduler-month-spanning-appointment.ax-spanning-start-clipped:before{content:\"\\2190 \";position:absolute;top:calc(var(--spacing, .25rem) * .5);font-size:.65rem;opacity:70%;inset-inline-start:0}ax-scheduler-month-view .ax-scheduler-month-spanning-layer .ax-scheduler-month-spanning-week-row .ax-scheduler-month-spanning-appointment.ax-spanning-end-clipped{position:relative;border-start-end-radius:0;border-end-end-radius:0;margin-inline-end:0}ax-scheduler-month-view .ax-scheduler-month-spanning-layer .ax-scheduler-month-spanning-week-row .ax-scheduler-month-spanning-appointment.ax-spanning-end-clipped:after{content:\" \\2192\";position:absolute;top:calc(var(--spacing, .25rem) * .5);font-size:.65rem;opacity:70%;inset-inline-end:0}ax-scheduler-month-view .ax-scheduler-month-grid{position:relative;z-index:1;display:grid;width:100%;grid-auto-rows:minmax(5rem,auto);grid-template-columns:repeat(7,minmax(0,1fr));border-inline-start-style:var(--tw-border-style);border-inline-start-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell{position:relative;overflow:hidden;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));padding:calc(var(--spacing, .25rem) * 1)}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell.ax-other-month{background-color:rgba(var(--ax-sys-color-border-lightest-surface))}@supports (color: color-mix(in lab,red,red)){ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell.ax-other-month{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-border-lightest-surface)) 20%,transparent)}}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell.ax-other-month .ax-scheduler-month-day-number{color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell.ax-other-month .ax-scheduler-month-day-number{color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 50%,transparent)}}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell.ax-state-today{background-color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell.ax-state-today{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 5%,transparent)}}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell.ax-state-today .ax-scheduler-month-day-number{--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700);color:rgba(var(--ax-sys-color-primary-surface))}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell.ax-state-today.ax-other-month{background-color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell.ax-state-today.ax-other-month{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 2.5%,transparent)}}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell.ax-state-today.ax-other-month .ax-scheduler-month-day-number{color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell.ax-state-today.ax-other-month .ax-scheduler-month-day-number{color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 50%,transparent)}}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell.ax-state-holiday .ax-scheduler-month-day-number{color:var(--ax-scheduler-holiday-color, rgba(var(--ax-sys-color-danger-surface)));--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700)}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell.ax-state-holiday.ax-other-month .ax-scheduler-month-day-number{color:var(--ax-scheduler-holiday-color, rgba(var(--ax-sys-color-danger-surface), .5))}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell .ax-scheduler-month-day-header{margin-bottom:calc(var(--spacing, .25rem) * 1);text-align:center}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell .ax-scheduler-month-day-header .ax-scheduler-month-day-number{display:inline-block;max-width:100%;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)))}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell .ax-scheduler-month-day-appointments{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * .5);overflow:hidden;padding-top:max(0rem,calc(var(--spanning-rows-count, 0) * (var(--ax-scheduler-month-spanning-row-height) + var(--ax-scheduler-month-spanning-row-gap)) - var(--ax-scheduler-month-spanning-row-gap)))}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell .ax-scheduler-month-day-appointments .ax-scheduler-month-appointment-chip{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:var(--radius-sm, .25rem);padding-inline:calc(var(--spacing, .25rem) * 1);padding-block:calc(var(--spacing, .25rem) * .5);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell .ax-scheduler-month-day-appointments .ax-scheduler-month-overflow-badge{margin-top:calc(var(--spacing, .25rem) * .5);cursor:pointer;padding-inline:calc(var(--spacing, .25rem) * 0);padding-block:calc(var(--spacing, .25rem) * .5);text-align:start;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell .ax-scheduler-month-day-appointments .ax-scheduler-month-overflow-badge:hover{text-decoration-line:underline}ax-scheduler-month-view:not(.ax-state-readonly) .ax-scheduler-month-appointment-chip,ax-scheduler-month-view:not(.ax-state-readonly) .ax-scheduler-month-spanning-appointment{cursor:pointer}ax-scheduler-month-view:not(.ax-state-readonly) .ax-scheduler-month-day-cell{cursor:pointer;transition-property:background-color;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));transition-duration:var(--ax-sys-transition-duration);transition-timing-function:var(--ax-sys-transition-timing-function)}ax-scheduler-month-view:not(.ax-state-readonly) .ax-scheduler-month-day-cell:hover{background-color:rgba(var(--ax-comp-scheduler-slot-hover-bg,var(--ax-sys-color-primary-surface),.1))}ax-scheduler-month-view:not(.ax-state-readonly) .ax-scheduler-month-day-cell:hover.ax-state-holiday{background-color:rgba(var(--ax-sys-color-danger-surface),.1)}ax-scheduler-month-view .ax-appointment-chip-title{display:flex;justify-content:space-between}ax-scheduler-month-view .ax-appointment-chip-title .ax-scheduler-action-icon{width:auto;cursor:pointer}ax-scheduler.ax-rtl ax-scheduler-month-view .ax-scheduler-month-spanning-appointment.ax-spanning-start-clipped:before{content:\"\\2192 \"}ax-scheduler.ax-rtl ax-scheduler-month-view .ax-scheduler-month-spanning-appointment.ax-spanning-end-clipped:after{content:\" \\2190\"}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: AXDragDirective, selector: "[axDrag]", inputs: ["axDrag", "dragData", "dragDisabled", "dragTransition", "dragElementClone", "dropZoneGroup", "dragStartDelay", "dragResetOnDblClick", "dragLockAxis", "dragClonedTemplate", "dragCursor", "dragBoundary", "dragTransitionDuration"], outputs: ["dragPositionChanged"] }, { kind: "component", type: AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disablePanelClass", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "closeOnScroll", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "directive", type: AXTooltipDirective, selector: "[axTooltip]", inputs: ["axTooltipDisabled", "axTooltip", "axTooltipContext", "axTooltipPlacement", "axTooltipOffsetX", "axTooltipOffsetY", "axTooltipOpenAfter", "axTooltipCloseAfter"] }, { kind: "directive", type: AXDropZoneDirective, selector: "[axDropZone]", inputs: ["dropZoneGroup"], outputs: ["onElementDrop", "onElementHover"], exportAs: ["axDropZone"] }, { kind: "component", type: AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXFormatPipe, name: "format" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
1881
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXSchedulerMonthViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
1882
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXSchedulerMonthViewComponent, isStandalone: true, selector: "ax-scheduler-month-view", inputs: { readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, draggable: { classPropertyName: "draggable", publicName: "draggable", isSignal: true, isRequired: false, transformFunction: null }, hasActions: { classPropertyName: "hasActions", publicName: "hasActions", isSignal: true, isRequired: false, transformFunction: null }, dragStartDelay: { classPropertyName: "dragStartDelay", publicName: "dragStartDelay", isSignal: true, isRequired: false, transformFunction: null }, calendar: { classPropertyName: "calendar", publicName: "calendar", isSignal: true, isRequired: false, transformFunction: null }, date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: true, transformFunction: null }, appointments: { classPropertyName: "appointments", publicName: "appointments", isSignal: true, isRequired: false, transformFunction: null }, firstDayOfWeek: { classPropertyName: "firstDayOfWeek", publicName: "firstDayOfWeek", isSignal: true, isRequired: false, transformFunction: null }, selectedAppointmentId: { classPropertyName: "selectedAppointmentId", publicName: "selectedAppointmentId", isSignal: true, isRequired: false, transformFunction: null }, tooltipTemplate: { classPropertyName: "tooltipTemplate", publicName: "tooltipTemplate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { slotClickedInternal: "slotClickedInternal", slotDblClickedInternal: "slotDblClickedInternal", slotRightClickedInternal: "slotRightClickedInternal", appointmentClickedInternal: "appointmentClickedInternal", appointmentDblClickedInternal: "appointmentDblClickedInternal", appointmentRightClickedInternal: "appointmentRightClickedInternal", onActionClickInternal: "onActionClickInternal", onAppointmentDropInternal: "onAppointmentDropInternal" }, host: { properties: { "class.ax-state-readonly": "readonly()" } }, providers: [{ provide: AXComponent, useExisting: AXSchedulerMonthViewComponent }], usesInheritance: true, ngImport: i0, template: "<div class=\"ax-scheduler-month-container\">\n <!-- Weekday Header -->\n <div class=\"ax-scheduler-month-weekdays\">\n @for (day of daysArray(); track day.date.getTime()) {\n <div class=\"ax-scheduler-month-weekday\">\n {{ day | format: 'date' : { format: 'dddd', calendar: calendar() } | async }}\n </div>\n }\n </div>\n\n <!-- Calendar Grid Wrapper -->\n <div class=\"ax-scheduler-month-grid-wrapper\">\n <!-- Spanning Appointments Layer -->\n <div class=\"ax-scheduler-month-spanning-layer\" [style.gridTemplateRows]=\"gridTemplateRowsStyle()\">\n @for (weekRowIndex of weekRowsArray(); track weekRowIndex) {\n <div class=\"ax-scheduler-month-spanning-week-row\">\n @for (\n spanning of getSpanningAppointmentsForWeekRow(weekRowIndex);\n track spanning.appointment.id + spanning.gridStartIndex\n ) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragData]=\"spanning.appointment\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || spanning.appointment.readonly || readonly()\"\n (pointerdown)=\"getSlotId($event)\"\n (click)=\"handleAppointmentEvent($event, spanning.appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, spanning.appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, spanning.appointment)\"\n [title]=\"\n tooltipTemplate()\n ? ''\n : spanning.appointment.title +\n ' (' +\n (spanning.appointment.startDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async) +\n ' - ' +\n (spanning.appointment.endDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async) +\n ')'\n \"\n class=\"ax-scheduler-month-spanning-appointment\"\n [class.ax-spanning-start-clipped]=\"spanning.isStartClipped\"\n [class.ax-spanning-end-clipped]=\"spanning.isEndClipped\"\n [class.ax-state-active]=\"isActive(spanning.appointment.id)\"\n [class]=\"\n spanning.appointment.cssClass ??\n 'ax-scheduler-' + (spanning.appointment.priority ?? 'primary') + '-priority'\n \"\n [style.grid-column]=\"(spanning.gridStartIndex % 7) + 1 + ' / span ' + spanning.spanCount\"\n [style.grid-row]=\"spanning.rowIndex + 1\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltip]=\"tooltipTemplate()\"\n [axTooltipContext]=\"spanning.appointment\"\n >\n <span class=\"ax-spanning-appointment-title\">\n <span class=\"ax-scheduler-truncate\">{{ spanning.appointment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, spanning.appointment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n >\n </ax-icon>\n }\n </span>\n </div>\n }\n </div>\n }\n </div>\n\n <!-- Calendar Grid -->\n <div class=\"ax-scheduler-month-grid\" [style.gridTemplateRows]=\"gridTemplateRowsStyle()\">\n @for (dayCell of dayCellLayouts(); track dayCell.date.date.getTime()) {\n <div\n axDropZone\n #zone=\"axDropZone\"\n (onElementDrop)=\"handleDrop($event, dayCell.date)\"\n [class.ax-scheduler-slot-hovered]=\"zone.isHovered()\"\n (click)=\"handleSlotEvent($event, dayCell.date)\"\n (dblclick)=\"handleSlotEvent($event, dayCell.date)\"\n (contextmenu)=\"handleSlotEvent($event, dayCell.date)\"\n class=\"ax-scheduler-month-day-cell {{\n dayCell.isHoliday ? (dayCell.holidayCssClass ?? 'ax-state-holiday') : ''\n }}\"\n [style.--ax-scheduler-holiday-color]=\"dayCell.holidayColor ?? null\"\n [class.ax-state-today]=\"dayCell.isToday\"\n [class.ax-other-month]=\"!dayCell.isCurrentMonth\"\n [attr.data-slot-id]=\"dayCell.date.format('YYYYMMDD')\"\n >\n <div class=\"ax-scheduler-month-day-header\">\n <span class=\"ax-scheduler-month-day-number ax-scheduler-truncate\" [axTooltip]=\"dayCell.holidayDescription ?? ''\">\n {{ dayCell.date.dayOfMonth }}\n\n @if (dayCell.holidayTitle) {\n ( {{ dayCell.holidayTitle }} )\n }\n </span>\n </div>\n <div\n class=\"ax-scheduler-month-day-appointments\"\n [style.--spanning-rows-count]=\"getSpanningRowsCountForDayCell(dayCell.gridIndex)\"\n >\n <!-- Visible Single-day Appointment Segments -->\n @for (segment of dayCell.visibleAppointments; track segment.id + segment.originalStartDate) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragData]=\"segment\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || segment.readonly || readonly()\"\n (pointerdown)=\"getSlotId($event)\"\n (click)=\"handleAppointmentEvent($event, segment)\"\n (dblclick)=\"handleAppointmentEvent($event, segment)\"\n (contextmenu)=\"handleAppointmentEvent($event, segment)\"\n [title]=\"\n tooltipTemplate()\n ? ''\n : segment.title +\n (segment.allDay\n ? ''\n : ' (' +\n (segment.originalStartDate | format: 'time' : { calendar: calendar() } | async) +\n ' - ' +\n (segment.originalEndDate | format: 'time' : { calendar: calendar() } | async) +\n ')')\n \"\n [class.all-day-segment]=\"segment.allDay\"\n class=\"ax-scheduler-month-appointment-chip\"\n [class.ax-state-active]=\"isActive(segment.id)\"\n [class]=\"segment.cssClass ?? 'ax-scheduler-' + (segment.priority ?? 'primary') + '-priority'\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltip]=\"tooltipTemplate()\"\n [axTooltipContext]=\"segment\"\n >\n <span class=\"ax-appointment-chip-title\">\n <span class=\"ax-scheduler-truncate\">{{ segment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, segment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n >\n </ax-icon>\n }\n </span>\n @if (!segment.allDay) {\n <span>\n {{ segment.originalStartDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}\n -\n {{ segment.originalEndDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}\n </span>\n }\n </div>\n }\n <!-- Overflow Badge and Popover -->\n @if (dayCell.overflowCount > 0) {\n <div #moreAppointments class=\"ax-scheduler-month-overflow-badge\" (click)=\"$event.stopPropagation()\">\n <!-- Stop propagation to prevent slot click -->\n +{{\n '@acorex:common.general.more-items' | translate: { params: { number: dayCell.overflowCount } } | async\n }}\n </div>\n <ax-popover [target]=\"moreAppointments\" placement=\"bottom-start\" trigger=\"click\">\n <div\n axDropZone\n [class.ax-state-readonly]=\"readonly()\"\n class=\"ax-scheduler-popover ax-scheduler-month-popover-appointment\"\n >\n @for (segment of dayCell.hiddenAppointments; track segment.id + segment.originalStartDate) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragData]=\"segment\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || segment.readonly || readonly()\"\n (click)=\"handleAppointmentEvent($event, segment); $event.stopPropagation()\"\n (dblclick)=\"handleAppointmentEvent($event, segment); $event.stopPropagation()\"\n (contextmenu)=\"handleAppointmentEvent($event, segment); $event.stopPropagation()\"\n [title]=\"\n tooltipTemplate()\n ? ''\n : segment.title +\n (segment.allDay\n ? ''\n : ' (' +\n (segment.originalStartDate | format: 'time' : { calendar: calendar() } | async) +\n ' - ' +\n (segment.originalEndDate | format: 'time' : { calendar: calendar() } | async) +\n ')')\n \"\n class=\"ax-scheduler-popover-appointment\"\n [class.all-day-segment]=\"segment.allDay\"\n [class.ax-state-active]=\"isActive(segment.id)\"\n [class]=\"segment.cssClass ?? 'ax-scheduler-' + (segment.priority ?? 'primary') + '-priority'\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltip]=\"tooltipTemplate()\"\n [axTooltipContext]=\"segment\"\n >\n <span class=\"ax-appointment-chip-title\">\n <span class=\"ax-scheduler-truncate\">{{ segment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, segment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n >\n </ax-icon>\n }\n </span>\n @if (!segment.allDay) {\n <span>\n {{\n segment.originalStartDate\n | format: 'time' : { format: 'HH:mm', calendar: calendar() }\n | async\n }}\n -\n {{\n segment.originalEndDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async\n }}\n </span>\n }\n </div>\n }\n </div>\n </ax-popover>\n }\n </div>\n </div>\n }\n </div>\n </div>\n</div>\n", styles: ["@layer properties;@layer components{ax-scheduler-month-view{--ax-scheduler-month-spanning-row-height: 1.25rem;--ax-scheduler-month-spanning-row-gap: .25rem;display:block;height:100%;min-width:var(--ax-comp-scheduler-width);background-color:inherit}ax-scheduler-month-view .ax-scheduler-month-container{display:flex;height:100%;flex-direction:column;background-color:inherit}ax-scheduler-month-view .ax-scheduler-month-weekdays{position:sticky;top:calc(var(--spacing, .25rem) * 0);z-index:10;display:grid;width:100%;flex-shrink:0;grid-template-columns:repeat(7,minmax(0,1fr));border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:var(--ax-comp-scheduler-all-day-bg,inherit);padding-inline:calc(var(--spacing, .25rem) * 0);padding-block:calc(var(--spacing, .25rem) * 2);text-align:center}ax-scheduler-month-view .ax-scheduler-month-weekdays .ax-scheduler-month-weekday{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-month-view .ax-scheduler-month-grid-wrapper{position:relative;display:grid;flex-grow:1}ax-scheduler-month-view .ax-scheduler-month-spanning-layer{pointer-events:none;position:absolute;inset:calc(var(--spacing, .25rem) * 0);z-index:5;display:grid;width:100%;grid-auto-rows:minmax(5rem,auto);grid-template-columns:1fr;border-inline-start:1px solid transparent}ax-scheduler-month-view .ax-scheduler-month-spanning-layer .ax-scheduler-month-spanning-week-row{position:relative;display:grid;align-content:flex-start;padding-top:calc(var(--spacing, .25rem) * 6);row-gap:var(--ax-scheduler-month-spanning-row-gap);grid-auto-rows:var(--ax-scheduler-month-spanning-row-height);grid-template-columns:repeat(7,minmax(0,1fr))}ax-scheduler-month-view .ax-scheduler-month-spanning-layer .ax-scheduler-month-spanning-week-row .ax-scheduler-month-spanning-appointment{z-index:6;cursor:pointer;overflow:hidden;text-overflow:ellipsis;border-radius:var(--radius-sm, .25rem);padding-inline:calc(var(--spacing, .25rem) * 1);padding-block:calc(var(--spacing, .25rem) * .5);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));white-space:nowrap;margin-inline:.125rem;pointer-events:auto}ax-scheduler-month-view .ax-scheduler-month-spanning-layer .ax-scheduler-month-spanning-week-row .ax-scheduler-month-spanning-appointment .ax-spanning-appointment-title{display:flex;height:100%;align-items:center;justify-content:space-between;padding-inline:calc(var(--spacing, .25rem) * 2)}ax-scheduler-month-view .ax-scheduler-month-spanning-layer .ax-scheduler-month-spanning-week-row .ax-scheduler-month-spanning-appointment .ax-spanning-appointment-title .ax-scheduler-truncate{min-width:calc(var(--spacing, .25rem) * 0);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ax-scheduler-month-view .ax-scheduler-month-spanning-layer .ax-scheduler-month-spanning-week-row .ax-scheduler-month-spanning-appointment .ax-spanning-appointment-title .ax-scheduler-action-icon{margin-inline-start:calc(var(--spacing, .25rem) * 1);width:auto;flex-shrink:0;cursor:pointer}ax-scheduler-month-view .ax-scheduler-month-spanning-layer .ax-scheduler-month-spanning-week-row .ax-scheduler-month-spanning-appointment.ax-spanning-start-clipped{position:relative;border-start-start-radius:0;border-end-start-radius:0;margin-inline-start:0}ax-scheduler-month-view .ax-scheduler-month-spanning-layer .ax-scheduler-month-spanning-week-row .ax-scheduler-month-spanning-appointment.ax-spanning-start-clipped:before{content:\"\\2190 \";position:absolute;top:calc(var(--spacing, .25rem) * .5);font-size:.65rem;opacity:70%;inset-inline-start:0}ax-scheduler-month-view .ax-scheduler-month-spanning-layer .ax-scheduler-month-spanning-week-row .ax-scheduler-month-spanning-appointment.ax-spanning-end-clipped{position:relative;border-start-end-radius:0;border-end-end-radius:0;margin-inline-end:0}ax-scheduler-month-view .ax-scheduler-month-spanning-layer .ax-scheduler-month-spanning-week-row .ax-scheduler-month-spanning-appointment.ax-spanning-end-clipped:after{content:\" \\2192\";position:absolute;top:calc(var(--spacing, .25rem) * .5);font-size:.65rem;opacity:70%;inset-inline-end:0}ax-scheduler-month-view .ax-scheduler-month-grid{position:relative;z-index:1;display:grid;width:100%;grid-auto-rows:minmax(5rem,auto);grid-template-columns:repeat(7,minmax(0,1fr));border-inline-start-style:var(--tw-border-style);border-inline-start-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell{position:relative;overflow:hidden;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));padding:calc(var(--spacing, .25rem) * 1)}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell.ax-other-month{background-color:rgba(var(--ax-sys-color-border-lightest-surface))}@supports (color: color-mix(in lab,red,red)){ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell.ax-other-month{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-border-lightest-surface)) 20%,transparent)}}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell.ax-other-month .ax-scheduler-month-day-number{color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell.ax-other-month .ax-scheduler-month-day-number{color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 50%,transparent)}}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell.ax-state-today{background-color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell.ax-state-today{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 5%,transparent)}}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell.ax-state-today .ax-scheduler-month-day-number{--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700);color:rgba(var(--ax-sys-color-primary-surface))}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell.ax-state-today.ax-other-month{background-color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell.ax-state-today.ax-other-month{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 2.5%,transparent)}}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell.ax-state-today.ax-other-month .ax-scheduler-month-day-number{color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell.ax-state-today.ax-other-month .ax-scheduler-month-day-number{color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 50%,transparent)}}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell.ax-state-holiday .ax-scheduler-month-day-number{color:var(--ax-scheduler-holiday-color, rgba(var(--ax-sys-color-danger-surface)));--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700)}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell.ax-state-holiday.ax-other-month .ax-scheduler-month-day-number{color:var(--ax-scheduler-holiday-color, rgba(var(--ax-sys-color-danger-surface), .5))}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell .ax-scheduler-month-day-header{margin-bottom:calc(var(--spacing, .25rem) * 1);text-align:center}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell .ax-scheduler-month-day-header .ax-scheduler-month-day-number{display:inline-block;max-width:100%;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)))}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell .ax-scheduler-month-day-appointments{display:flex;flex-direction:column;gap:calc(var(--spacing, .25rem) * .5);overflow:hidden;padding-top:max(0rem,calc(var(--spanning-rows-count, 0) * (var(--ax-scheduler-month-spanning-row-height) + var(--ax-scheduler-month-spanning-row-gap)) - var(--ax-scheduler-month-spanning-row-gap)))}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell .ax-scheduler-month-day-appointments .ax-scheduler-month-appointment-chip{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:var(--radius-sm, .25rem);padding-inline:calc(var(--spacing, .25rem) * 1);padding-block:calc(var(--spacing, .25rem) * .5);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell .ax-scheduler-month-day-appointments .ax-scheduler-month-overflow-badge{margin-top:calc(var(--spacing, .25rem) * .5);cursor:pointer;padding-inline:calc(var(--spacing, .25rem) * 0);padding-block:calc(var(--spacing, .25rem) * .5);text-align:start;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell .ax-scheduler-month-day-appointments .ax-scheduler-month-overflow-badge:hover{text-decoration-line:underline}ax-scheduler-month-view:not(.ax-state-readonly) .ax-scheduler-month-appointment-chip,ax-scheduler-month-view:not(.ax-state-readonly) .ax-scheduler-month-spanning-appointment{cursor:pointer}ax-scheduler-month-view:not(.ax-state-readonly) .ax-scheduler-month-day-cell{cursor:pointer;transition-property:background-color;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));transition-duration:var(--ax-sys-transition-duration);transition-timing-function:var(--ax-sys-transition-timing-function)}ax-scheduler-month-view:not(.ax-state-readonly) .ax-scheduler-month-day-cell:hover{background-color:rgba(var(--ax-comp-scheduler-slot-hover-bg,var(--ax-sys-color-primary-surface),.1))}ax-scheduler-month-view:not(.ax-state-readonly) .ax-scheduler-month-day-cell:hover.ax-state-holiday{background-color:rgba(var(--ax-sys-color-danger-surface),.1)}ax-scheduler-month-view .ax-appointment-chip-title{display:flex;justify-content:space-between}ax-scheduler-month-view .ax-appointment-chip-title .ax-scheduler-action-icon{width:auto;cursor:pointer}ax-scheduler.ax-rtl ax-scheduler-month-view .ax-scheduler-month-spanning-appointment.ax-spanning-start-clipped:before{content:\"\\2192 \"}ax-scheduler.ax-rtl ax-scheduler-month-view .ax-scheduler-month-spanning-appointment.ax-spanning-end-clipped:after{content:\" \\2190\"}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: AXDragDirective, selector: "[axDrag]", inputs: ["axDrag", "dragData", "dragDisabled", "dragTransition", "dragElementClone", "dropZoneGroup", "dragStartDelay", "dragResetOnDblClick", "dragLockAxis", "dragClonedTemplate", "dragCursor", "dragBoundary", "dragTransitionDuration"], outputs: ["dragPositionChanged"] }, { kind: "component", type: AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disablePanelClass", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "closeOnScroll", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "directive", type: AXTooltipDirective, selector: "[axTooltip]", inputs: ["axTooltipDisabled", "axTooltip", "axTooltipContext", "axTooltipPlacement", "axTooltipOffsetX", "axTooltipOffsetY", "axTooltipOpenAfter", "axTooltipCloseAfter"] }, { kind: "directive", type: AXDropZoneDirective, selector: "[axDropZone]", inputs: ["dropZoneGroup"], outputs: ["onElementDrop", "onElementHover"], exportAs: ["axDropZone"] }, { kind: "component", type: AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXFormatPipe, name: "format" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
1827
1883
|
}
|
|
1828
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1884
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXSchedulerMonthViewComponent, decorators: [{
|
|
1829
1885
|
type: Component,
|
|
1830
|
-
args: [{ selector: 'ax-scheduler-month-view',
|
|
1886
|
+
args: [{ selector: 'ax-scheduler-month-view', encapsulation: ViewEncapsulation.None, host: {
|
|
1831
1887
|
'[class.ax-state-readonly]': 'readonly()',
|
|
1832
1888
|
}, imports: [
|
|
1833
1889
|
AsyncPipe,
|
|
@@ -1850,26 +1906,46 @@ class AXSchedulerTimelineDayViewComponent extends NXComponent {
|
|
|
1850
1906
|
this.calendarService = inject(AXCalendarService);
|
|
1851
1907
|
this.schedulerService = inject(AXSchedulerService);
|
|
1852
1908
|
this.GAP_PX = 1;
|
|
1853
|
-
this.readonly = input(false,
|
|
1854
|
-
|
|
1855
|
-
this.
|
|
1856
|
-
|
|
1857
|
-
this.
|
|
1858
|
-
|
|
1859
|
-
this.
|
|
1860
|
-
|
|
1861
|
-
this.
|
|
1862
|
-
|
|
1863
|
-
this.
|
|
1864
|
-
|
|
1865
|
-
this.
|
|
1866
|
-
|
|
1867
|
-
this.
|
|
1868
|
-
|
|
1869
|
-
this.
|
|
1870
|
-
|
|
1871
|
-
this.
|
|
1872
|
-
|
|
1909
|
+
this.readonly = input(false, /* @ts-ignore */
|
|
1910
|
+
...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
|
|
1911
|
+
this.draggable = input(true, /* @ts-ignore */
|
|
1912
|
+
...(ngDevMode ? [{ debugName: "draggable" }] : /* istanbul ignore next */ []));
|
|
1913
|
+
this.hasActions = input(false, /* @ts-ignore */
|
|
1914
|
+
...(ngDevMode ? [{ debugName: "hasActions" }] : /* istanbul ignore next */ []));
|
|
1915
|
+
this.dragStartDelay = input(0, /* @ts-ignore */
|
|
1916
|
+
...(ngDevMode ? [{ debugName: "dragStartDelay" }] : /* istanbul ignore next */ []));
|
|
1917
|
+
this.calendar = input(/* @ts-ignore */
|
|
1918
|
+
...(ngDevMode ? [undefined, { debugName: "calendar" }] : /* istanbul ignore next */ []));
|
|
1919
|
+
this.showResourceHeaders = input(true, /* @ts-ignore */
|
|
1920
|
+
...(ngDevMode ? [{ debugName: "showResourceHeaders" }] : /* istanbul ignore next */ []));
|
|
1921
|
+
this.date = input.required(/* @ts-ignore */
|
|
1922
|
+
...(ngDevMode ? [{ debugName: "date" }] : /* istanbul ignore next */ []));
|
|
1923
|
+
this.endDayHour = input.required(/* @ts-ignore */
|
|
1924
|
+
...(ngDevMode ? [{ debugName: "endDayHour" }] : /* istanbul ignore next */ []));
|
|
1925
|
+
this.selectedAppointmentId = input(null, /* @ts-ignore */
|
|
1926
|
+
...(ngDevMode ? [{ debugName: "selectedAppointmentId" }] : /* istanbul ignore next */ []));
|
|
1927
|
+
this.startDayHour = input.required(/* @ts-ignore */
|
|
1928
|
+
...(ngDevMode ? [{ debugName: "startDayHour" }] : /* istanbul ignore next */ []));
|
|
1929
|
+
this.showUnassignedAppointments = input(true, /* @ts-ignore */
|
|
1930
|
+
...(ngDevMode ? [{ debugName: "showUnassignedAppointments" }] : /* istanbul ignore next */ []));
|
|
1931
|
+
this.resources = input([], /* @ts-ignore */
|
|
1932
|
+
...(ngDevMode ? [{ debugName: "resources" }] : /* istanbul ignore next */ []));
|
|
1933
|
+
this.showCurrentTimeIndicator = input(true, /* @ts-ignore */
|
|
1934
|
+
...(ngDevMode ? [{ debugName: "showCurrentTimeIndicator" }] : /* istanbul ignore next */ []));
|
|
1935
|
+
this.scrollToCurrentTimeIndicator = input(false, /* @ts-ignore */
|
|
1936
|
+
...(ngDevMode ? [{ debugName: "scrollToCurrentTimeIndicator" }] : /* istanbul ignore next */ []));
|
|
1937
|
+
this.resourceTemplate = input(/* @ts-ignore */
|
|
1938
|
+
...(ngDevMode ? [undefined, { debugName: "resourceTemplate" }] : /* istanbul ignore next */ []));
|
|
1939
|
+
this.appointments = input([], /* @ts-ignore */
|
|
1940
|
+
...(ngDevMode ? [{ debugName: "appointments" }] : /* istanbul ignore next */ []));
|
|
1941
|
+
this.tooltipTemplate = input(/* @ts-ignore */
|
|
1942
|
+
...(ngDevMode ? [undefined, { debugName: "tooltipTemplate" }] : /* istanbul ignore next */ []));
|
|
1943
|
+
this.dragStartSlotId = signal(null, /* @ts-ignore */
|
|
1944
|
+
...(ngDevMode ? [{ debugName: "dragStartSlotId" }] : /* istanbul ignore next */ []));
|
|
1945
|
+
this.dragStartSlotResourceId = signal(null, /* @ts-ignore */
|
|
1946
|
+
...(ngDevMode ? [{ debugName: "dragStartSlotResourceId" }] : /* istanbul ignore next */ []));
|
|
1947
|
+
this.currentTimeLineElement = viewChild('currentTimeLine', /* @ts-ignore */
|
|
1948
|
+
...(ngDevMode ? [{ debugName: "currentTimeLineElement" }] : /* istanbul ignore next */ []));
|
|
1873
1949
|
/**
|
|
1874
1950
|
* Gets appointments grouped by resources for timeline view.
|
|
1875
1951
|
*/
|
|
@@ -1878,7 +1954,8 @@ class AXSchedulerTimelineDayViewComponent extends NXComponent {
|
|
|
1878
1954
|
const resources = this.resources();
|
|
1879
1955
|
const showUnassigned = this.showUnassignedAppointments();
|
|
1880
1956
|
return this.schedulerService.filterAppointmentsByResources(allAppointments, resources, showUnassigned);
|
|
1881
|
-
},
|
|
1957
|
+
}, /* @ts-ignore */
|
|
1958
|
+
...(ngDevMode ? [{ debugName: "appointmentsByResource" }] : /* istanbul ignore next */ []));
|
|
1882
1959
|
/**
|
|
1883
1960
|
* Gets all resource IDs including unassigned if applicable.
|
|
1884
1961
|
*/
|
|
@@ -1886,7 +1963,8 @@ class AXSchedulerTimelineDayViewComponent extends NXComponent {
|
|
|
1886
1963
|
const resources = this.resources();
|
|
1887
1964
|
const showUnassigned = this.showUnassignedAppointments();
|
|
1888
1965
|
return this.schedulerService.getAllResourceIds(resources, showUnassigned);
|
|
1889
|
-
},
|
|
1966
|
+
}, /* @ts-ignore */
|
|
1967
|
+
...(ngDevMode ? [{ debugName: "resourceIds" }] : /* istanbul ignore next */ []));
|
|
1890
1968
|
/**
|
|
1891
1969
|
* Processes original appointments to get segments relevant to this specific day and its viewable hours.
|
|
1892
1970
|
* Filters out original all-day events.
|
|
@@ -1930,7 +2008,8 @@ class AXSchedulerTimelineDayViewComponent extends NXComponent {
|
|
|
1930
2008
|
}
|
|
1931
2009
|
}
|
|
1932
2010
|
return segmentsOnThisDay;
|
|
1933
|
-
},
|
|
2011
|
+
}, /* @ts-ignore */
|
|
2012
|
+
...(ngDevMode ? [{ debugName: "processedSegmentsForLayout" }] : /* istanbul ignore next */ []));
|
|
1934
2013
|
// Internal outputs to be caught by parent AXSchedulerComponent
|
|
1935
2014
|
this.slotClickedInternal = output();
|
|
1936
2015
|
this.slotDblClickedInternal = output();
|
|
@@ -1964,7 +2043,8 @@ class AXSchedulerTimelineDayViewComponent extends NXComponent {
|
|
|
1964
2043
|
hours.push(time);
|
|
1965
2044
|
}
|
|
1966
2045
|
return hours;
|
|
1967
|
-
},
|
|
2046
|
+
}, /* @ts-ignore */
|
|
2047
|
+
...(ngDevMode ? [{ debugName: "hoursArray" }] : /* istanbul ignore next */ []));
|
|
1968
2048
|
// --- Appointment Layout Calculation ---
|
|
1969
2049
|
this.appointmentLayouts = computed(() => {
|
|
1970
2050
|
const finalLayouts = [];
|
|
@@ -2015,7 +2095,8 @@ class AXSchedulerTimelineDayViewComponent extends NXComponent {
|
|
|
2015
2095
|
});
|
|
2016
2096
|
}
|
|
2017
2097
|
return finalLayouts;
|
|
2018
|
-
},
|
|
2098
|
+
}, /* @ts-ignore */
|
|
2099
|
+
...(ngDevMode ? [{ debugName: "appointmentLayouts" }] : /* istanbul ignore next */ []));
|
|
2019
2100
|
}
|
|
2020
2101
|
isActive(appointmentId) {
|
|
2021
2102
|
return this.selectedAppointmentId() === appointmentId;
|
|
@@ -2295,12 +2376,12 @@ class AXSchedulerTimelineDayViewComponent extends NXComponent {
|
|
|
2295
2376
|
this.dragStartSlotId.set(dropListElement ? dropListElement.dataset['slotId'] : null);
|
|
2296
2377
|
this.dragStartSlotResourceId.set(dropListElement ? dropListElement.dataset['resourceId'] : null);
|
|
2297
2378
|
}
|
|
2298
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2299
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXSchedulerTimelineDayViewComponent, isStandalone: true, selector: "ax-scheduler-timeline-day-view", inputs: { readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, draggable: { classPropertyName: "draggable", publicName: "draggable", isSignal: true, isRequired: false, transformFunction: null }, hasActions: { classPropertyName: "hasActions", publicName: "hasActions", isSignal: true, isRequired: false, transformFunction: null }, dragStartDelay: { classPropertyName: "dragStartDelay", publicName: "dragStartDelay", isSignal: true, isRequired: false, transformFunction: null }, calendar: { classPropertyName: "calendar", publicName: "calendar", isSignal: true, isRequired: false, transformFunction: null }, showResourceHeaders: { classPropertyName: "showResourceHeaders", publicName: "showResourceHeaders", isSignal: true, isRequired: false, transformFunction: null }, date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: true, transformFunction: null }, endDayHour: { classPropertyName: "endDayHour", publicName: "endDayHour", isSignal: true, isRequired: true, transformFunction: null }, selectedAppointmentId: { classPropertyName: "selectedAppointmentId", publicName: "selectedAppointmentId", isSignal: true, isRequired: false, transformFunction: null }, startDayHour: { classPropertyName: "startDayHour", publicName: "startDayHour", isSignal: true, isRequired: true, transformFunction: null }, showUnassignedAppointments: { classPropertyName: "showUnassignedAppointments", publicName: "showUnassignedAppointments", isSignal: true, isRequired: false, transformFunction: null }, resources: { classPropertyName: "resources", publicName: "resources", isSignal: true, isRequired: false, transformFunction: null }, showCurrentTimeIndicator: { classPropertyName: "showCurrentTimeIndicator", publicName: "showCurrentTimeIndicator", isSignal: true, isRequired: false, transformFunction: null }, scrollToCurrentTimeIndicator: { classPropertyName: "scrollToCurrentTimeIndicator", publicName: "scrollToCurrentTimeIndicator", isSignal: true, isRequired: false, transformFunction: null }, resourceTemplate: { classPropertyName: "resourceTemplate", publicName: "resourceTemplate", isSignal: true, isRequired: false, transformFunction: null }, appointments: { classPropertyName: "appointments", publicName: "appointments", isSignal: true, isRequired: false, transformFunction: null }, tooltipTemplate: { classPropertyName: "tooltipTemplate", publicName: "tooltipTemplate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { slotClickedInternal: "slotClickedInternal", slotDblClickedInternal: "slotDblClickedInternal", slotRightClickedInternal: "slotRightClickedInternal", appointmentClickedInternal: "appointmentClickedInternal", appointmentDblClickedInternal: "appointmentDblClickedInternal", appointmentRightClickedInternal: "appointmentRightClickedInternal", onActionClickInternal: "onActionClickInternal", onAppointmentDropInternal: "onAppointmentDropInternal" }, host: { properties: { "class.ax-state-readonly": "readonly()" } }, providers: [{ provide: AXComponent, useExisting: AXSchedulerTimelineDayViewComponent }], viewQueries: [{ propertyName: "currentTimeLineElement", first: true, predicate: ["currentTimeLine"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (resources().length === 0 || !showResourceHeaders()) {\n <!-- Original layout when no resources -->\n <div class=\"ax-scheduler-timeline-header\">\n @for (hour of hoursArray(); track hour.date.getTime()) {\n <div class=\"ax-scheduler-timeline-header-hours\">\n <span>{{ hour | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}</span>\n </div>\n }\n </div>\n\n <div class=\"ax-scheduler-timeline-content\">\n <!-- Current Time Line Indicator -->\n @if (showCurrentTimeIndicator() && getCurrentTimePositionWithOffset() !== null) {\n <div\n class=\"ax-scheduler-current-time-line\"\n [style.inset-inline-start]=\"getCurrentTimePositionWithOffset()\"\n #currentTimeLine\n ></div>\n }\n <div class=\"ax-scheduler-timeline-appointment-container\">\n @for (\n layout of resources().length === 0 ? appointmentLayouts() : getAppointmentLayoutsForResource(resourceIds()[0]);\n track layout.appointment.id\n ) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || layout.appointment.readonly || readonly()\"\n [dragData]=\"layout.appointment\"\n (pointerdown)=\"getSlotId($event)\"\n (click)=\"handleAppointmentEvent($event, layout.appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, layout.appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, layout.appointment)\"\n [title]=\"tooltipTemplate() ? '' : layout.appointment.title\"\n [style.width]=\"layout.layoutWidth\"\n [style.height]=\"layout.layoutHeight\"\n class=\"ax-scheduler-timeline-appointment {{\n layout.appointment.cssClass ?? 'ax-scheduler-' + (layout.appointment.priority ?? 'primary') + '-priority'\n }}\"\n [class.ax-state-active]=\"isActive(layout.appointment.id)\"\n [style.insetBlockStart]=\"layout.layoutTop\"\n [style.insetInlineStart]=\"layout.layoutLeft\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltipContext]=\"layout.appointment\"\n [axTooltip]=\"tooltipTemplate()\"\n >\n <ax-title>\n <span class=\"ax-scheduler-truncate\">{{ layout.appointment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, layout.appointment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n >\n </ax-icon>\n }\n </ax-title>\n <ax-subtitle>\n {{\n layout.appointment.originalStartDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async\n }}\n -\n {{\n layout.appointment.originalEndDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async\n }}\n </ax-subtitle>\n </div>\n }\n </div>\n <div class=\"ax-scheduler-timeline-slot-row\" aria-hidden=\"true\">\n @for (time of hoursArray(); track time.date.getTime()) {\n <div\n axDropZone\n #zone=\"axDropZone\"\n (onElementDrop)=\"handleDrop($event, time)\"\n [class.ax-scheduler-slot-hovered]=\"zone.isHovered()\"\n class=\"ax-scheduler-timeline-slot-cell\"\n (click)=\"handleSlotEvent($event, time)\"\n (dblclick)=\"handleSlotEvent($event, time)\"\n (contextmenu)=\"handleSlotEvent($event, time)\"\n [attr.data-slot-id]=\"time.format('YYYYMMDD-HHmm')\"\n ></div>\n }\n </div>\n </div>\n} @else {\n <!-- Resource-based layout -->\n <div class=\"ax-scheduler-timeline-resource-container\">\n <!-- Single sticky time header for all resources (only show if not used in multi-day) -->\n @if (showResourceHeaders()) {\n <div class=\"ax-scheduler-timeline-header ax-scheduler-timeline-header-sticky\">\n <div class=\"ax-scheduler-timeline-resource-header-placeholder\"><span>Resources</span></div>\n @for (hour of hoursArray(); track hour.date.getTime()) {\n <div class=\"ax-scheduler-timeline-header-hours\">\n <span>{{ hour | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}</span>\n </div>\n }\n </div>\n }\n\n <!-- Resource rows -->\n <div class=\"ax-scheduler-timeline-resource-rows\">\n <!-- Current Time Line Indicator -->\n @if (showCurrentTimeIndicator() && getCurrentTimePositionWithOffset() !== null) {\n <div\n #currentTimeLine\n class=\"ax-scheduler-current-time-line\"\n [style.inset-inline-start]=\"getCurrentTimePositionWithOffset()\"\n ></div>\n }\n\n @for (resourceId of resourceIds(); track resourceId) {\n <div class=\"ax-scheduler-timeline-resource-row\" [style.height]=\"getResourceRowHeight(resourceId)\">\n @if (showResourceHeaders()) {\n <!-- Sticky Resource Header -->\n <div class=\"ax-scheduler-timeline-resource-header ax-scheduler-timeline-resource-header-sticky\">\n @if (resourceTemplate() && typeof resourceTemplate() !== 'string') {\n <ng-container\n [ngTemplateOutlet]=\"$any(resourceTemplate())\"\n [ngTemplateOutletContext]=\"{\n $implicit: getResourceContext(resourceId),\n resource: getResourceContext(resourceId),\n resourceId: resourceId,\n }\"\n ></ng-container>\n } @else {\n <span class=\"ax-scheduler-timeline-resource-title\">{{ getResourceTitle(resourceId) }}</span>\n }\n </div>\n }\n\n <!-- Resource Content -->\n <div class=\"ax-scheduler-timeline-resource-content\">\n <div class=\"ax-scheduler-timeline-appointment-container\">\n @for (layout of getAppointmentLayoutsForResource(resourceId); track layout.appointment.id) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || layout.appointment.readonly || readonly()\"\n [dragData]=\"layout.appointment\"\n (pointerdown)=\"getSlotId($event)\"\n (click)=\"handleAppointmentEvent($event, layout.appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, layout.appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, layout.appointment)\"\n [title]=\"tooltipTemplate() ? '' : layout.appointment.title\"\n [style.width]=\"layout.layoutWidth\"\n [style.height]=\"layout.layoutHeight\"\n class=\"ax-scheduler-timeline-appointment {{\n layout.appointment.cssClass ??\n 'ax-scheduler-' + (layout.appointment.priority ?? 'primary') + '-priority'\n }}\"\n [class.ax-state-active]=\"isActive(layout.appointment.id)\"\n [style.insetBlockStart]=\"layout.layoutTop\"\n [style.insetInlineStart]=\"layout.layoutLeft\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltipContext]=\"layout.appointment\"\n [axTooltip]=\"tooltipTemplate()\"\n >\n <ax-title>\n <span class=\"ax-scheduler-truncate\">{{ layout.appointment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, layout.appointment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n >\n </ax-icon>\n }\n </ax-title>\n <ax-subtitle>\n {{\n layout.appointment.originalStartDate\n | format: 'time' : { format: 'HH:mm', calendar: calendar() }\n | async\n }}\n -\n {{\n layout.appointment.originalEndDate\n | format: 'time' : { format: 'HH:mm', calendar: calendar() }\n | async\n }}\n </ax-subtitle>\n </div>\n }\n </div>\n <div class=\"ax-scheduler-timeline-slot-row\" aria-hidden=\"true\">\n @for (time of hoursArray(); track time.date.getTime()) {\n <div\n axDropZone\n #zone=\"axDropZone\"\n (onElementDrop)=\"handleDrop($event, time, resourceId)\"\n [class.ax-scheduler-slot-hovered]=\"zone.isHovered()\"\n class=\"ax-scheduler-timeline-slot-cell\"\n (click)=\"handleSlotEvent($event, time)\"\n (dblclick)=\"handleSlotEvent($event, time)\"\n (contextmenu)=\"handleSlotEvent($event, time)\"\n [attr.data-slot-id]=\"time.format('YYYYMMDD-HHmm')\"\n [attr.data-resource-id]=\"resourceId\"\n ></div>\n }\n </div>\n </div>\n </div>\n }\n </div>\n </div>\n}\n", styles: ["@layer properties;@layer components{ax-scheduler-timeline-day-view{position:relative;display:inline-flex;height:100%;flex-direction:column;background-color:inherit}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container{position:relative;display:flex;height:auto;min-height:100%;flex-direction:column;overflow:visible;background-color:inherit}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-header-sticky{position:sticky;top:calc(var(--spacing, .25rem) * 0);z-index:10;display:flex;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-header-sticky .ax-scheduler-timeline-resource-header-placeholder{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 0);z-index:15;display:flex;width:var(--ax-comp-scheduler-resource-header-width,8rem);min-width:var(--ax-comp-scheduler-resource-header-width,8rem);align-items:center;justify-content:center;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-rows{position:relative;flex:1;overflow:visible;background-color:inherit}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-row{display:flex;min-height:calc(var(--spacing, .25rem) * 0);width:max-content;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-row .ax-scheduler-timeline-resource-header{display:flex;width:var(--ax-comp-scheduler-resource-header-width,8rem);min-width:var(--ax-comp-scheduler-resource-header-width,8rem);align-items:center;justify-content:center;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit;padding:calc(var(--spacing, .25rem) * 2)}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-row .ax-scheduler-timeline-resource-header.ax-scheduler-timeline-resource-header-sticky{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 0);z-index:15;background-color:inherit}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-row .ax-scheduler-timeline-resource-header .ax-scheduler-timeline-resource-title{text-align:center;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);overflow-wrap:break-word}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-row .ax-scheduler-timeline-resource-content{position:relative;display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-row .ax-scheduler-timeline-resource-content .ax-scheduler-timeline-appointment-container{position:absolute;top:calc(var(--spacing, .25rem) * 0);width:100%;height:100%}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-row .ax-scheduler-timeline-resource-content .ax-scheduler-timeline-appointment-container .ax-scheduler-timeline-appointment{position:absolute;inset-inline-start:calc(var(--spacing, .25rem) * 0);display:flex;width:100%;flex-direction:column;overflow:hidden;border-radius:calc(var(--ax-sys-border-radius) / 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1)}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-row .ax-scheduler-timeline-resource-content .ax-scheduler-timeline-slot-row{position:relative;display:flex;height:100%}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-row .ax-scheduler-timeline-resource-content .ax-scheduler-timeline-slot-row .ax-scheduler-timeline-slot-cell{position:relative;width:var(--ax-comp-scheduler-timeline-view-blocks-width);border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-row .ax-scheduler-timeline-resource-content .ax-scheduler-timeline-slot-row .ax-scheduler-timeline-slot-cell:after{content:var(--tw-content);position:absolute}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-row .ax-scheduler-timeline-resource-content .ax-scheduler-timeline-slot-row .ax-scheduler-timeline-slot-cell:after{content:var(--tw-content);inset-inline-end:calc(var(--spacing, .25rem) * 0)}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-row .ax-scheduler-timeline-resource-content .ax-scheduler-timeline-slot-row .ax-scheduler-timeline-slot-cell:after{content:var(--tw-content);top:calc(var(--spacing, .25rem) * 0)}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-row .ax-scheduler-timeline-resource-content .ax-scheduler-timeline-slot-row .ax-scheduler-timeline-slot-cell:after{content:var(--tw-content);height:100%}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-row .ax-scheduler-timeline-resource-content .ax-scheduler-timeline-slot-row .ax-scheduler-timeline-slot-cell:after{content:var(--tw-content);width:1px}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-row .ax-scheduler-timeline-resource-content .ax-scheduler-timeline-slot-row .ax-scheduler-timeline-slot-cell:after{content:var(--tw-content);background-color:rgba(var(--ax-sys-color-border-lightest-surface))}@supports (color: color-mix(in lab,red,red)){ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-row .ax-scheduler-timeline-resource-content .ax-scheduler-timeline-slot-row .ax-scheduler-timeline-slot-cell:after{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-border-lightest-surface)) 30%,transparent)}}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-row .ax-scheduler-timeline-resource-content .ax-scheduler-timeline-slot-row .ax-scheduler-timeline-slot-cell:after{--tw-content: \"\";content:var(--tw-content)}ax-scheduler-timeline-day-view .ax-scheduler-timeline-header{position:sticky;top:calc(var(--spacing, .25rem) * 0);z-index:2;display:flex;width:100%;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:var(--ax-comp-scheduler-all-day-bg,inherit)}ax-scheduler-timeline-day-view .ax-scheduler-timeline-header .ax-scheduler-timeline-header-hours{position:relative;width:var(--ax-comp-scheduler-timeline-view-blocks-width);border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1)}ax-scheduler-timeline-day-view .ax-scheduler-timeline-header .ax-scheduler-timeline-header-hours span{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 2)}ax-scheduler-timeline-day-view .ax-scheduler-timeline-content{position:relative;height:100%}ax-scheduler-timeline-day-view .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container{position:absolute;top:calc(var(--spacing, .25rem) * 0);width:100%;height:100%}ax-scheduler-timeline-day-view .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container .ax-scheduler-timeline-appointment{position:absolute;inset-inline-start:calc(var(--spacing, .25rem) * 0);display:flex;width:100%;flex-direction:column;overflow:hidden;border-radius:calc(var(--ax-sys-border-radius) / 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1)}ax-scheduler-timeline-day-view .ax-scheduler-timeline-content .ax-scheduler-timeline-slot-row{display:flex;height:100%}ax-scheduler-timeline-day-view .ax-scheduler-timeline-content .ax-scheduler-timeline-slot-row .ax-scheduler-timeline-slot-cell{width:var(--ax-comp-scheduler-timeline-view-blocks-width);border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-day-view:not(.ax-state-readonly) .ax-scheduler-timeline-appointment{z-index:1;cursor:pointer}ax-scheduler-timeline-day-view:not(.ax-state-readonly) .ax-scheduler-timeline-slot-cell{z-index:0;cursor:pointer;transition-property:background-color;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s))}ax-scheduler-timeline-day-view:not(.ax-state-readonly) .ax-scheduler-timeline-slot-cell:hover{background-color:rgba(var(--ax-comp-scheduler-slot-hover-bg,var(--ax-sys-color-primary-surface),.1))}ax-scheduler-timeline-day-view ax-title{display:flex;justify-content:space-between}ax-scheduler-timeline-day-view ax-title .ax-scheduler-action-icon{width:auto;cursor:pointer}ax-scheduler-timeline-day-view .ax-scheduler-current-time-line{top:calc(var(--spacing, .25rem) * 0);bottom:calc(var(--spacing, .25rem) * 0);width:calc(var(--spacing, .25rem) * .5)}ax-scheduler-timeline-day-view .ax-scheduler-current-time-line:before{content:var(--tw-content);inset-inline-start:-5px}ax-scheduler-timeline-day-view .ax-scheduler-current-time-line:before{content:var(--tw-content);top:calc(var(--spacing, .25rem) * -1.5)}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-content{syntax: \"*\"; initial-value: \"\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial;--tw-content: \"\"}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: AXDragDirective, selector: "[axDrag]", inputs: ["axDrag", "dragData", "dragDisabled", "dragTransition", "dragElementClone", "dropZoneGroup", "dragStartDelay", "dragResetOnDblClick", "dragLockAxis", "dragClonedTemplate", "dragCursor", "dragBoundary", "dragTransitionDuration"], outputs: ["dragPositionChanged"] }, { kind: "directive", type: AXTooltipDirective, selector: "[axTooltip]", inputs: ["axTooltipDisabled", "axTooltip", "axTooltipContext", "axTooltipPlacement", "axTooltipOffsetX", "axTooltipOffsetY", "axTooltipOpenAfter", "axTooltipCloseAfter"] }, { kind: "directive", type: AXDropZoneDirective, selector: "[axDropZone]", inputs: ["dropZoneGroup"], outputs: ["onElementDrop", "onElementHover"], exportAs: ["axDropZone"] }, { kind: "component", type: AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXFormatPipe, name: "format" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
2379
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXSchedulerTimelineDayViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
2380
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXSchedulerTimelineDayViewComponent, isStandalone: true, selector: "ax-scheduler-timeline-day-view", inputs: { readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, draggable: { classPropertyName: "draggable", publicName: "draggable", isSignal: true, isRequired: false, transformFunction: null }, hasActions: { classPropertyName: "hasActions", publicName: "hasActions", isSignal: true, isRequired: false, transformFunction: null }, dragStartDelay: { classPropertyName: "dragStartDelay", publicName: "dragStartDelay", isSignal: true, isRequired: false, transformFunction: null }, calendar: { classPropertyName: "calendar", publicName: "calendar", isSignal: true, isRequired: false, transformFunction: null }, showResourceHeaders: { classPropertyName: "showResourceHeaders", publicName: "showResourceHeaders", isSignal: true, isRequired: false, transformFunction: null }, date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: true, transformFunction: null }, endDayHour: { classPropertyName: "endDayHour", publicName: "endDayHour", isSignal: true, isRequired: true, transformFunction: null }, selectedAppointmentId: { classPropertyName: "selectedAppointmentId", publicName: "selectedAppointmentId", isSignal: true, isRequired: false, transformFunction: null }, startDayHour: { classPropertyName: "startDayHour", publicName: "startDayHour", isSignal: true, isRequired: true, transformFunction: null }, showUnassignedAppointments: { classPropertyName: "showUnassignedAppointments", publicName: "showUnassignedAppointments", isSignal: true, isRequired: false, transformFunction: null }, resources: { classPropertyName: "resources", publicName: "resources", isSignal: true, isRequired: false, transformFunction: null }, showCurrentTimeIndicator: { classPropertyName: "showCurrentTimeIndicator", publicName: "showCurrentTimeIndicator", isSignal: true, isRequired: false, transformFunction: null }, scrollToCurrentTimeIndicator: { classPropertyName: "scrollToCurrentTimeIndicator", publicName: "scrollToCurrentTimeIndicator", isSignal: true, isRequired: false, transformFunction: null }, resourceTemplate: { classPropertyName: "resourceTemplate", publicName: "resourceTemplate", isSignal: true, isRequired: false, transformFunction: null }, appointments: { classPropertyName: "appointments", publicName: "appointments", isSignal: true, isRequired: false, transformFunction: null }, tooltipTemplate: { classPropertyName: "tooltipTemplate", publicName: "tooltipTemplate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { slotClickedInternal: "slotClickedInternal", slotDblClickedInternal: "slotDblClickedInternal", slotRightClickedInternal: "slotRightClickedInternal", appointmentClickedInternal: "appointmentClickedInternal", appointmentDblClickedInternal: "appointmentDblClickedInternal", appointmentRightClickedInternal: "appointmentRightClickedInternal", onActionClickInternal: "onActionClickInternal", onAppointmentDropInternal: "onAppointmentDropInternal" }, host: { properties: { "class.ax-state-readonly": "readonly()" } }, providers: [{ provide: AXComponent, useExisting: AXSchedulerTimelineDayViewComponent }], viewQueries: [{ propertyName: "currentTimeLineElement", first: true, predicate: ["currentTimeLine"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (resources().length === 0 || !showResourceHeaders()) {\n <!-- Original layout when no resources -->\n <div class=\"ax-scheduler-timeline-header\">\n @for (hour of hoursArray(); track hour.date.getTime()) {\n <div class=\"ax-scheduler-timeline-header-hours\">\n <span>{{ hour | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}</span>\n </div>\n }\n </div>\n\n <div class=\"ax-scheduler-timeline-content\">\n <!-- Current Time Line Indicator -->\n @if (showCurrentTimeIndicator() && getCurrentTimePositionWithOffset() !== null) {\n <div\n class=\"ax-scheduler-current-time-line\"\n [style.inset-inline-start]=\"getCurrentTimePositionWithOffset()\"\n #currentTimeLine\n ></div>\n }\n <div class=\"ax-scheduler-timeline-appointment-container\">\n @for (\n layout of resources().length === 0 ? appointmentLayouts() : getAppointmentLayoutsForResource(resourceIds()[0]);\n track layout.appointment.id\n ) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || layout.appointment.readonly || readonly()\"\n [dragData]=\"layout.appointment\"\n (pointerdown)=\"getSlotId($event)\"\n (click)=\"handleAppointmentEvent($event, layout.appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, layout.appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, layout.appointment)\"\n [title]=\"tooltipTemplate() ? '' : layout.appointment.title\"\n [style.width]=\"layout.layoutWidth\"\n [style.height]=\"layout.layoutHeight\"\n class=\"ax-scheduler-timeline-appointment {{\n layout.appointment.cssClass ?? 'ax-scheduler-' + (layout.appointment.priority ?? 'primary') + '-priority'\n }}\"\n [class.ax-state-active]=\"isActive(layout.appointment.id)\"\n [style.insetBlockStart]=\"layout.layoutTop\"\n [style.insetInlineStart]=\"layout.layoutLeft\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltipContext]=\"layout.appointment\"\n [axTooltip]=\"tooltipTemplate()\"\n >\n <ax-title>\n <span class=\"ax-scheduler-truncate\">{{ layout.appointment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, layout.appointment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n >\n </ax-icon>\n }\n </ax-title>\n <ax-subtitle>\n {{\n layout.appointment.originalStartDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async\n }}\n -\n {{\n layout.appointment.originalEndDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async\n }}\n </ax-subtitle>\n </div>\n }\n </div>\n <div class=\"ax-scheduler-timeline-slot-row\" aria-hidden=\"true\">\n @for (time of hoursArray(); track time.date.getTime()) {\n <div\n axDropZone\n #zone=\"axDropZone\"\n (onElementDrop)=\"handleDrop($event, time)\"\n [class.ax-scheduler-slot-hovered]=\"zone.isHovered()\"\n class=\"ax-scheduler-timeline-slot-cell\"\n (click)=\"handleSlotEvent($event, time)\"\n (dblclick)=\"handleSlotEvent($event, time)\"\n (contextmenu)=\"handleSlotEvent($event, time)\"\n [attr.data-slot-id]=\"time.format('YYYYMMDD-HHmm')\"\n ></div>\n }\n </div>\n </div>\n} @else {\n <!-- Resource-based layout -->\n <div class=\"ax-scheduler-timeline-resource-container\">\n <!-- Single sticky time header for all resources (only show if not used in multi-day) -->\n @if (showResourceHeaders()) {\n <div class=\"ax-scheduler-timeline-header ax-scheduler-timeline-header-sticky\">\n <div class=\"ax-scheduler-timeline-resource-header-placeholder\"><span>Resources</span></div>\n @for (hour of hoursArray(); track hour.date.getTime()) {\n <div class=\"ax-scheduler-timeline-header-hours\">\n <span>{{ hour | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}</span>\n </div>\n }\n </div>\n }\n\n <!-- Resource rows -->\n <div class=\"ax-scheduler-timeline-resource-rows\">\n <!-- Current Time Line Indicator -->\n @if (showCurrentTimeIndicator() && getCurrentTimePositionWithOffset() !== null) {\n <div\n #currentTimeLine\n class=\"ax-scheduler-current-time-line\"\n [style.inset-inline-start]=\"getCurrentTimePositionWithOffset()\"\n ></div>\n }\n\n @for (resourceId of resourceIds(); track resourceId) {\n <div class=\"ax-scheduler-timeline-resource-row\" [style.height]=\"getResourceRowHeight(resourceId)\">\n @if (showResourceHeaders()) {\n <!-- Sticky Resource Header -->\n <div class=\"ax-scheduler-timeline-resource-header ax-scheduler-timeline-resource-header-sticky\">\n @if (resourceTemplate() && typeof resourceTemplate() !== 'string') {\n <ng-container\n [ngTemplateOutlet]=\"$any(resourceTemplate())\"\n [ngTemplateOutletContext]=\"{\n $implicit: getResourceContext(resourceId),\n resource: getResourceContext(resourceId),\n resourceId: resourceId,\n }\"\n ></ng-container>\n } @else {\n <span class=\"ax-scheduler-timeline-resource-title\">{{ getResourceTitle(resourceId) }}</span>\n }\n </div>\n }\n\n <!-- Resource Content -->\n <div class=\"ax-scheduler-timeline-resource-content\">\n <div class=\"ax-scheduler-timeline-appointment-container\">\n @for (layout of getAppointmentLayoutsForResource(resourceId); track layout.appointment.id) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || layout.appointment.readonly || readonly()\"\n [dragData]=\"layout.appointment\"\n (pointerdown)=\"getSlotId($event)\"\n (click)=\"handleAppointmentEvent($event, layout.appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, layout.appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, layout.appointment)\"\n [title]=\"tooltipTemplate() ? '' : layout.appointment.title\"\n [style.width]=\"layout.layoutWidth\"\n [style.height]=\"layout.layoutHeight\"\n class=\"ax-scheduler-timeline-appointment {{\n layout.appointment.cssClass ??\n 'ax-scheduler-' + (layout.appointment.priority ?? 'primary') + '-priority'\n }}\"\n [class.ax-state-active]=\"isActive(layout.appointment.id)\"\n [style.insetBlockStart]=\"layout.layoutTop\"\n [style.insetInlineStart]=\"layout.layoutLeft\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltipContext]=\"layout.appointment\"\n [axTooltip]=\"tooltipTemplate()\"\n >\n <ax-title>\n <span class=\"ax-scheduler-truncate\">{{ layout.appointment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, layout.appointment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n >\n </ax-icon>\n }\n </ax-title>\n <ax-subtitle>\n {{\n layout.appointment.originalStartDate\n | format: 'time' : { format: 'HH:mm', calendar: calendar() }\n | async\n }}\n -\n {{\n layout.appointment.originalEndDate\n | format: 'time' : { format: 'HH:mm', calendar: calendar() }\n | async\n }}\n </ax-subtitle>\n </div>\n }\n </div>\n <div class=\"ax-scheduler-timeline-slot-row\" aria-hidden=\"true\">\n @for (time of hoursArray(); track time.date.getTime()) {\n <div\n axDropZone\n #zone=\"axDropZone\"\n (onElementDrop)=\"handleDrop($event, time, resourceId)\"\n [class.ax-scheduler-slot-hovered]=\"zone.isHovered()\"\n class=\"ax-scheduler-timeline-slot-cell\"\n (click)=\"handleSlotEvent($event, time)\"\n (dblclick)=\"handleSlotEvent($event, time)\"\n (contextmenu)=\"handleSlotEvent($event, time)\"\n [attr.data-slot-id]=\"time.format('YYYYMMDD-HHmm')\"\n [attr.data-resource-id]=\"resourceId\"\n ></div>\n }\n </div>\n </div>\n </div>\n }\n </div>\n </div>\n}\n", styles: ["@layer properties;@layer components{ax-scheduler-timeline-day-view{position:relative;display:inline-flex;height:100%;flex-direction:column;background-color:inherit}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container{position:relative;display:flex;height:auto;min-height:100%;flex-direction:column;overflow:visible;background-color:inherit}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-header-sticky{position:sticky;top:calc(var(--spacing, .25rem) * 0);z-index:10;display:flex;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-header-sticky .ax-scheduler-timeline-resource-header-placeholder{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 0);z-index:15;display:flex;width:var(--ax-comp-scheduler-resource-header-width,8rem);min-width:var(--ax-comp-scheduler-resource-header-width,8rem);align-items:center;justify-content:center;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-rows{position:relative;flex:1;overflow:visible;background-color:inherit}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-row{display:flex;min-height:calc(var(--spacing, .25rem) * 0);width:max-content;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-row .ax-scheduler-timeline-resource-header{display:flex;width:var(--ax-comp-scheduler-resource-header-width,8rem);min-width:var(--ax-comp-scheduler-resource-header-width,8rem);align-items:center;justify-content:center;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit;padding:calc(var(--spacing, .25rem) * 2)}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-row .ax-scheduler-timeline-resource-header.ax-scheduler-timeline-resource-header-sticky{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 0);z-index:15;background-color:inherit}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-row .ax-scheduler-timeline-resource-header .ax-scheduler-timeline-resource-title{text-align:center;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);overflow-wrap:break-word}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-row .ax-scheduler-timeline-resource-content{position:relative;display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-row .ax-scheduler-timeline-resource-content .ax-scheduler-timeline-appointment-container{position:absolute;top:calc(var(--spacing, .25rem) * 0);width:100%;height:100%}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-row .ax-scheduler-timeline-resource-content .ax-scheduler-timeline-appointment-container .ax-scheduler-timeline-appointment{position:absolute;inset-inline-start:calc(var(--spacing, .25rem) * 0);display:flex;width:100%;flex-direction:column;overflow:hidden;border-radius:calc(var(--ax-sys-border-radius) / 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1)}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-row .ax-scheduler-timeline-resource-content .ax-scheduler-timeline-slot-row{position:relative;display:flex;height:100%}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-row .ax-scheduler-timeline-resource-content .ax-scheduler-timeline-slot-row .ax-scheduler-timeline-slot-cell{position:relative;width:var(--ax-comp-scheduler-timeline-view-blocks-width);border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-row .ax-scheduler-timeline-resource-content .ax-scheduler-timeline-slot-row .ax-scheduler-timeline-slot-cell:after{content:var(--tw-content);position:absolute}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-row .ax-scheduler-timeline-resource-content .ax-scheduler-timeline-slot-row .ax-scheduler-timeline-slot-cell:after{content:var(--tw-content);inset-inline-end:calc(var(--spacing, .25rem) * 0)}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-row .ax-scheduler-timeline-resource-content .ax-scheduler-timeline-slot-row .ax-scheduler-timeline-slot-cell:after{content:var(--tw-content);top:calc(var(--spacing, .25rem) * 0)}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-row .ax-scheduler-timeline-resource-content .ax-scheduler-timeline-slot-row .ax-scheduler-timeline-slot-cell:after{content:var(--tw-content);height:100%}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-row .ax-scheduler-timeline-resource-content .ax-scheduler-timeline-slot-row .ax-scheduler-timeline-slot-cell:after{content:var(--tw-content);width:1px}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-row .ax-scheduler-timeline-resource-content .ax-scheduler-timeline-slot-row .ax-scheduler-timeline-slot-cell:after{content:var(--tw-content);background-color:rgba(var(--ax-sys-color-border-lightest-surface))}@supports (color: color-mix(in lab,red,red)){ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-row .ax-scheduler-timeline-resource-content .ax-scheduler-timeline-slot-row .ax-scheduler-timeline-slot-cell:after{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-border-lightest-surface)) 30%,transparent)}}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-row .ax-scheduler-timeline-resource-content .ax-scheduler-timeline-slot-row .ax-scheduler-timeline-slot-cell:after{--tw-content: \"\";content:var(--tw-content)}ax-scheduler-timeline-day-view .ax-scheduler-timeline-header{position:sticky;top:calc(var(--spacing, .25rem) * 0);z-index:2;display:flex;width:100%;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:var(--ax-comp-scheduler-all-day-bg,inherit)}ax-scheduler-timeline-day-view .ax-scheduler-timeline-header .ax-scheduler-timeline-header-hours{position:relative;width:var(--ax-comp-scheduler-timeline-view-blocks-width);border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1)}ax-scheduler-timeline-day-view .ax-scheduler-timeline-header .ax-scheduler-timeline-header-hours span{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 2)}ax-scheduler-timeline-day-view .ax-scheduler-timeline-content{position:relative;height:100%}ax-scheduler-timeline-day-view .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container{position:absolute;top:calc(var(--spacing, .25rem) * 0);width:100%;height:100%}ax-scheduler-timeline-day-view .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container .ax-scheduler-timeline-appointment{position:absolute;inset-inline-start:calc(var(--spacing, .25rem) * 0);display:flex;width:100%;flex-direction:column;overflow:hidden;border-radius:calc(var(--ax-sys-border-radius) / 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1)}ax-scheduler-timeline-day-view .ax-scheduler-timeline-content .ax-scheduler-timeline-slot-row{display:flex;height:100%}ax-scheduler-timeline-day-view .ax-scheduler-timeline-content .ax-scheduler-timeline-slot-row .ax-scheduler-timeline-slot-cell{width:var(--ax-comp-scheduler-timeline-view-blocks-width);border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-day-view:not(.ax-state-readonly) .ax-scheduler-timeline-appointment{z-index:1;cursor:pointer}ax-scheduler-timeline-day-view:not(.ax-state-readonly) .ax-scheduler-timeline-slot-cell{z-index:0;cursor:pointer;transition-property:background-color;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s))}ax-scheduler-timeline-day-view:not(.ax-state-readonly) .ax-scheduler-timeline-slot-cell:hover{background-color:rgba(var(--ax-comp-scheduler-slot-hover-bg,var(--ax-sys-color-primary-surface),.1))}ax-scheduler-timeline-day-view ax-title{display:flex;justify-content:space-between}ax-scheduler-timeline-day-view ax-title .ax-scheduler-action-icon{width:auto;cursor:pointer}ax-scheduler-timeline-day-view .ax-scheduler-current-time-line{top:calc(var(--spacing, .25rem) * 0);bottom:calc(var(--spacing, .25rem) * 0);width:calc(var(--spacing, .25rem) * .5)}ax-scheduler-timeline-day-view .ax-scheduler-current-time-line:before{content:var(--tw-content);inset-inline-start:-5px}ax-scheduler-timeline-day-view .ax-scheduler-current-time-line:before{content:var(--tw-content);top:calc(var(--spacing, .25rem) * -1.5)}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-content{syntax: \"*\"; initial-value: \"\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial;--tw-content: \"\"}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: AXDragDirective, selector: "[axDrag]", inputs: ["axDrag", "dragData", "dragDisabled", "dragTransition", "dragElementClone", "dropZoneGroup", "dragStartDelay", "dragResetOnDblClick", "dragLockAxis", "dragClonedTemplate", "dragCursor", "dragBoundary", "dragTransitionDuration"], outputs: ["dragPositionChanged"] }, { kind: "directive", type: AXTooltipDirective, selector: "[axTooltip]", inputs: ["axTooltipDisabled", "axTooltip", "axTooltipContext", "axTooltipPlacement", "axTooltipOffsetX", "axTooltipOffsetY", "axTooltipOpenAfter", "axTooltipCloseAfter"] }, { kind: "directive", type: AXDropZoneDirective, selector: "[axDropZone]", inputs: ["dropZoneGroup"], outputs: ["onElementDrop", "onElementHover"], exportAs: ["axDropZone"] }, { kind: "component", type: AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXFormatPipe, name: "format" }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
2300
2381
|
}
|
|
2301
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2382
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXSchedulerTimelineDayViewComponent, decorators: [{
|
|
2302
2383
|
type: Component,
|
|
2303
|
-
args: [{ selector: 'ax-scheduler-timeline-day-view',
|
|
2384
|
+
args: [{ selector: 'ax-scheduler-timeline-day-view', encapsulation: ViewEncapsulation.None, host: {
|
|
2304
2385
|
'[class.ax-state-readonly]': 'readonly()',
|
|
2305
2386
|
}, imports: [
|
|
2306
2387
|
NgTemplateOutlet,
|
|
@@ -2413,37 +2494,58 @@ class AXSchedulerTimelineMonthViewComponent extends NXComponent {
|
|
|
2413
2494
|
});
|
|
2414
2495
|
}
|
|
2415
2496
|
return spanningResult;
|
|
2416
|
-
},
|
|
2497
|
+
}, /* @ts-ignore */
|
|
2498
|
+
...(ngDevMode ? [{ debugName: "spanningAppointments" }] : /* istanbul ignore next */ []));
|
|
2417
2499
|
// Get the set of multi-day appointment IDs for exclusion from per-day rendering
|
|
2418
2500
|
this.multiDayAppointmentIds = computed(() => {
|
|
2419
2501
|
const spanning = this.spanningAppointments();
|
|
2420
2502
|
return new Set(spanning.map((s) => s.appointment.id));
|
|
2421
|
-
},
|
|
2503
|
+
}, /* @ts-ignore */
|
|
2504
|
+
...(ngDevMode ? [{ debugName: "multiDayAppointmentIds" }] : /* istanbul ignore next */ []));
|
|
2422
2505
|
// Calculate max spanning rows for the non-resource view
|
|
2423
2506
|
this.maxSpanningRows = computed(() => {
|
|
2424
2507
|
const spanning = this.spanningAppointments();
|
|
2425
2508
|
if (spanning.length === 0)
|
|
2426
2509
|
return 0;
|
|
2427
2510
|
return Math.max(...spanning.map((s) => s.rowIndex)) + 1;
|
|
2428
|
-
},
|
|
2429
|
-
|
|
2430
|
-
this.
|
|
2431
|
-
|
|
2432
|
-
this.
|
|
2433
|
-
|
|
2434
|
-
this.
|
|
2435
|
-
|
|
2436
|
-
this.
|
|
2437
|
-
|
|
2438
|
-
this.
|
|
2439
|
-
|
|
2440
|
-
this.
|
|
2441
|
-
|
|
2442
|
-
this.
|
|
2443
|
-
|
|
2444
|
-
this.
|
|
2445
|
-
|
|
2446
|
-
this.
|
|
2511
|
+
}, /* @ts-ignore */
|
|
2512
|
+
...(ngDevMode ? [{ debugName: "maxSpanningRows" }] : /* istanbul ignore next */ []));
|
|
2513
|
+
this.readonly = input(false, /* @ts-ignore */
|
|
2514
|
+
...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
|
|
2515
|
+
this.draggable = input(true, /* @ts-ignore */
|
|
2516
|
+
...(ngDevMode ? [{ debugName: "draggable" }] : /* istanbul ignore next */ []));
|
|
2517
|
+
this.hasActions = input(false, /* @ts-ignore */
|
|
2518
|
+
...(ngDevMode ? [{ debugName: "hasActions" }] : /* istanbul ignore next */ []));
|
|
2519
|
+
this.dragStartDelay = input(0, /* @ts-ignore */
|
|
2520
|
+
...(ngDevMode ? [{ debugName: "dragStartDelay" }] : /* istanbul ignore next */ []));
|
|
2521
|
+
this.calendar = input(/* @ts-ignore */
|
|
2522
|
+
...(ngDevMode ? [undefined, { debugName: "calendar" }] : /* istanbul ignore next */ []));
|
|
2523
|
+
this.showResourceHeaders = input(true, /* @ts-ignore */
|
|
2524
|
+
...(ngDevMode ? [{ debugName: "showResourceHeaders" }] : /* istanbul ignore next */ []));
|
|
2525
|
+
this.date = input.required(/* @ts-ignore */
|
|
2526
|
+
...(ngDevMode ? [{ debugName: "date" }] : /* istanbul ignore next */ []));
|
|
2527
|
+
this.showUnassignedAppointments = input(true, /* @ts-ignore */
|
|
2528
|
+
...(ngDevMode ? [{ debugName: "showUnassignedAppointments" }] : /* istanbul ignore next */ []));
|
|
2529
|
+
this.selectedAppointmentId = input(null, /* @ts-ignore */
|
|
2530
|
+
...(ngDevMode ? [{ debugName: "selectedAppointmentId" }] : /* istanbul ignore next */ []));
|
|
2531
|
+
this.resources = input([], /* @ts-ignore */
|
|
2532
|
+
...(ngDevMode ? [{ debugName: "resources" }] : /* istanbul ignore next */ []));
|
|
2533
|
+
this.showCurrentTimeIndicator = input(true, /* @ts-ignore */
|
|
2534
|
+
...(ngDevMode ? [{ debugName: "showCurrentTimeIndicator" }] : /* istanbul ignore next */ []));
|
|
2535
|
+
this.scrollToCurrentTimeIndicator = input(false, /* @ts-ignore */
|
|
2536
|
+
...(ngDevMode ? [{ debugName: "scrollToCurrentTimeIndicator" }] : /* istanbul ignore next */ []));
|
|
2537
|
+
this.resourceTemplate = input(/* @ts-ignore */
|
|
2538
|
+
...(ngDevMode ? [undefined, { debugName: "resourceTemplate" }] : /* istanbul ignore next */ []));
|
|
2539
|
+
this.appointments = input([], /* @ts-ignore */
|
|
2540
|
+
...(ngDevMode ? [{ debugName: "appointments" }] : /* istanbul ignore next */ []));
|
|
2541
|
+
this.tooltipTemplate = input(/* @ts-ignore */
|
|
2542
|
+
...(ngDevMode ? [undefined, { debugName: "tooltipTemplate" }] : /* istanbul ignore next */ []));
|
|
2543
|
+
this.dragStartSlotId = signal(null, /* @ts-ignore */
|
|
2544
|
+
...(ngDevMode ? [{ debugName: "dragStartSlotId" }] : /* istanbul ignore next */ []));
|
|
2545
|
+
this.dragStartSlotResourceId = signal(null, /* @ts-ignore */
|
|
2546
|
+
...(ngDevMode ? [{ debugName: "dragStartSlotResourceId" }] : /* istanbul ignore next */ []));
|
|
2547
|
+
this.currentTimeLineElement = viewChild('currentTimeLine', /* @ts-ignore */
|
|
2548
|
+
...(ngDevMode ? [{ debugName: "currentTimeLineElement" }] : /* istanbul ignore next */ []));
|
|
2447
2549
|
this.processedDayData = computed(() => {
|
|
2448
2550
|
const allOriginalAppointments = this.appointments();
|
|
2449
2551
|
const monthStartDate = this.date().startOf('month');
|
|
@@ -2521,7 +2623,8 @@ class AXSchedulerTimelineMonthViewComponent extends NXComponent {
|
|
|
2521
2623
|
});
|
|
2522
2624
|
}
|
|
2523
2625
|
return result;
|
|
2524
|
-
},
|
|
2626
|
+
}, /* @ts-ignore */
|
|
2627
|
+
...(ngDevMode ? [{ debugName: "processedDayData" }] : /* istanbul ignore next */ []));
|
|
2525
2628
|
// Internal outputs to be caught by parent AXSchedulerComponent
|
|
2526
2629
|
this.slotClickedInternal = output();
|
|
2527
2630
|
this.slotDblClickedInternal = output();
|
|
@@ -2552,7 +2655,8 @@ class AXSchedulerTimelineMonthViewComponent extends NXComponent {
|
|
|
2552
2655
|
const resources = this.resources();
|
|
2553
2656
|
const showUnassigned = this.showUnassignedAppointments();
|
|
2554
2657
|
return this.schedulerService.filterAppointmentsByResources(allAppointments, resources, showUnassigned);
|
|
2555
|
-
},
|
|
2658
|
+
}, /* @ts-ignore */
|
|
2659
|
+
...(ngDevMode ? [{ debugName: "appointmentsByResource" }] : /* istanbul ignore next */ []));
|
|
2556
2660
|
/**
|
|
2557
2661
|
* Gets all resource IDs including unassigned if applicable.
|
|
2558
2662
|
*/
|
|
@@ -2560,7 +2664,8 @@ class AXSchedulerTimelineMonthViewComponent extends NXComponent {
|
|
|
2560
2664
|
const resources = this.resources();
|
|
2561
2665
|
const showUnassigned = this.showUnassignedAppointments();
|
|
2562
2666
|
return this.schedulerService.getAllResourceIds(resources, showUnassigned);
|
|
2563
|
-
},
|
|
2667
|
+
}, /* @ts-ignore */
|
|
2668
|
+
...(ngDevMode ? [{ debugName: "resourceIds" }] : /* istanbul ignore next */ []));
|
|
2564
2669
|
}
|
|
2565
2670
|
// --- Multi-day Appointment Detection ---
|
|
2566
2671
|
isMultiDayAppointment(appointment) {
|
|
@@ -2819,12 +2924,12 @@ class AXSchedulerTimelineMonthViewComponent extends NXComponent {
|
|
|
2819
2924
|
// Check if current time is on the same day as this day column
|
|
2820
2925
|
return now.isSame(dayDate, 'day');
|
|
2821
2926
|
}
|
|
2822
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2823
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXSchedulerTimelineMonthViewComponent, isStandalone: true, selector: "ax-scheduler-timeline-month-view", inputs: { readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, draggable: { classPropertyName: "draggable", publicName: "draggable", isSignal: true, isRequired: false, transformFunction: null }, hasActions: { classPropertyName: "hasActions", publicName: "hasActions", isSignal: true, isRequired: false, transformFunction: null }, dragStartDelay: { classPropertyName: "dragStartDelay", publicName: "dragStartDelay", isSignal: true, isRequired: false, transformFunction: null }, calendar: { classPropertyName: "calendar", publicName: "calendar", isSignal: true, isRequired: false, transformFunction: null }, showResourceHeaders: { classPropertyName: "showResourceHeaders", publicName: "showResourceHeaders", isSignal: true, isRequired: false, transformFunction: null }, date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: true, transformFunction: null }, showUnassignedAppointments: { classPropertyName: "showUnassignedAppointments", publicName: "showUnassignedAppointments", isSignal: true, isRequired: false, transformFunction: null }, selectedAppointmentId: { classPropertyName: "selectedAppointmentId", publicName: "selectedAppointmentId", isSignal: true, isRequired: false, transformFunction: null }, resources: { classPropertyName: "resources", publicName: "resources", isSignal: true, isRequired: false, transformFunction: null }, showCurrentTimeIndicator: { classPropertyName: "showCurrentTimeIndicator", publicName: "showCurrentTimeIndicator", isSignal: true, isRequired: false, transformFunction: null }, scrollToCurrentTimeIndicator: { classPropertyName: "scrollToCurrentTimeIndicator", publicName: "scrollToCurrentTimeIndicator", isSignal: true, isRequired: false, transformFunction: null }, resourceTemplate: { classPropertyName: "resourceTemplate", publicName: "resourceTemplate", isSignal: true, isRequired: false, transformFunction: null }, appointments: { classPropertyName: "appointments", publicName: "appointments", isSignal: true, isRequired: false, transformFunction: null }, tooltipTemplate: { classPropertyName: "tooltipTemplate", publicName: "tooltipTemplate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { slotClickedInternal: "slotClickedInternal", slotDblClickedInternal: "slotDblClickedInternal", slotRightClickedInternal: "slotRightClickedInternal", appointmentClickedInternal: "appointmentClickedInternal", appointmentDblClickedInternal: "appointmentDblClickedInternal", appointmentRightClickedInternal: "appointmentRightClickedInternal", onActionClickInternal: "onActionClickInternal", onAppointmentDropInternal: "onAppointmentDropInternal" }, host: { properties: { "class.ax-state-readonly": "readonly()" } }, providers: [{ provide: AXComponent, useExisting: AXSchedulerTimelineMonthViewComponent }], viewQueries: [{ propertyName: "currentTimeLineElement", first: true, predicate: ["currentTimeLine"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (resources().length === 0 || !showResourceHeaders()) {\n <!-- Original layout when no resources -->\n <div class=\"ax-scheduler-timeline-month-wrapper\">\n <!-- Spanning appointments layer -->\n @if (spanningAppointments().length > 0) {\n <div class=\"ax-scheduler-timeline-month-spanning-layer\" [style.--timeline-days-count]=\"processedDayData().length\">\n @for (spanning of spanningAppointments(); track spanning.appointment.id) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragData]=\"spanning.appointment\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || spanning.appointment.readonly || readonly()\"\n (pointerdown)=\"getSlotId($event)\"\n (click)=\"handleAppointmentEvent($event, spanning.appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, spanning.appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, spanning.appointment)\"\n [title]=\"\n tooltipTemplate()\n ? ''\n : spanning.appointment.title +\n ' (' +\n (spanning.appointment.startDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async) +\n ' - ' +\n (spanning.appointment.endDate | format: 'date' : { format: 'MMM d', calendar: calendar() } | async) +\n ')'\n \"\n class=\"ax-scheduler-timeline-spanning-appointment {{\n spanning.appointment.cssClass ??\n 'ax-scheduler-' + (spanning.appointment.priority ?? 'primary') + '-priority'\n }}\"\n [class.ax-spanning-start-clipped]=\"spanning.isStartClipped\"\n [class.ax-spanning-end-clipped]=\"spanning.isEndClipped\"\n [class.ax-state-active]=\"isActive(spanning.appointment.id)\"\n [style.grid-column]=\"spanning.startDayIndex + 1 + ' / span ' + spanning.spanCount\"\n [style.grid-row]=\"spanning.rowIndex + 1\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltip]=\"tooltipTemplate()\"\n [axTooltipContext]=\"spanning.appointment\"\n >\n <span class=\"ax-spanning-appointment-title\">\n <span class=\"ax-scheduler-truncate\">{{ spanning.appointment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, spanning.appointment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n ></ax-icon>\n }\n </span>\n </div>\n }\n </div>\n }\n\n <div class=\"ax-scheduler-timeline-month-container\">\n @for (dayData of processedDayData(); track dayData.date.date.getTime()) {\n <div>\n <div class=\"ax-scheduler-timeline-header\">\n <div\n [class.ax-state-today]=\"isToday(dayData.date)\"\n class=\"ax-scheduler-month-header-date-day {{\n dayData.holiday.state !== 'none' ? (dayData.holiday.holiday?.cssClass ?? 'ax-state-holiday') : ''\n }}\"\n [style.--ax-scheduler-holiday-color]=\"dayData.holiday.holiday?.color ?? null\"\n >\n <span\n class=\"ax-scheduler-month-header-date-day-char ax-scheduler-truncate\"\n [axTooltip]=\"(dayData.holiday.holiday?.description ?? dayData.holiday.holiday?.title ?? '') | translate | async\"\n >\n {{ dayData.date | format: 'date' : { format: 'dddd', calendar: calendar() } | async }}\n @if (dayData.holiday.state === 'holiday' && dayData.holiday.holiday.title) {\n ( {{ dayData.holiday.holiday.title | translate | async }} )\n }\n </span>\n <span class=\"ax-scheduler-month-header-date-day-num\">\n {{ dayData.date | format: 'date' : { format: 'DD', calendar: calendar() } | async }}\n </span>\n </div>\n </div>\n\n <div\n axDropZone\n #zone=\"axDropZone\"\n (onElementDrop)=\"handleDrop($event, dayData.date)\"\n [class.ax-scheduler-slot-hovered]=\"zone.isHovered()\"\n class=\"ax-scheduler-timeline-content\"\n (click)=\"handleSlotEvent($event, dayData.date)\"\n (dblclick)=\"handleSlotEvent($event, dayData.date)\"\n (contextmenu)=\"handleSlotEvent($event, dayData.date)\"\n [attr.data-slot-id]=\"dayData.date.format('YYYYMMDD')\"\n [style.--spanning-rows-count]=\"maxSpanningRows()\"\n >\n <!-- Current Time Line Indicator -->\n @if (\n showCurrentTimeIndicator() &&\n shouldShowCurrentTimeForDay(dayData.date) &&\n getCurrentTimePosition() !== null\n ) {\n <div\n class=\"ax-scheduler-current-time-line\"\n [style.inset-inline-start.%]=\"getCurrentTimePosition()\"\n #currentTimeLine\n ></div>\n }\n <div class=\"ax-scheduler-timeline-appointment-container\">\n @for (segment of dayData.visibleAppointments; track segment.id + segment.originalStartDate.getTime()) {\n <div\n axDrag\n [dragData]=\"segment\"\n [dragCursor]=\"'grab'\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || segment.readonly || readonly()\"\n (pointerdown)=\"getSlotId($event)\"\n (click)=\"handleAppointmentEvent($event, segment)\"\n (dblclick)=\"handleAppointmentEvent($event, segment)\"\n (contextmenu)=\"handleAppointmentEvent($event, segment)\"\n [title]=\"\n tooltipTemplate()\n ? ''\n : segment.title +\n ' (' +\n (segment.originalStartDate | format: 'time' : { calendar: calendar() } | async) +\n ' - ' +\n (segment.originalEndDate | format: 'time' : { calendar: calendar() } | async) +\n ')'\n \"\n class=\"ax-scheduler-timeline-appointment {{\n segment.cssClass ?? 'ax-scheduler-' + (segment.priority ?? 'primary') + '-priority'\n }}\"\n [class.ax-state-active]=\"isActive(segment.id)\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltip]=\"tooltipTemplate()\"\n [axTooltipContext]=\"segment\"\n >\n <ax-title>\n <span class=\"ax-scheduler-truncate\">{{ segment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, segment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n >\n </ax-icon>\n }\n </ax-title>\n <ax-subtitle>\n {{ segment.originalStartDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}\n -\n {{ segment.originalEndDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}\n </ax-subtitle>\n </div>\n }\n @if (dayData.moreCount > 0) {\n <div #moreAppointments class=\"ax-scheduler-month-overflow-badge\" (click)=\"$event.stopPropagation()\">\n +{{\n '@acorex:common.general.more-items' | translate: { params: { number: dayData.moreCount } } | async\n }}\n </div>\n <ax-popover [target]=\"moreAppointments\" placement=\"bottom-start\" trigger=\"click\">\n <div\n axDropZone\n [class.ax-state-readonly]=\"readonly()\"\n class=\"ax-scheduler-popover ax-scheduler-month-popover-appointment\"\n >\n @for (\n segment of dayData.hiddenAppointments;\n track segment.id + segment.originalStartDate.getTime()\n ) {\n <div\n axDrag\n [dragData]=\"segment\"\n [dragCursor]=\"'grab'\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || segment.readonly || readonly()\"\n (click)=\"handleAppointmentEvent($event, segment); $event.stopPropagation()\"\n (dblclick)=\"handleAppointmentEvent($event, segment); $event.stopPropagation()\"\n (contextmenu)=\"handleAppointmentEvent($event, segment); $event.stopPropagation()\"\n [title]=\"\n tooltipTemplate()\n ? ''\n : segment.title +\n ' (' +\n (segment.originalStartDate | format: 'time' : { calendar: calendar() } | async) +\n ' - ' +\n (segment.originalEndDate | format: 'time' : { calendar: calendar() } | async) +\n ')'\n \"\n class=\"ax-scheduler-popover-appointment {{\n segment.cssClass ?? 'ax-scheduler-' + (segment.priority ?? 'primary') + '-priority'\n }}\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltip]=\"tooltipTemplate()\"\n [axTooltipContext]=\"segment\"\n >\n <ax-title>\n <span class=\"ax-scheduler-truncate\">{{ segment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, segment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n >\n </ax-icon>\n }\n </ax-title>\n <ax-subtitle>\n {{\n segment.originalStartDate\n | format: 'time' : { format: 'HH:mm', calendar: calendar() }\n | async\n }}\n -\n {{\n segment.originalEndDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async\n }}\n </ax-subtitle>\n </div>\n }\n </div>\n </ax-popover>\n }\n </div>\n </div>\n </div>\n }\n </div>\n </div>\n} @else {\n <!-- Resource-based layout with sticky resources -->\n <div class=\"ax-scheduler-timeline-month-resource-container\">\n <!-- Sticky header with resource placeholder and day headers -->\n @if (showResourceHeaders()) {\n <div class=\"ax-scheduler-timeline-month-header-sticky\">\n <div class=\"ax-scheduler-timeline-month-resource-header-placeholder\"><span>Resources</span></div>\n @for (dayData of processedDayData(); track dayData.date.date.getTime()) {\n <div class=\"ax-scheduler-timeline-month-day-header\">\n <div\n [class.ax-state-today]=\"isToday(dayData.date)\"\n class=\"ax-scheduler-month-header-date-day {{\n dayData.holiday?.state !== 'none' ? (dayData.holiday?.holiday?.cssClass ?? 'ax-state-holiday') : ''\n }}\"\n [style.--ax-scheduler-holiday-color]=\"dayData.holiday?.holiday?.color ?? null\"\n >\n <span\n class=\"ax-scheduler-month-header-date-day-char ax-scheduler-truncate\"\n [axTooltip]=\"(dayData.holiday?.holiday?.description ?? dayData.holiday?.holiday?.title ?? '') | translate | async\"\n >\n {{ dayData.date | format: 'date' : { format: 'dddd', calendar: calendar() } | async }}\n @if (dayData.holiday?.state === 'holiday' && dayData.holiday?.holiday?.title) {\n ( {{ dayData.holiday.holiday.title | translate | async }} )\n }\n </span>\n <span class=\"ax-scheduler-month-header-date-day-num\">\n {{ dayData.date | format: 'date' : { format: 'DD', calendar: calendar() } | async }}\n </span>\n </div>\n </div>\n }\n </div>\n }\n\n <!-- Resource rows with sticky resource headers -->\n <div class=\"ax-scheduler-timeline-month-resource-rows\">\n <!-- Current Time Line Indicator -->\n @if (showCurrentTimeIndicator() && getCurrentTimePosition() !== null) {\n <div\n class=\"ax-scheduler-current-time-line\"\n [style.inset-inline-start.%]=\"getCurrentTimePosition()\"\n #currentTimeLine\n ></div>\n }\n\n @for (resourceId of resourceIds(); track resourceId) {\n <div\n class=\"ax-scheduler-timeline-month-resource-row\"\n [style.--resource-spanning-rows-count]=\"getMaxSpanningRowsForResource(resourceId)\"\n >\n @if (showResourceHeaders()) {\n <!-- Sticky Resource Header -->\n <div class=\"ax-scheduler-timeline-month-resource-header ax-scheduler-timeline-month-resource-header-sticky\">\n @if (resourceTemplate() && typeof resourceTemplate() !== 'string') {\n <ng-container\n [ngTemplateOutlet]=\"$any(resourceTemplate())\"\n [ngTemplateOutletContext]=\"{\n $implicit: getResourceContext(resourceId),\n resource: getResourceContext(resourceId),\n resourceId: resourceId,\n }\"\n ></ng-container>\n } @else {\n <span class=\"ax-scheduler-timeline-month-resource-title\">{{ getResourceTitle(resourceId) }}</span>\n }\n </div>\n }\n\n <!-- Resource Content -->\n <div class=\"ax-scheduler-timeline-month-resource-content\">\n <!-- Spanning appointments layer for this resource -->\n @if (getSpanningAppointmentsForResource(resourceId).length > 0) {\n <div\n class=\"ax-scheduler-timeline-resource-spanning-layer\"\n [style.--timeline-days-count]=\"processedDayData().length\"\n >\n @for (spanning of getSpanningAppointmentsForResource(resourceId); track spanning.appointment.id) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragData]=\"spanning.appointment\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || spanning.appointment.readonly || readonly()\"\n (pointerdown)=\"getSlotId($event)\"\n (click)=\"handleAppointmentEvent($event, spanning.appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, spanning.appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, spanning.appointment)\"\n [title]=\"\n tooltipTemplate()\n ? ''\n : spanning.appointment.title +\n ' (' +\n (spanning.appointment.startDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async) +\n ' - ' +\n (spanning.appointment.endDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async) +\n ')'\n \"\n class=\"ax-scheduler-timeline-spanning-appointment {{\n spanning.appointment.cssClass ??\n 'ax-scheduler-' + (spanning.appointment.priority ?? 'primary') + '-priority'\n }}\"\n [class.ax-spanning-start-clipped]=\"spanning.isStartClipped\"\n [class.ax-spanning-end-clipped]=\"spanning.isEndClipped\"\n [class.ax-state-active]=\"isActive(spanning.appointment.id)\"\n [style.grid-column]=\"spanning.startDayIndex + 1 + ' / span ' + spanning.spanCount\"\n [style.grid-row]=\"spanning.rowIndex + 1\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltip]=\"tooltipTemplate()\"\n [axTooltipContext]=\"spanning.appointment\"\n >\n <span class=\"ax-spanning-appointment-title\">\n <span class=\"ax-scheduler-truncate\">{{ spanning.appointment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, spanning.appointment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n ></ax-icon>\n }\n </span>\n </div>\n }\n </div>\n }\n\n @for (dayData of processedDayData(); track dayData.date.date.getTime()) {\n <div\n axDropZone\n #zone=\"axDropZone\"\n (onElementDrop)=\"handleDrop($event, dayData.date, resourceId)\"\n [class.ax-scheduler-slot-hovered]=\"zone.isHovered()\"\n class=\"ax-scheduler-timeline-content\"\n (click)=\"handleSlotEvent($event, dayData.date)\"\n (dblclick)=\"handleSlotEvent($event, dayData.date)\"\n (contextmenu)=\"handleSlotEvent($event, dayData.date)\"\n [attr.data-slot-id]=\"dayData.date.format('YYYYMMDD')\"\n [attr.data-resource-id]=\"resourceId\"\n [style.--spanning-rows-count]=\"getMaxSpanningRowsForResource(resourceId)\"\n >\n <div class=\"ax-scheduler-timeline-appointment-container\">\n @for (\n segment of getAppointmentsForResourceAndDay(resourceId, dayData).visible;\n track segment.id + segment.originalStartDate.getTime()\n ) {\n <div\n axDrag\n [dragData]=\"segment\"\n [dragCursor]=\"'grab'\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || segment.readonly || readonly()\"\n (pointerdown)=\"getSlotId($event)\"\n (click)=\"handleAppointmentEvent($event, segment)\"\n (dblclick)=\"handleAppointmentEvent($event, segment)\"\n (contextmenu)=\"handleAppointmentEvent($event, segment)\"\n [title]=\"\n tooltipTemplate()\n ? ''\n : segment.allDay\n ? segment.title +\n ' (' +\n (segment.originalStartDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async) +\n ' - ' +\n (segment.originalEndDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async) +\n ')'\n : segment.title +\n ' (' +\n (segment.originalStartDate | format: 'time' : { calendar: calendar() } | async) +\n ' - ' +\n (segment.originalEndDate | format: 'time' : { calendar: calendar() } | async) +\n ')'\n \"\n class=\"ax-scheduler-timeline-appointment {{\n segment.cssClass ?? 'ax-scheduler-' + (segment.priority ?? 'primary') + '-priority'\n }}\"\n [class.all-day-segment]=\"segment.allDay\"\n [class.ax-state-active]=\"isActive(segment.id)\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltip]=\"tooltipTemplate()\"\n [axTooltipContext]=\"segment\"\n >\n <ax-title>\n <span class=\"ax-scheduler-truncate\">{{ segment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, segment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n >\n </ax-icon>\n }\n </ax-title>\n <ax-subtitle>\n @if (segment.allDay) {\n {{\n segment.originalStartDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async\n }}\n @if (segment.originalStartDate.getTime() !== segment.originalEndDate.getTime()) {\n -\n {{\n segment.originalEndDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async\n }}\n }\n } @else {\n {{\n segment.originalStartDate\n | format: 'time' : { format: 'HH:mm', calendar: calendar() }\n | async\n }}\n -\n {{\n segment.originalEndDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async\n }}\n }\n </ax-subtitle>\n </div>\n }\n @if (getAppointmentsForResourceAndDay(resourceId, dayData).moreCount > 0) {\n <div #moreAppointments class=\"ax-scheduler-month-overflow-badge\" (click)=\"$event.stopPropagation()\">\n +{{\n '@acorex:common.general.more-items'\n | translate\n : { params: { number: getAppointmentsForResourceAndDay(resourceId, dayData).moreCount } }\n | async\n }}\n </div>\n <ax-popover [target]=\"moreAppointments\" placement=\"bottom-start\" trigger=\"click\">\n <div\n axDropZone\n [class.ax-state-readonly]=\"readonly()\"\n class=\"ax-scheduler-popover ax-scheduler-month-popover-appointment\"\n >\n @for (\n segment of getAppointmentsForResourceAndDay(resourceId, dayData).hidden;\n track segment.id + segment.originalStartDate.getTime()\n ) {\n <div\n axDrag\n [dragData]=\"segment\"\n [dragCursor]=\"'grab'\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || segment.readonly || readonly()\"\n (click)=\"handleAppointmentEvent($event, segment); $event.stopPropagation()\"\n (dblclick)=\"handleAppointmentEvent($event, segment); $event.stopPropagation()\"\n (contextmenu)=\"handleAppointmentEvent($event, segment); $event.stopPropagation()\"\n [title]=\"\n tooltipTemplate()\n ? ''\n : segment.allDay\n ? segment.title +\n ' (' +\n (segment.originalStartDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async) +\n ' - ' +\n (segment.originalEndDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async) +\n ')'\n : segment.title +\n ' (' +\n (segment.originalStartDate | format: 'time' : { calendar: calendar() } | async) +\n ' - ' +\n (segment.originalEndDate | format: 'time' : { calendar: calendar() } | async) +\n ')'\n \"\n class=\"ax-scheduler-popover-appointment {{\n segment.cssClass ?? 'ax-scheduler-' + (segment.priority ?? 'primary') + '-priority'\n }}\"\n [class.all-day-segment]=\"segment.allDay\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltip]=\"tooltipTemplate()\"\n [axTooltipContext]=\"segment\"\n >\n <ax-title>\n <span class=\"ax-scheduler-truncate\">{{ segment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, segment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n >\n </ax-icon>\n }\n </ax-title>\n <ax-subtitle>\n @if (segment.allDay) {\n {{\n segment.originalStartDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async\n }}\n @if (segment.originalStartDate.getTime() !== segment.originalEndDate.getTime()) {\n -\n {{\n segment.originalEndDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async\n }}\n }\n } @else {\n {{\n segment.originalStartDate\n | format: 'time' : { format: 'HH:mm', calendar: calendar() }\n | async\n }}\n -\n {{\n segment.originalEndDate\n | format: 'time' : { format: 'HH:mm', calendar: calendar() }\n | async\n }}\n }\n </ax-subtitle>\n </div>\n }\n </div>\n </ax-popover>\n }\n </div>\n </div>\n }\n </div>\n </div>\n }\n </div>\n </div>\n}\n", styles: ["@layer properties;@layer components{ax-scheduler-timeline-month-view{--ax-scheduler-timeline-spanning-row-height: 1.5rem;--ax-scheduler-timeline-spanning-gap: .125rem;position:relative;display:inline-flex;height:100%;flex-direction:column;background-color:inherit}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-wrapper{position:relative;display:flex;height:100%;flex-direction:column}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-spanning-layer{pointer-events:none;position:absolute;inset-inline-start:calc(var(--spacing, .25rem) * 0);inset-inline-end:calc(var(--spacing, .25rem) * 0);top:calc(var(--spacing, .25rem) * 16);z-index:5;display:grid;align-content:flex-start;padding-inline:calc(var(--spacing, .25rem) * .5);padding-block:calc(var(--spacing, .25rem) * 1);row-gap:var(--ax-scheduler-timeline-spanning-gap);grid-auto-rows:var(--ax-scheduler-timeline-spanning-row-height);grid-template-columns:repeat(var(--timeline-days-count, 31),var( --ax-comp-scheduler-timeline-month-view-blocks-width, calc(var(--ax-comp-scheduler-timeline-view-blocks-width) / 2) ))}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-spanning-layer .ax-scheduler-timeline-spanning-appointment{z-index:6;display:flex;cursor:pointer;align-items:center;overflow:hidden;text-overflow:ellipsis;border-radius:var(--radius-sm, .25rem);padding-inline:calc(var(--spacing, .25rem) * 1);padding-block:calc(var(--spacing, .25rem) * .5);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));white-space:nowrap;margin-inline:.125rem;pointer-events:auto}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-spanning-layer .ax-scheduler-timeline-spanning-appointment .ax-spanning-appointment-title{display:flex;height:100%;width:100%;align-items:center;justify-content:space-between;padding-inline:calc(var(--spacing, .25rem) * 2)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-spanning-layer .ax-scheduler-timeline-spanning-appointment .ax-spanning-appointment-title .ax-scheduler-truncate{min-width:calc(var(--spacing, .25rem) * 0);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-spanning-layer .ax-scheduler-timeline-spanning-appointment .ax-spanning-appointment-title .ax-scheduler-action-icon{margin-inline-start:calc(var(--spacing, .25rem) * 1);width:auto;flex-shrink:0;cursor:pointer}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-start-clipped{position:relative;border-start-start-radius:0;border-end-start-radius:0;margin-inline-start:0}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-start-clipped:before{content:\"\\2190 \";position:absolute;top:calc(var(--spacing, .25rem) * .5);font-size:.65rem;opacity:70%;inset-inline-start:0}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-end-clipped{position:relative;border-start-end-radius:0;border-end-end-radius:0;margin-inline-end:0}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-end-clipped:after{content:\" \\2192\";position:absolute;top:calc(var(--spacing, .25rem) * .5);font-size:.65rem;opacity:70%;inset-inline-end:0}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container{display:flex;height:100%}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-header{display:flex;width:100%;background-color:var(--ax-comp-scheduler-all-day-bg,inherit)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-header .ax-scheduler-month-header-date-day{position:relative;display:flex;height:calc(var(--spacing, .25rem) * 16);width:var(--ax-comp-scheduler-timeline-month-view-blocks-width,calc(var(--ax-comp-scheduler-timeline-view-blocks-width) / 2));flex-direction:column;align-items:flex-start;justify-content:center;gap:calc(var(--spacing, .25rem) * 1);border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 1)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-header .ax-scheduler-month-header-date-day.ax-state-today{background-color:rgba(var(--ax-sys-color-primary-surface));color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-header .ax-scheduler-month-header-date-day.ax-state-today{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 5%,transparent)}}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-header .ax-scheduler-month-header-date-day.ax-state-today .ax-scheduler-month-header-date-day-char{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-header .ax-scheduler-month-header-date-day.ax-state-today .ax-scheduler-month-header-date-day-num{--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-header .ax-scheduler-month-header-date-day.ax-state-holiday{color:var(--ax-scheduler-holiday-color, rgba(var(--ax-sys-color-danger-surface)))}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-header .ax-scheduler-month-header-date-day.ax-state-holiday.ax-state-today{color:rgba(var(--ax-sys-color-primary-surface))}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-header .ax-scheduler-month-header-date-day .ax-scheduler-month-header-date-day-char{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 4);max-width:100%;--tw-leading: calc(var(--spacing, .25rem) * 4);line-height:calc(var(--spacing, .25rem) * 4);--tw-font-weight: var(--font-weight-light, 300);font-weight:var(--font-weight-light, 300)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-header .ax-scheduler-month-header-date-day .ax-scheduler-month-header-date-day-num{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 4);font-size:var(--text-xl, 1.25rem);line-height:var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-content{position:relative;height:calc(100% - 4rem);width:var(--ax-comp-scheduler-timeline-month-view-blocks-width,calc(var(--ax-comp-scheduler-timeline-view-blocks-width) / 2));border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));padding:calc(var(--spacing, .25rem) * 1);padding-top:calc(var(--spanning-rows-count, 0) * (var(--ax-scheduler-timeline-spanning-row-height) + var(--ax-scheduler-timeline-spanning-gap)) + .25rem)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container{display:flex;flex-direction:column;gap:var(--ax-comp-scheduler-timeline-month-gap-height,.125rem)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container .ax-scheduler-timeline-appointment{display:flex;min-height:calc(var(--spacing, .25rem) * 10);width:100%;flex-direction:column;overflow:hidden;border-radius:calc(var(--ax-sys-border-radius) / 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container .ax-scheduler-month-overflow-badge{margin-top:calc(var(--spacing, .25rem) * .5);cursor:pointer;padding-inline:calc(var(--spacing, .25rem) * 0);padding-block:calc(var(--spacing, .25rem) * .5);text-align:start;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container .ax-scheduler-month-overflow-badge:hover{text-decoration-line:underline}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container{position:relative;display:flex;height:100%;flex-direction:column;background-color:inherit}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-header-sticky{position:sticky;top:calc(var(--spacing, .25rem) * 0);z-index:10;display:flex;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-header-sticky .ax-scheduler-timeline-month-resource-header-placeholder{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 0);z-index:15;display:flex;width:var(--ax-comp-scheduler-resource-header-width,8rem);min-width:var(--ax-comp-scheduler-resource-header-width,8rem);align-items:center;justify-content:center;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit;padding:calc(var(--spacing, .25rem) * 2);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-header-sticky .ax-scheduler-timeline-month-day-header{display:flex;flex:1;background-color:inherit}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-header-sticky .ax-scheduler-timeline-month-day-header .ax-scheduler-month-header-date-day{position:relative;display:flex;height:calc(var(--spacing, .25rem) * 16);width:var(--ax-comp-scheduler-timeline-month-view-blocks-width,calc(var(--ax-comp-scheduler-timeline-view-blocks-width) / 2));min-width:var(--ax-comp-scheduler-timeline-month-view-blocks-width,calc(var(--ax-comp-scheduler-timeline-view-blocks-width) / 2));flex-direction:column;align-items:flex-start;justify-content:center;gap:calc(var(--spacing, .25rem) * 1);border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 1)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-header-sticky .ax-scheduler-timeline-month-day-header .ax-scheduler-month-header-date-day.ax-state-today{background-color:rgba(var(--ax-sys-color-primary-surface));color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-header-sticky .ax-scheduler-timeline-month-day-header .ax-scheduler-month-header-date-day.ax-state-today{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 5%,transparent)}}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-header-sticky .ax-scheduler-timeline-month-day-header .ax-scheduler-month-header-date-day.ax-state-today .ax-scheduler-month-header-date-day-char{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-header-sticky .ax-scheduler-timeline-month-day-header .ax-scheduler-month-header-date-day.ax-state-today .ax-scheduler-month-header-date-day-num{--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-header-sticky .ax-scheduler-timeline-month-day-header .ax-scheduler-month-header-date-day.ax-state-holiday{color:var(--ax-scheduler-holiday-color, rgba(var(--ax-sys-color-danger-surface)))}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-header-sticky .ax-scheduler-timeline-month-day-header .ax-scheduler-month-header-date-day.ax-state-holiday.ax-state-today{color:rgba(var(--ax-sys-color-primary-surface))}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-header-sticky .ax-scheduler-timeline-month-day-header .ax-scheduler-month-header-date-day .ax-scheduler-month-header-date-day-char{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 4);max-width:100%;--tw-leading: calc(var(--spacing, .25rem) * 4);line-height:calc(var(--spacing, .25rem) * 4);--tw-font-weight: var(--font-weight-light, 300);font-weight:var(--font-weight-light, 300)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-header-sticky .ax-scheduler-timeline-month-day-header .ax-scheduler-month-header-date-day .ax-scheduler-month-header-date-day-num{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 4);font-size:var(--text-xl, 1.25rem);line-height:var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows{position:relative;flex:1;overflow:visible;background-color:inherit}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows .ax-scheduler-timeline-month-resource-row{display:flex;width:max-content;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit;min-height:calc(var(--resource-spanning-rows-count, 0) * (var(--ax-scheduler-timeline-spanning-row-height) + var(--ax-scheduler-timeline-spanning-gap)) + var(--ax-comp-scheduler-timeline-month-row-base-height, 5rem))}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows .ax-scheduler-timeline-month-resource-row .ax-scheduler-timeline-month-resource-header{display:flex;width:var(--ax-comp-scheduler-resource-header-width,8rem);min-width:var(--ax-comp-scheduler-resource-header-width,8rem);align-items:center;justify-content:center;align-self:stretch;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit;padding:calc(var(--spacing, .25rem) * 2)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows .ax-scheduler-timeline-month-resource-row .ax-scheduler-timeline-month-resource-header.ax-scheduler-timeline-month-resource-header-sticky{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 0);z-index:9;background-color:inherit}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows .ax-scheduler-timeline-month-resource-row .ax-scheduler-timeline-month-resource-header .ax-scheduler-timeline-month-resource-title{text-align:center;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);overflow-wrap:break-word}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows .ax-scheduler-timeline-month-resource-row .ax-scheduler-timeline-month-resource-content{position:relative;display:flex;flex:1;background-color:inherit}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows .ax-scheduler-timeline-month-resource-row .ax-scheduler-timeline-month-resource-content .ax-scheduler-timeline-resource-spanning-layer{pointer-events:none;position:absolute;inset-inline-start:calc(var(--spacing, .25rem) * 0);inset-inline-end:calc(var(--spacing, .25rem) * 0);top:calc(var(--spacing, .25rem) * 0);z-index:5;display:grid;align-content:flex-start;padding-inline:calc(var(--spacing, .25rem) * .5);padding-block:calc(var(--spacing, .25rem) * 1);row-gap:var(--ax-scheduler-timeline-spanning-gap);grid-auto-rows:var(--ax-scheduler-timeline-spanning-row-height);grid-template-columns:repeat(var(--timeline-days-count, 31),var( --ax-comp-scheduler-timeline-month-view-blocks-width, calc(var(--ax-comp-scheduler-timeline-view-blocks-width) / 2) ))}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows .ax-scheduler-timeline-month-resource-row .ax-scheduler-timeline-month-resource-content .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment{z-index:6;display:flex;cursor:pointer;align-items:center;overflow:hidden;text-overflow:ellipsis;border-radius:var(--radius-sm, .25rem);padding-inline:calc(var(--spacing, .25rem) * 1);padding-block:calc(var(--spacing, .25rem) * .5);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));white-space:nowrap;margin-inline:.125rem;pointer-events:auto}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows .ax-scheduler-timeline-month-resource-row .ax-scheduler-timeline-month-resource-content .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment .ax-spanning-appointment-title{display:flex;height:100%;width:100%;align-items:center;justify-content:space-between;padding-inline:calc(var(--spacing, .25rem) * 2)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows .ax-scheduler-timeline-month-resource-row .ax-scheduler-timeline-month-resource-content .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment .ax-spanning-appointment-title .ax-scheduler-truncate{min-width:calc(var(--spacing, .25rem) * 0);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows .ax-scheduler-timeline-month-resource-row .ax-scheduler-timeline-month-resource-content .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment .ax-spanning-appointment-title .ax-scheduler-action-icon{margin-inline-start:calc(var(--spacing, .25rem) * 1);width:auto;flex-shrink:0;cursor:pointer}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows .ax-scheduler-timeline-month-resource-row .ax-scheduler-timeline-month-resource-content .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-start-clipped{position:relative;border-start-start-radius:0;border-end-start-radius:0;margin-inline-start:0}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows .ax-scheduler-timeline-month-resource-row .ax-scheduler-timeline-month-resource-content .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-start-clipped:before{content:\"\\2190 \";position:absolute;top:calc(var(--spacing, .25rem) * .5);font-size:.65rem;opacity:70%;inset-inline-start:0}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows .ax-scheduler-timeline-month-resource-row .ax-scheduler-timeline-month-resource-content .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-end-clipped{position:relative;border-start-end-radius:0;border-end-end-radius:0;margin-inline-end:0}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows .ax-scheduler-timeline-month-resource-row .ax-scheduler-timeline-month-resource-content .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-end-clipped:after{content:\" \\2192\";position:absolute;top:calc(var(--spacing, .25rem) * .5);font-size:.65rem;opacity:70%;inset-inline-end:0}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows .ax-scheduler-timeline-month-resource-row .ax-scheduler-timeline-month-resource-content .ax-scheduler-timeline-content{position:relative;display:flex;width:var(--ax-comp-scheduler-timeline-month-view-blocks-width,calc(var(--ax-comp-scheduler-timeline-view-blocks-width) / 2));min-width:var(--ax-comp-scheduler-timeline-month-view-blocks-width,calc(var(--ax-comp-scheduler-timeline-view-blocks-width) / 2));flex-direction:column;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit;padding-bottom:calc(var(--spacing, .25rem) * 1);padding-top:calc(var(--spanning-rows-count, 0) * (var(--ax-scheduler-timeline-spanning-row-height) + var(--ax-scheduler-timeline-spanning-gap)) + .25rem)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows .ax-scheduler-timeline-month-resource-row .ax-scheduler-timeline-month-resource-content .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container{display:flex;width:100%;flex-direction:column;gap:var(--ax-comp-scheduler-timeline-month-gap-height,.125rem);padding-inline:calc(var(--spacing, .25rem) * 1)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows .ax-scheduler-timeline-month-resource-row .ax-scheduler-timeline-month-resource-content .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container .ax-scheduler-timeline-appointment{display:flex;min-height:calc(var(--spacing, .25rem) * 10);width:100%;flex-shrink:0;flex-direction:column;overflow:hidden;border-radius:calc(var(--ax-sys-border-radius) / 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows .ax-scheduler-timeline-month-resource-row .ax-scheduler-timeline-month-resource-content .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container .ax-scheduler-month-overflow-badge{margin-top:calc(var(--spacing, .25rem) * .5);flex-shrink:0;cursor:pointer;padding-inline:calc(var(--spacing, .25rem) * 0);padding-block:calc(var(--spacing, .25rem) * .5);text-align:start;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows .ax-scheduler-timeline-month-resource-row .ax-scheduler-timeline-month-resource-content .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container .ax-scheduler-month-overflow-badge:hover{text-decoration-line:underline}ax-scheduler-timeline-month-view:not(.ax-state-readonly) .ax-scheduler-timeline-appointment{cursor:pointer}ax-scheduler-timeline-month-view:not(.ax-state-readonly) .ax-scheduler-timeline-content{cursor:pointer;transition-property:background-color;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));transition-duration:var(--ax-sys-transition-duration);transition-timing-function:var(--ax-sys-transition-timing-function)}ax-scheduler-timeline-month-view:not(.ax-state-readonly) .ax-scheduler-timeline-content:hover{background-color:rgba(var(--ax-comp-scheduler-slot-hover-bg,var(--ax-sys-color-primary-surface),.1))}ax-scheduler-timeline-month-view ax-title{display:flex;justify-content:space-between}ax-scheduler-timeline-month-view ax-title .ax-scheduler-action-icon{width:auto;cursor:pointer}ax-scheduler-timeline-month-view .ax-scheduler-current-time-line{top:calc(var(--spacing, .25rem) * 0);bottom:calc(var(--spacing, .25rem) * 0);width:calc(var(--spacing, .25rem) * .5)}ax-scheduler-timeline-month-view .ax-scheduler-current-time-line:before{content:var(--tw-content);inset-inline-start:-5px}ax-scheduler-timeline-month-view .ax-scheduler-current-time-line:before{content:var(--tw-content);top:calc(var(--spacing, .25rem) * -1.5)}ax-scheduler.ax-rtl ax-scheduler-timeline-month-view .ax-scheduler-timeline-spanning-appointment.ax-spanning-start-clipped:before{content:\"\\2192 \"}ax-scheduler.ax-rtl ax-scheduler-timeline-month-view .ax-scheduler-timeline-spanning-appointment.ax-spanning-end-clipped:after{content:\" \\2190\"}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-content{syntax: \"*\"; initial-value: \"\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial;--tw-leading: initial;--tw-content: \"\"}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: AXDragDirective, selector: "[axDrag]", inputs: ["axDrag", "dragData", "dragDisabled", "dragTransition", "dragElementClone", "dropZoneGroup", "dragStartDelay", "dragResetOnDblClick", "dragLockAxis", "dragClonedTemplate", "dragCursor", "dragBoundary", "dragTransitionDuration"], outputs: ["dragPositionChanged"] }, { kind: "component", type: AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disablePanelClass", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "closeOnScroll", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "directive", type: AXTooltipDirective, selector: "[axTooltip]", inputs: ["axTooltipDisabled", "axTooltip", "axTooltipContext", "axTooltipPlacement", "axTooltipOffsetX", "axTooltipOffsetY", "axTooltipOpenAfter", "axTooltipCloseAfter"] }, { kind: "directive", type: AXDropZoneDirective, selector: "[axDropZone]", inputs: ["dropZoneGroup"], outputs: ["onElementDrop", "onElementHover"], exportAs: ["axDropZone"] }, { kind: "component", type: AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXFormatPipe, name: "format" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
2927
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXSchedulerTimelineMonthViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
2928
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXSchedulerTimelineMonthViewComponent, isStandalone: true, selector: "ax-scheduler-timeline-month-view", inputs: { readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, draggable: { classPropertyName: "draggable", publicName: "draggable", isSignal: true, isRequired: false, transformFunction: null }, hasActions: { classPropertyName: "hasActions", publicName: "hasActions", isSignal: true, isRequired: false, transformFunction: null }, dragStartDelay: { classPropertyName: "dragStartDelay", publicName: "dragStartDelay", isSignal: true, isRequired: false, transformFunction: null }, calendar: { classPropertyName: "calendar", publicName: "calendar", isSignal: true, isRequired: false, transformFunction: null }, showResourceHeaders: { classPropertyName: "showResourceHeaders", publicName: "showResourceHeaders", isSignal: true, isRequired: false, transformFunction: null }, date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: true, transformFunction: null }, showUnassignedAppointments: { classPropertyName: "showUnassignedAppointments", publicName: "showUnassignedAppointments", isSignal: true, isRequired: false, transformFunction: null }, selectedAppointmentId: { classPropertyName: "selectedAppointmentId", publicName: "selectedAppointmentId", isSignal: true, isRequired: false, transformFunction: null }, resources: { classPropertyName: "resources", publicName: "resources", isSignal: true, isRequired: false, transformFunction: null }, showCurrentTimeIndicator: { classPropertyName: "showCurrentTimeIndicator", publicName: "showCurrentTimeIndicator", isSignal: true, isRequired: false, transformFunction: null }, scrollToCurrentTimeIndicator: { classPropertyName: "scrollToCurrentTimeIndicator", publicName: "scrollToCurrentTimeIndicator", isSignal: true, isRequired: false, transformFunction: null }, resourceTemplate: { classPropertyName: "resourceTemplate", publicName: "resourceTemplate", isSignal: true, isRequired: false, transformFunction: null }, appointments: { classPropertyName: "appointments", publicName: "appointments", isSignal: true, isRequired: false, transformFunction: null }, tooltipTemplate: { classPropertyName: "tooltipTemplate", publicName: "tooltipTemplate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { slotClickedInternal: "slotClickedInternal", slotDblClickedInternal: "slotDblClickedInternal", slotRightClickedInternal: "slotRightClickedInternal", appointmentClickedInternal: "appointmentClickedInternal", appointmentDblClickedInternal: "appointmentDblClickedInternal", appointmentRightClickedInternal: "appointmentRightClickedInternal", onActionClickInternal: "onActionClickInternal", onAppointmentDropInternal: "onAppointmentDropInternal" }, host: { properties: { "class.ax-state-readonly": "readonly()" } }, providers: [{ provide: AXComponent, useExisting: AXSchedulerTimelineMonthViewComponent }], viewQueries: [{ propertyName: "currentTimeLineElement", first: true, predicate: ["currentTimeLine"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (resources().length === 0 || !showResourceHeaders()) {\n <!-- Original layout when no resources -->\n <div class=\"ax-scheduler-timeline-month-wrapper\">\n <!-- Spanning appointments layer -->\n @if (spanningAppointments().length > 0) {\n <div class=\"ax-scheduler-timeline-month-spanning-layer\" [style.--timeline-days-count]=\"processedDayData().length\">\n @for (spanning of spanningAppointments(); track spanning.appointment.id) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragData]=\"spanning.appointment\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || spanning.appointment.readonly || readonly()\"\n (pointerdown)=\"getSlotId($event)\"\n (click)=\"handleAppointmentEvent($event, spanning.appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, spanning.appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, spanning.appointment)\"\n [title]=\"\n tooltipTemplate()\n ? ''\n : spanning.appointment.title +\n ' (' +\n (spanning.appointment.startDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async) +\n ' - ' +\n (spanning.appointment.endDate | format: 'date' : { format: 'MMM d', calendar: calendar() } | async) +\n ')'\n \"\n class=\"ax-scheduler-timeline-spanning-appointment {{\n spanning.appointment.cssClass ??\n 'ax-scheduler-' + (spanning.appointment.priority ?? 'primary') + '-priority'\n }}\"\n [class.ax-spanning-start-clipped]=\"spanning.isStartClipped\"\n [class.ax-spanning-end-clipped]=\"spanning.isEndClipped\"\n [class.ax-state-active]=\"isActive(spanning.appointment.id)\"\n [style.grid-column]=\"spanning.startDayIndex + 1 + ' / span ' + spanning.spanCount\"\n [style.grid-row]=\"spanning.rowIndex + 1\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltip]=\"tooltipTemplate()\"\n [axTooltipContext]=\"spanning.appointment\"\n >\n <span class=\"ax-spanning-appointment-title\">\n <span class=\"ax-scheduler-truncate\">{{ spanning.appointment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, spanning.appointment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n ></ax-icon>\n }\n </span>\n </div>\n }\n </div>\n }\n\n <div class=\"ax-scheduler-timeline-month-container\">\n @for (dayData of processedDayData(); track dayData.date.date.getTime()) {\n <div>\n <div class=\"ax-scheduler-timeline-header\">\n <div\n [class.ax-state-today]=\"isToday(dayData.date)\"\n class=\"ax-scheduler-month-header-date-day {{\n dayData.holiday.state !== 'none' ? (dayData.holiday.holiday?.cssClass ?? 'ax-state-holiday') : ''\n }}\"\n [style.--ax-scheduler-holiday-color]=\"dayData.holiday.holiday?.color ?? null\"\n >\n <span\n class=\"ax-scheduler-month-header-date-day-char ax-scheduler-truncate\"\n [axTooltip]=\"(dayData.holiday.holiday?.description ?? dayData.holiday.holiday?.title ?? '') | translate | async\"\n >\n {{ dayData.date | format: 'date' : { format: 'dddd', calendar: calendar() } | async }}\n @if (dayData.holiday.state === 'holiday' && dayData.holiday.holiday.title) {\n ( {{ dayData.holiday.holiday.title | translate | async }} )\n }\n </span>\n <span class=\"ax-scheduler-month-header-date-day-num\">\n {{ dayData.date | format: 'date' : { format: 'DD', calendar: calendar() } | async }}\n </span>\n </div>\n </div>\n\n <div\n axDropZone\n #zone=\"axDropZone\"\n (onElementDrop)=\"handleDrop($event, dayData.date)\"\n [class.ax-scheduler-slot-hovered]=\"zone.isHovered()\"\n class=\"ax-scheduler-timeline-content\"\n (click)=\"handleSlotEvent($event, dayData.date)\"\n (dblclick)=\"handleSlotEvent($event, dayData.date)\"\n (contextmenu)=\"handleSlotEvent($event, dayData.date)\"\n [attr.data-slot-id]=\"dayData.date.format('YYYYMMDD')\"\n [style.--spanning-rows-count]=\"maxSpanningRows()\"\n >\n <!-- Current Time Line Indicator -->\n @if (\n showCurrentTimeIndicator() &&\n shouldShowCurrentTimeForDay(dayData.date) &&\n getCurrentTimePosition() !== null\n ) {\n <div\n class=\"ax-scheduler-current-time-line\"\n [style.inset-inline-start.%]=\"getCurrentTimePosition()\"\n #currentTimeLine\n ></div>\n }\n <div class=\"ax-scheduler-timeline-appointment-container\">\n @for (segment of dayData.visibleAppointments; track segment.id + segment.originalStartDate.getTime()) {\n <div\n axDrag\n [dragData]=\"segment\"\n [dragCursor]=\"'grab'\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || segment.readonly || readonly()\"\n (pointerdown)=\"getSlotId($event)\"\n (click)=\"handleAppointmentEvent($event, segment)\"\n (dblclick)=\"handleAppointmentEvent($event, segment)\"\n (contextmenu)=\"handleAppointmentEvent($event, segment)\"\n [title]=\"\n tooltipTemplate()\n ? ''\n : segment.title +\n ' (' +\n (segment.originalStartDate | format: 'time' : { calendar: calendar() } | async) +\n ' - ' +\n (segment.originalEndDate | format: 'time' : { calendar: calendar() } | async) +\n ')'\n \"\n class=\"ax-scheduler-timeline-appointment {{\n segment.cssClass ?? 'ax-scheduler-' + (segment.priority ?? 'primary') + '-priority'\n }}\"\n [class.ax-state-active]=\"isActive(segment.id)\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltip]=\"tooltipTemplate()\"\n [axTooltipContext]=\"segment\"\n >\n <ax-title>\n <span class=\"ax-scheduler-truncate\">{{ segment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, segment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n >\n </ax-icon>\n }\n </ax-title>\n <ax-subtitle>\n {{ segment.originalStartDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}\n -\n {{ segment.originalEndDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}\n </ax-subtitle>\n </div>\n }\n @if (dayData.moreCount > 0) {\n <div #moreAppointments class=\"ax-scheduler-month-overflow-badge\" (click)=\"$event.stopPropagation()\">\n +{{\n '@acorex:common.general.more-items' | translate: { params: { number: dayData.moreCount } } | async\n }}\n </div>\n <ax-popover [target]=\"moreAppointments\" placement=\"bottom-start\" trigger=\"click\">\n <div\n axDropZone\n [class.ax-state-readonly]=\"readonly()\"\n class=\"ax-scheduler-popover ax-scheduler-month-popover-appointment\"\n >\n @for (\n segment of dayData.hiddenAppointments;\n track segment.id + segment.originalStartDate.getTime()\n ) {\n <div\n axDrag\n [dragData]=\"segment\"\n [dragCursor]=\"'grab'\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || segment.readonly || readonly()\"\n (click)=\"handleAppointmentEvent($event, segment); $event.stopPropagation()\"\n (dblclick)=\"handleAppointmentEvent($event, segment); $event.stopPropagation()\"\n (contextmenu)=\"handleAppointmentEvent($event, segment); $event.stopPropagation()\"\n [title]=\"\n tooltipTemplate()\n ? ''\n : segment.title +\n ' (' +\n (segment.originalStartDate | format: 'time' : { calendar: calendar() } | async) +\n ' - ' +\n (segment.originalEndDate | format: 'time' : { calendar: calendar() } | async) +\n ')'\n \"\n class=\"ax-scheduler-popover-appointment {{\n segment.cssClass ?? 'ax-scheduler-' + (segment.priority ?? 'primary') + '-priority'\n }}\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltip]=\"tooltipTemplate()\"\n [axTooltipContext]=\"segment\"\n >\n <ax-title>\n <span class=\"ax-scheduler-truncate\">{{ segment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, segment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n >\n </ax-icon>\n }\n </ax-title>\n <ax-subtitle>\n {{\n segment.originalStartDate\n | format: 'time' : { format: 'HH:mm', calendar: calendar() }\n | async\n }}\n -\n {{\n segment.originalEndDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async\n }}\n </ax-subtitle>\n </div>\n }\n </div>\n </ax-popover>\n }\n </div>\n </div>\n </div>\n }\n </div>\n </div>\n} @else {\n <!-- Resource-based layout with sticky resources -->\n <div class=\"ax-scheduler-timeline-month-resource-container\">\n <!-- Sticky header with resource placeholder and day headers -->\n @if (showResourceHeaders()) {\n <div class=\"ax-scheduler-timeline-month-header-sticky\">\n <div class=\"ax-scheduler-timeline-month-resource-header-placeholder\"><span>Resources</span></div>\n @for (dayData of processedDayData(); track dayData.date.date.getTime()) {\n <div class=\"ax-scheduler-timeline-month-day-header\">\n <div\n [class.ax-state-today]=\"isToday(dayData.date)\"\n class=\"ax-scheduler-month-header-date-day {{\n dayData.holiday?.state !== 'none' ? (dayData.holiday?.holiday?.cssClass ?? 'ax-state-holiday') : ''\n }}\"\n [style.--ax-scheduler-holiday-color]=\"dayData.holiday?.holiday?.color ?? null\"\n >\n <span\n class=\"ax-scheduler-month-header-date-day-char ax-scheduler-truncate\"\n [axTooltip]=\"(dayData.holiday?.holiday?.description ?? dayData.holiday?.holiday?.title ?? '') | translate | async\"\n >\n {{ dayData.date | format: 'date' : { format: 'dddd', calendar: calendar() } | async }}\n @if (dayData.holiday?.state === 'holiday' && dayData.holiday?.holiday?.title) {\n ( {{ dayData.holiday.holiday.title | translate | async }} )\n }\n </span>\n <span class=\"ax-scheduler-month-header-date-day-num\">\n {{ dayData.date | format: 'date' : { format: 'DD', calendar: calendar() } | async }}\n </span>\n </div>\n </div>\n }\n </div>\n }\n\n <!-- Resource rows with sticky resource headers -->\n <div class=\"ax-scheduler-timeline-month-resource-rows\">\n <!-- Current Time Line Indicator -->\n @if (showCurrentTimeIndicator() && getCurrentTimePosition() !== null) {\n <div\n class=\"ax-scheduler-current-time-line\"\n [style.inset-inline-start.%]=\"getCurrentTimePosition()\"\n #currentTimeLine\n ></div>\n }\n\n @for (resourceId of resourceIds(); track resourceId) {\n <div\n class=\"ax-scheduler-timeline-month-resource-row\"\n [style.--resource-spanning-rows-count]=\"getMaxSpanningRowsForResource(resourceId)\"\n >\n @if (showResourceHeaders()) {\n <!-- Sticky Resource Header -->\n <div class=\"ax-scheduler-timeline-month-resource-header ax-scheduler-timeline-month-resource-header-sticky\">\n @if (resourceTemplate() && typeof resourceTemplate() !== 'string') {\n <ng-container\n [ngTemplateOutlet]=\"$any(resourceTemplate())\"\n [ngTemplateOutletContext]=\"{\n $implicit: getResourceContext(resourceId),\n resource: getResourceContext(resourceId),\n resourceId: resourceId,\n }\"\n ></ng-container>\n } @else {\n <span class=\"ax-scheduler-timeline-month-resource-title\">{{ getResourceTitle(resourceId) }}</span>\n }\n </div>\n }\n\n <!-- Resource Content -->\n <div class=\"ax-scheduler-timeline-month-resource-content\">\n <!-- Spanning appointments layer for this resource -->\n @if (getSpanningAppointmentsForResource(resourceId).length > 0) {\n <div\n class=\"ax-scheduler-timeline-resource-spanning-layer\"\n [style.--timeline-days-count]=\"processedDayData().length\"\n >\n @for (spanning of getSpanningAppointmentsForResource(resourceId); track spanning.appointment.id) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragData]=\"spanning.appointment\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || spanning.appointment.readonly || readonly()\"\n (pointerdown)=\"getSlotId($event)\"\n (click)=\"handleAppointmentEvent($event, spanning.appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, spanning.appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, spanning.appointment)\"\n [title]=\"\n tooltipTemplate()\n ? ''\n : spanning.appointment.title +\n ' (' +\n (spanning.appointment.startDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async) +\n ' - ' +\n (spanning.appointment.endDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async) +\n ')'\n \"\n class=\"ax-scheduler-timeline-spanning-appointment {{\n spanning.appointment.cssClass ??\n 'ax-scheduler-' + (spanning.appointment.priority ?? 'primary') + '-priority'\n }}\"\n [class.ax-spanning-start-clipped]=\"spanning.isStartClipped\"\n [class.ax-spanning-end-clipped]=\"spanning.isEndClipped\"\n [class.ax-state-active]=\"isActive(spanning.appointment.id)\"\n [style.grid-column]=\"spanning.startDayIndex + 1 + ' / span ' + spanning.spanCount\"\n [style.grid-row]=\"spanning.rowIndex + 1\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltip]=\"tooltipTemplate()\"\n [axTooltipContext]=\"spanning.appointment\"\n >\n <span class=\"ax-spanning-appointment-title\">\n <span class=\"ax-scheduler-truncate\">{{ spanning.appointment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, spanning.appointment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n ></ax-icon>\n }\n </span>\n </div>\n }\n </div>\n }\n\n @for (dayData of processedDayData(); track dayData.date.date.getTime()) {\n <div\n axDropZone\n #zone=\"axDropZone\"\n (onElementDrop)=\"handleDrop($event, dayData.date, resourceId)\"\n [class.ax-scheduler-slot-hovered]=\"zone.isHovered()\"\n class=\"ax-scheduler-timeline-content\"\n (click)=\"handleSlotEvent($event, dayData.date)\"\n (dblclick)=\"handleSlotEvent($event, dayData.date)\"\n (contextmenu)=\"handleSlotEvent($event, dayData.date)\"\n [attr.data-slot-id]=\"dayData.date.format('YYYYMMDD')\"\n [attr.data-resource-id]=\"resourceId\"\n [style.--spanning-rows-count]=\"getMaxSpanningRowsForResource(resourceId)\"\n >\n <div class=\"ax-scheduler-timeline-appointment-container\">\n @for (\n segment of getAppointmentsForResourceAndDay(resourceId, dayData).visible;\n track segment.id + segment.originalStartDate.getTime()\n ) {\n <div\n axDrag\n [dragData]=\"segment\"\n [dragCursor]=\"'grab'\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || segment.readonly || readonly()\"\n (pointerdown)=\"getSlotId($event)\"\n (click)=\"handleAppointmentEvent($event, segment)\"\n (dblclick)=\"handleAppointmentEvent($event, segment)\"\n (contextmenu)=\"handleAppointmentEvent($event, segment)\"\n [title]=\"\n tooltipTemplate()\n ? ''\n : segment.allDay\n ? segment.title +\n ' (' +\n (segment.originalStartDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async) +\n ' - ' +\n (segment.originalEndDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async) +\n ')'\n : segment.title +\n ' (' +\n (segment.originalStartDate | format: 'time' : { calendar: calendar() } | async) +\n ' - ' +\n (segment.originalEndDate | format: 'time' : { calendar: calendar() } | async) +\n ')'\n \"\n class=\"ax-scheduler-timeline-appointment {{\n segment.cssClass ?? 'ax-scheduler-' + (segment.priority ?? 'primary') + '-priority'\n }}\"\n [class.all-day-segment]=\"segment.allDay\"\n [class.ax-state-active]=\"isActive(segment.id)\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltip]=\"tooltipTemplate()\"\n [axTooltipContext]=\"segment\"\n >\n <ax-title>\n <span class=\"ax-scheduler-truncate\">{{ segment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, segment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n >\n </ax-icon>\n }\n </ax-title>\n <ax-subtitle>\n @if (segment.allDay) {\n {{\n segment.originalStartDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async\n }}\n @if (segment.originalStartDate.getTime() !== segment.originalEndDate.getTime()) {\n -\n {{\n segment.originalEndDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async\n }}\n }\n } @else {\n {{\n segment.originalStartDate\n | format: 'time' : { format: 'HH:mm', calendar: calendar() }\n | async\n }}\n -\n {{\n segment.originalEndDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async\n }}\n }\n </ax-subtitle>\n </div>\n }\n @if (getAppointmentsForResourceAndDay(resourceId, dayData).moreCount > 0) {\n <div #moreAppointments class=\"ax-scheduler-month-overflow-badge\" (click)=\"$event.stopPropagation()\">\n +{{\n '@acorex:common.general.more-items'\n | translate\n : { params: { number: getAppointmentsForResourceAndDay(resourceId, dayData).moreCount } }\n | async\n }}\n </div>\n <ax-popover [target]=\"moreAppointments\" placement=\"bottom-start\" trigger=\"click\">\n <div\n axDropZone\n [class.ax-state-readonly]=\"readonly()\"\n class=\"ax-scheduler-popover ax-scheduler-month-popover-appointment\"\n >\n @for (\n segment of getAppointmentsForResourceAndDay(resourceId, dayData).hidden;\n track segment.id + segment.originalStartDate.getTime()\n ) {\n <div\n axDrag\n [dragData]=\"segment\"\n [dragCursor]=\"'grab'\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || segment.readonly || readonly()\"\n (click)=\"handleAppointmentEvent($event, segment); $event.stopPropagation()\"\n (dblclick)=\"handleAppointmentEvent($event, segment); $event.stopPropagation()\"\n (contextmenu)=\"handleAppointmentEvent($event, segment); $event.stopPropagation()\"\n [title]=\"\n tooltipTemplate()\n ? ''\n : segment.allDay\n ? segment.title +\n ' (' +\n (segment.originalStartDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async) +\n ' - ' +\n (segment.originalEndDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async) +\n ')'\n : segment.title +\n ' (' +\n (segment.originalStartDate | format: 'time' : { calendar: calendar() } | async) +\n ' - ' +\n (segment.originalEndDate | format: 'time' : { calendar: calendar() } | async) +\n ')'\n \"\n class=\"ax-scheduler-popover-appointment {{\n segment.cssClass ?? 'ax-scheduler-' + (segment.priority ?? 'primary') + '-priority'\n }}\"\n [class.all-day-segment]=\"segment.allDay\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltip]=\"tooltipTemplate()\"\n [axTooltipContext]=\"segment\"\n >\n <ax-title>\n <span class=\"ax-scheduler-truncate\">{{ segment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, segment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n >\n </ax-icon>\n }\n </ax-title>\n <ax-subtitle>\n @if (segment.allDay) {\n {{\n segment.originalStartDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async\n }}\n @if (segment.originalStartDate.getTime() !== segment.originalEndDate.getTime()) {\n -\n {{\n segment.originalEndDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async\n }}\n }\n } @else {\n {{\n segment.originalStartDate\n | format: 'time' : { format: 'HH:mm', calendar: calendar() }\n | async\n }}\n -\n {{\n segment.originalEndDate\n | format: 'time' : { format: 'HH:mm', calendar: calendar() }\n | async\n }}\n }\n </ax-subtitle>\n </div>\n }\n </div>\n </ax-popover>\n }\n </div>\n </div>\n }\n </div>\n </div>\n }\n </div>\n </div>\n}\n", styles: ["@layer properties;@layer components{ax-scheduler-timeline-month-view{--ax-scheduler-timeline-spanning-row-height: 1.5rem;--ax-scheduler-timeline-spanning-gap: .125rem;position:relative;display:inline-flex;height:100%;flex-direction:column;background-color:inherit}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-wrapper{position:relative;display:flex;height:100%;flex-direction:column}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-spanning-layer{pointer-events:none;position:absolute;inset-inline-start:calc(var(--spacing, .25rem) * 0);inset-inline-end:calc(var(--spacing, .25rem) * 0);top:calc(var(--spacing, .25rem) * 16);z-index:5;display:grid;align-content:flex-start;padding-inline:calc(var(--spacing, .25rem) * .5);padding-block:calc(var(--spacing, .25rem) * 1);row-gap:var(--ax-scheduler-timeline-spanning-gap);grid-auto-rows:var(--ax-scheduler-timeline-spanning-row-height);grid-template-columns:repeat(var(--timeline-days-count, 31),var( --ax-comp-scheduler-timeline-month-view-blocks-width, calc(var(--ax-comp-scheduler-timeline-view-blocks-width) / 2) ))}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-spanning-layer .ax-scheduler-timeline-spanning-appointment{z-index:6;display:flex;cursor:pointer;align-items:center;overflow:hidden;text-overflow:ellipsis;border-radius:var(--radius-sm, .25rem);padding-inline:calc(var(--spacing, .25rem) * 1);padding-block:calc(var(--spacing, .25rem) * .5);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));white-space:nowrap;margin-inline:.125rem;pointer-events:auto}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-spanning-layer .ax-scheduler-timeline-spanning-appointment .ax-spanning-appointment-title{display:flex;height:100%;width:100%;align-items:center;justify-content:space-between;padding-inline:calc(var(--spacing, .25rem) * 2)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-spanning-layer .ax-scheduler-timeline-spanning-appointment .ax-spanning-appointment-title .ax-scheduler-truncate{min-width:calc(var(--spacing, .25rem) * 0);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-spanning-layer .ax-scheduler-timeline-spanning-appointment .ax-spanning-appointment-title .ax-scheduler-action-icon{margin-inline-start:calc(var(--spacing, .25rem) * 1);width:auto;flex-shrink:0;cursor:pointer}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-start-clipped{position:relative;border-start-start-radius:0;border-end-start-radius:0;margin-inline-start:0}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-start-clipped:before{content:\"\\2190 \";position:absolute;top:calc(var(--spacing, .25rem) * .5);font-size:.65rem;opacity:70%;inset-inline-start:0}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-end-clipped{position:relative;border-start-end-radius:0;border-end-end-radius:0;margin-inline-end:0}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-end-clipped:after{content:\" \\2192\";position:absolute;top:calc(var(--spacing, .25rem) * .5);font-size:.65rem;opacity:70%;inset-inline-end:0}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container{display:flex;height:100%}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-header{display:flex;width:100%;background-color:var(--ax-comp-scheduler-all-day-bg,inherit)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-header .ax-scheduler-month-header-date-day{position:relative;display:flex;height:calc(var(--spacing, .25rem) * 16);width:var(--ax-comp-scheduler-timeline-month-view-blocks-width,calc(var(--ax-comp-scheduler-timeline-view-blocks-width) / 2));flex-direction:column;align-items:flex-start;justify-content:center;gap:calc(var(--spacing, .25rem) * 1);border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 1)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-header .ax-scheduler-month-header-date-day.ax-state-today{background-color:rgba(var(--ax-sys-color-primary-surface));color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-header .ax-scheduler-month-header-date-day.ax-state-today{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 5%,transparent)}}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-header .ax-scheduler-month-header-date-day.ax-state-today .ax-scheduler-month-header-date-day-char{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-header .ax-scheduler-month-header-date-day.ax-state-today .ax-scheduler-month-header-date-day-num{--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-header .ax-scheduler-month-header-date-day.ax-state-holiday{color:var(--ax-scheduler-holiday-color, rgba(var(--ax-sys-color-danger-surface)))}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-header .ax-scheduler-month-header-date-day.ax-state-holiday.ax-state-today{color:rgba(var(--ax-sys-color-primary-surface))}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-header .ax-scheduler-month-header-date-day .ax-scheduler-month-header-date-day-char{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 4);max-width:100%;--tw-leading: calc(var(--spacing, .25rem) * 4);line-height:calc(var(--spacing, .25rem) * 4);--tw-font-weight: var(--font-weight-light, 300);font-weight:var(--font-weight-light, 300)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-header .ax-scheduler-month-header-date-day .ax-scheduler-month-header-date-day-num{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 4);font-size:var(--text-xl, 1.25rem);line-height:var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-content{position:relative;height:calc(100% - 4rem);width:var(--ax-comp-scheduler-timeline-month-view-blocks-width,calc(var(--ax-comp-scheduler-timeline-view-blocks-width) / 2));border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));padding:calc(var(--spacing, .25rem) * 1);padding-top:calc(var(--spanning-rows-count, 0) * (var(--ax-scheduler-timeline-spanning-row-height) + var(--ax-scheduler-timeline-spanning-gap)) + .25rem)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container{display:flex;flex-direction:column;gap:var(--ax-comp-scheduler-timeline-month-gap-height,.125rem)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container .ax-scheduler-timeline-appointment{display:flex;min-height:calc(var(--spacing, .25rem) * 10);width:100%;flex-direction:column;overflow:hidden;border-radius:calc(var(--ax-sys-border-radius) / 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container .ax-scheduler-month-overflow-badge{margin-top:calc(var(--spacing, .25rem) * .5);cursor:pointer;padding-inline:calc(var(--spacing, .25rem) * 0);padding-block:calc(var(--spacing, .25rem) * .5);text-align:start;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container .ax-scheduler-month-overflow-badge:hover{text-decoration-line:underline}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container{position:relative;display:flex;height:100%;flex-direction:column;background-color:inherit}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-header-sticky{position:sticky;top:calc(var(--spacing, .25rem) * 0);z-index:10;display:flex;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-header-sticky .ax-scheduler-timeline-month-resource-header-placeholder{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 0);z-index:15;display:flex;width:var(--ax-comp-scheduler-resource-header-width,8rem);min-width:var(--ax-comp-scheduler-resource-header-width,8rem);align-items:center;justify-content:center;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit;padding:calc(var(--spacing, .25rem) * 2);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-header-sticky .ax-scheduler-timeline-month-day-header{display:flex;flex:1;background-color:inherit}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-header-sticky .ax-scheduler-timeline-month-day-header .ax-scheduler-month-header-date-day{position:relative;display:flex;height:calc(var(--spacing, .25rem) * 16);width:var(--ax-comp-scheduler-timeline-month-view-blocks-width,calc(var(--ax-comp-scheduler-timeline-view-blocks-width) / 2));min-width:var(--ax-comp-scheduler-timeline-month-view-blocks-width,calc(var(--ax-comp-scheduler-timeline-view-blocks-width) / 2));flex-direction:column;align-items:flex-start;justify-content:center;gap:calc(var(--spacing, .25rem) * 1);border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 1)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-header-sticky .ax-scheduler-timeline-month-day-header .ax-scheduler-month-header-date-day.ax-state-today{background-color:rgba(var(--ax-sys-color-primary-surface));color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-header-sticky .ax-scheduler-timeline-month-day-header .ax-scheduler-month-header-date-day.ax-state-today{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 5%,transparent)}}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-header-sticky .ax-scheduler-timeline-month-day-header .ax-scheduler-month-header-date-day.ax-state-today .ax-scheduler-month-header-date-day-char{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-header-sticky .ax-scheduler-timeline-month-day-header .ax-scheduler-month-header-date-day.ax-state-today .ax-scheduler-month-header-date-day-num{--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-header-sticky .ax-scheduler-timeline-month-day-header .ax-scheduler-month-header-date-day.ax-state-holiday{color:var(--ax-scheduler-holiday-color, rgba(var(--ax-sys-color-danger-surface)))}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-header-sticky .ax-scheduler-timeline-month-day-header .ax-scheduler-month-header-date-day.ax-state-holiday.ax-state-today{color:rgba(var(--ax-sys-color-primary-surface))}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-header-sticky .ax-scheduler-timeline-month-day-header .ax-scheduler-month-header-date-day .ax-scheduler-month-header-date-day-char{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 4);max-width:100%;--tw-leading: calc(var(--spacing, .25rem) * 4);line-height:calc(var(--spacing, .25rem) * 4);--tw-font-weight: var(--font-weight-light, 300);font-weight:var(--font-weight-light, 300)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-header-sticky .ax-scheduler-timeline-month-day-header .ax-scheduler-month-header-date-day .ax-scheduler-month-header-date-day-num{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 4);font-size:var(--text-xl, 1.25rem);line-height:var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows{position:relative;flex:1;overflow:visible;background-color:inherit}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows .ax-scheduler-timeline-month-resource-row{display:flex;width:max-content;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit;min-height:calc(var(--resource-spanning-rows-count, 0) * (var(--ax-scheduler-timeline-spanning-row-height) + var(--ax-scheduler-timeline-spanning-gap)) + var(--ax-comp-scheduler-timeline-month-row-base-height, 5rem))}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows .ax-scheduler-timeline-month-resource-row .ax-scheduler-timeline-month-resource-header{display:flex;width:var(--ax-comp-scheduler-resource-header-width,8rem);min-width:var(--ax-comp-scheduler-resource-header-width,8rem);align-items:center;justify-content:center;align-self:stretch;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit;padding:calc(var(--spacing, .25rem) * 2)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows .ax-scheduler-timeline-month-resource-row .ax-scheduler-timeline-month-resource-header.ax-scheduler-timeline-month-resource-header-sticky{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 0);z-index:9;background-color:inherit}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows .ax-scheduler-timeline-month-resource-row .ax-scheduler-timeline-month-resource-header .ax-scheduler-timeline-month-resource-title{text-align:center;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);overflow-wrap:break-word}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows .ax-scheduler-timeline-month-resource-row .ax-scheduler-timeline-month-resource-content{position:relative;display:flex;flex:1;background-color:inherit}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows .ax-scheduler-timeline-month-resource-row .ax-scheduler-timeline-month-resource-content .ax-scheduler-timeline-resource-spanning-layer{pointer-events:none;position:absolute;inset-inline-start:calc(var(--spacing, .25rem) * 0);inset-inline-end:calc(var(--spacing, .25rem) * 0);top:calc(var(--spacing, .25rem) * 0);z-index:5;display:grid;align-content:flex-start;padding-inline:calc(var(--spacing, .25rem) * .5);padding-block:calc(var(--spacing, .25rem) * 1);row-gap:var(--ax-scheduler-timeline-spanning-gap);grid-auto-rows:var(--ax-scheduler-timeline-spanning-row-height);grid-template-columns:repeat(var(--timeline-days-count, 31),var( --ax-comp-scheduler-timeline-month-view-blocks-width, calc(var(--ax-comp-scheduler-timeline-view-blocks-width) / 2) ))}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows .ax-scheduler-timeline-month-resource-row .ax-scheduler-timeline-month-resource-content .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment{z-index:6;display:flex;cursor:pointer;align-items:center;overflow:hidden;text-overflow:ellipsis;border-radius:var(--radius-sm, .25rem);padding-inline:calc(var(--spacing, .25rem) * 1);padding-block:calc(var(--spacing, .25rem) * .5);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));white-space:nowrap;margin-inline:.125rem;pointer-events:auto}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows .ax-scheduler-timeline-month-resource-row .ax-scheduler-timeline-month-resource-content .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment .ax-spanning-appointment-title{display:flex;height:100%;width:100%;align-items:center;justify-content:space-between;padding-inline:calc(var(--spacing, .25rem) * 2)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows .ax-scheduler-timeline-month-resource-row .ax-scheduler-timeline-month-resource-content .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment .ax-spanning-appointment-title .ax-scheduler-truncate{min-width:calc(var(--spacing, .25rem) * 0);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows .ax-scheduler-timeline-month-resource-row .ax-scheduler-timeline-month-resource-content .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment .ax-spanning-appointment-title .ax-scheduler-action-icon{margin-inline-start:calc(var(--spacing, .25rem) * 1);width:auto;flex-shrink:0;cursor:pointer}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows .ax-scheduler-timeline-month-resource-row .ax-scheduler-timeline-month-resource-content .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-start-clipped{position:relative;border-start-start-radius:0;border-end-start-radius:0;margin-inline-start:0}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows .ax-scheduler-timeline-month-resource-row .ax-scheduler-timeline-month-resource-content .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-start-clipped:before{content:\"\\2190 \";position:absolute;top:calc(var(--spacing, .25rem) * .5);font-size:.65rem;opacity:70%;inset-inline-start:0}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows .ax-scheduler-timeline-month-resource-row .ax-scheduler-timeline-month-resource-content .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-end-clipped{position:relative;border-start-end-radius:0;border-end-end-radius:0;margin-inline-end:0}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows .ax-scheduler-timeline-month-resource-row .ax-scheduler-timeline-month-resource-content .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-end-clipped:after{content:\" \\2192\";position:absolute;top:calc(var(--spacing, .25rem) * .5);font-size:.65rem;opacity:70%;inset-inline-end:0}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows .ax-scheduler-timeline-month-resource-row .ax-scheduler-timeline-month-resource-content .ax-scheduler-timeline-content{position:relative;display:flex;width:var(--ax-comp-scheduler-timeline-month-view-blocks-width,calc(var(--ax-comp-scheduler-timeline-view-blocks-width) / 2));min-width:var(--ax-comp-scheduler-timeline-month-view-blocks-width,calc(var(--ax-comp-scheduler-timeline-view-blocks-width) / 2));flex-direction:column;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit;padding-bottom:calc(var(--spacing, .25rem) * 1);padding-top:calc(var(--spanning-rows-count, 0) * (var(--ax-scheduler-timeline-spanning-row-height) + var(--ax-scheduler-timeline-spanning-gap)) + .25rem)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows .ax-scheduler-timeline-month-resource-row .ax-scheduler-timeline-month-resource-content .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container{display:flex;width:100%;flex-direction:column;gap:var(--ax-comp-scheduler-timeline-month-gap-height,.125rem);padding-inline:calc(var(--spacing, .25rem) * 1)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows .ax-scheduler-timeline-month-resource-row .ax-scheduler-timeline-month-resource-content .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container .ax-scheduler-timeline-appointment{display:flex;min-height:calc(var(--spacing, .25rem) * 10);width:100%;flex-shrink:0;flex-direction:column;overflow:hidden;border-radius:calc(var(--ax-sys-border-radius) / 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows .ax-scheduler-timeline-month-resource-row .ax-scheduler-timeline-month-resource-content .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container .ax-scheduler-month-overflow-badge{margin-top:calc(var(--spacing, .25rem) * .5);flex-shrink:0;cursor:pointer;padding-inline:calc(var(--spacing, .25rem) * 0);padding-block:calc(var(--spacing, .25rem) * .5);text-align:start;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows .ax-scheduler-timeline-month-resource-row .ax-scheduler-timeline-month-resource-content .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container .ax-scheduler-month-overflow-badge:hover{text-decoration-line:underline}ax-scheduler-timeline-month-view:not(.ax-state-readonly) .ax-scheduler-timeline-appointment{cursor:pointer}ax-scheduler-timeline-month-view:not(.ax-state-readonly) .ax-scheduler-timeline-content{cursor:pointer;transition-property:background-color;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));transition-duration:var(--ax-sys-transition-duration);transition-timing-function:var(--ax-sys-transition-timing-function)}ax-scheduler-timeline-month-view:not(.ax-state-readonly) .ax-scheduler-timeline-content:hover{background-color:rgba(var(--ax-comp-scheduler-slot-hover-bg,var(--ax-sys-color-primary-surface),.1))}ax-scheduler-timeline-month-view ax-title{display:flex;justify-content:space-between}ax-scheduler-timeline-month-view ax-title .ax-scheduler-action-icon{width:auto;cursor:pointer}ax-scheduler-timeline-month-view .ax-scheduler-current-time-line{top:calc(var(--spacing, .25rem) * 0);bottom:calc(var(--spacing, .25rem) * 0);width:calc(var(--spacing, .25rem) * .5)}ax-scheduler-timeline-month-view .ax-scheduler-current-time-line:before{content:var(--tw-content);inset-inline-start:-5px}ax-scheduler-timeline-month-view .ax-scheduler-current-time-line:before{content:var(--tw-content);top:calc(var(--spacing, .25rem) * -1.5)}ax-scheduler.ax-rtl ax-scheduler-timeline-month-view .ax-scheduler-timeline-spanning-appointment.ax-spanning-start-clipped:before{content:\"\\2192 \"}ax-scheduler.ax-rtl ax-scheduler-timeline-month-view .ax-scheduler-timeline-spanning-appointment.ax-spanning-end-clipped:after{content:\" \\2190\"}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-content{syntax: \"*\"; initial-value: \"\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial;--tw-leading: initial;--tw-content: \"\"}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: AXDragDirective, selector: "[axDrag]", inputs: ["axDrag", "dragData", "dragDisabled", "dragTransition", "dragElementClone", "dropZoneGroup", "dragStartDelay", "dragResetOnDblClick", "dragLockAxis", "dragClonedTemplate", "dragCursor", "dragBoundary", "dragTransitionDuration"], outputs: ["dragPositionChanged"] }, { kind: "component", type: AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disablePanelClass", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "closeOnScroll", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "directive", type: AXTooltipDirective, selector: "[axTooltip]", inputs: ["axTooltipDisabled", "axTooltip", "axTooltipContext", "axTooltipPlacement", "axTooltipOffsetX", "axTooltipOffsetY", "axTooltipOpenAfter", "axTooltipCloseAfter"] }, { kind: "directive", type: AXDropZoneDirective, selector: "[axDropZone]", inputs: ["dropZoneGroup"], outputs: ["onElementDrop", "onElementHover"], exportAs: ["axDropZone"] }, { kind: "component", type: AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXFormatPipe, name: "format" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
2824
2929
|
}
|
|
2825
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2930
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXSchedulerTimelineMonthViewComponent, decorators: [{
|
|
2826
2931
|
type: Component,
|
|
2827
|
-
args: [{ selector: 'ax-scheduler-timeline-month-view',
|
|
2932
|
+
args: [{ selector: 'ax-scheduler-timeline-month-view', encapsulation: ViewEncapsulation.None, host: {
|
|
2828
2933
|
'[class.ax-state-readonly]': 'readonly()',
|
|
2829
2934
|
}, imports: [
|
|
2830
2935
|
NgTemplateOutlet,
|
|
@@ -2848,25 +2953,44 @@ class AXSchedulerTimelineWeeklyViewComponent extends NXComponent {
|
|
|
2848
2953
|
this.scheduler = inject(AXSchedulerComponent);
|
|
2849
2954
|
this.calendarService = inject(AXCalendarService);
|
|
2850
2955
|
this.schedulerService = inject(AXSchedulerService);
|
|
2851
|
-
this.daysCount = input(7,
|
|
2852
|
-
|
|
2853
|
-
this.
|
|
2854
|
-
|
|
2855
|
-
this.
|
|
2856
|
-
|
|
2857
|
-
this.
|
|
2858
|
-
|
|
2859
|
-
this.
|
|
2860
|
-
|
|
2861
|
-
this.
|
|
2862
|
-
|
|
2863
|
-
this.
|
|
2864
|
-
|
|
2865
|
-
this.
|
|
2866
|
-
|
|
2867
|
-
this.
|
|
2868
|
-
|
|
2869
|
-
this.
|
|
2956
|
+
this.daysCount = input(7, /* @ts-ignore */
|
|
2957
|
+
...(ngDevMode ? [{ debugName: "daysCount" }] : /* istanbul ignore next */ []));
|
|
2958
|
+
this.readonly = input(false, /* @ts-ignore */
|
|
2959
|
+
...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
|
|
2960
|
+
this.draggable = input(true, /* @ts-ignore */
|
|
2961
|
+
...(ngDevMode ? [{ debugName: "draggable" }] : /* istanbul ignore next */ []));
|
|
2962
|
+
this.hasActions = input(false, /* @ts-ignore */
|
|
2963
|
+
...(ngDevMode ? [{ debugName: "hasActions" }] : /* istanbul ignore next */ []));
|
|
2964
|
+
this.dragStartDelay = input(0, /* @ts-ignore */
|
|
2965
|
+
...(ngDevMode ? [{ debugName: "dragStartDelay" }] : /* istanbul ignore next */ []));
|
|
2966
|
+
this.calendar = input(/* @ts-ignore */
|
|
2967
|
+
...(ngDevMode ? [undefined, { debugName: "calendar" }] : /* istanbul ignore next */ []));
|
|
2968
|
+
this.showResourceHeaders = input(true, /* @ts-ignore */
|
|
2969
|
+
...(ngDevMode ? [{ debugName: "showResourceHeaders" }] : /* istanbul ignore next */ []));
|
|
2970
|
+
this.date = input.required(/* @ts-ignore */
|
|
2971
|
+
...(ngDevMode ? [{ debugName: "date" }] : /* istanbul ignore next */ []));
|
|
2972
|
+
this.endDayHour = input.required(/* @ts-ignore */
|
|
2973
|
+
...(ngDevMode ? [{ debugName: "endDayHour" }] : /* istanbul ignore next */ []));
|
|
2974
|
+
this.selectedAppointmentId = input(null, /* @ts-ignore */
|
|
2975
|
+
...(ngDevMode ? [{ debugName: "selectedAppointmentId" }] : /* istanbul ignore next */ []));
|
|
2976
|
+
this.showCurrentTimeIndicator = input(true, /* @ts-ignore */
|
|
2977
|
+
...(ngDevMode ? [{ debugName: "showCurrentTimeIndicator" }] : /* istanbul ignore next */ []));
|
|
2978
|
+
this.scrollToCurrentTimeIndicator = input(false, /* @ts-ignore */
|
|
2979
|
+
...(ngDevMode ? [{ debugName: "scrollToCurrentTimeIndicator" }] : /* istanbul ignore next */ []));
|
|
2980
|
+
this.startDayHour = input.required(/* @ts-ignore */
|
|
2981
|
+
...(ngDevMode ? [{ debugName: "startDayHour" }] : /* istanbul ignore next */ []));
|
|
2982
|
+
this.showUnassignedAppointments = input(true, /* @ts-ignore */
|
|
2983
|
+
...(ngDevMode ? [{ debugName: "showUnassignedAppointments" }] : /* istanbul ignore next */ []));
|
|
2984
|
+
this.resources = input([], /* @ts-ignore */
|
|
2985
|
+
...(ngDevMode ? [{ debugName: "resources" }] : /* istanbul ignore next */ []));
|
|
2986
|
+
this.resourceTemplate = input(/* @ts-ignore */
|
|
2987
|
+
...(ngDevMode ? [undefined, { debugName: "resourceTemplate" }] : /* istanbul ignore next */ []));
|
|
2988
|
+
this.appointments = input([], /* @ts-ignore */
|
|
2989
|
+
...(ngDevMode ? [{ debugName: "appointments" }] : /* istanbul ignore next */ []));
|
|
2990
|
+
this.tooltipTemplate = input(/* @ts-ignore */
|
|
2991
|
+
...(ngDevMode ? [undefined, { debugName: "tooltipTemplate" }] : /* istanbul ignore next */ []));
|
|
2992
|
+
this.currentTimeLineElement = viewChild('currentTimeLine', /* @ts-ignore */
|
|
2993
|
+
...(ngDevMode ? [{ debugName: "currentTimeLineElement" }] : /* istanbul ignore next */ []));
|
|
2870
2994
|
this.daysDataForTimelineViews = computed(() => {
|
|
2871
2995
|
const allOriginalAppointments = this.appointments();
|
|
2872
2996
|
const multiViewStartDate = this.date();
|
|
@@ -2893,7 +3017,8 @@ class AXSchedulerTimelineWeeklyViewComponent extends NXComponent {
|
|
|
2893
3017
|
});
|
|
2894
3018
|
}
|
|
2895
3019
|
return result;
|
|
2896
|
-
},
|
|
3020
|
+
}, /* @ts-ignore */
|
|
3021
|
+
...(ngDevMode ? [{ debugName: "daysDataForTimelineViews" }] : /* istanbul ignore next */ []));
|
|
2897
3022
|
/**
|
|
2898
3023
|
* Computes spanning appointments for multi-day events across the view.
|
|
2899
3024
|
*/
|
|
@@ -2998,7 +3123,8 @@ class AXSchedulerTimelineWeeklyViewComponent extends NXComponent {
|
|
|
2998
3123
|
}
|
|
2999
3124
|
}
|
|
3000
3125
|
return spanningResults;
|
|
3001
|
-
},
|
|
3126
|
+
}, /* @ts-ignore */
|
|
3127
|
+
...(ngDevMode ? [{ debugName: "spanningAppointments" }] : /* istanbul ignore next */ []));
|
|
3002
3128
|
/**
|
|
3003
3129
|
* Gets the set of multi-day appointment IDs to exclude from individual day views.
|
|
3004
3130
|
*/
|
|
@@ -3011,7 +3137,8 @@ class AXSchedulerTimelineWeeklyViewComponent extends NXComponent {
|
|
|
3011
3137
|
}
|
|
3012
3138
|
}
|
|
3013
3139
|
return ids;
|
|
3014
|
-
},
|
|
3140
|
+
}, /* @ts-ignore */
|
|
3141
|
+
...(ngDevMode ? [{ debugName: "multiDayAppointmentIds" }] : /* istanbul ignore next */ []));
|
|
3015
3142
|
/**
|
|
3016
3143
|
* Gets the maximum number of spanning rows across all appointments (for non-resource layouts).
|
|
3017
3144
|
*/
|
|
@@ -3020,7 +3147,8 @@ class AXSchedulerTimelineWeeklyViewComponent extends NXComponent {
|
|
|
3020
3147
|
if (spanning.length === 0)
|
|
3021
3148
|
return 0;
|
|
3022
3149
|
return Math.max(...spanning.map((s) => s.rowIndex)) + 1;
|
|
3023
|
-
},
|
|
3150
|
+
}, /* @ts-ignore */
|
|
3151
|
+
...(ngDevMode ? [{ debugName: "maxSpanningRows" }] : /* istanbul ignore next */ []));
|
|
3024
3152
|
this.slotClickedInternal = output();
|
|
3025
3153
|
this.slotDblClickedInternal = output();
|
|
3026
3154
|
this.slotRightClickedInternal = output();
|
|
@@ -3037,7 +3165,8 @@ class AXSchedulerTimelineWeeklyViewComponent extends NXComponent {
|
|
|
3037
3165
|
const resources = this.resources();
|
|
3038
3166
|
const showUnassigned = this.showUnassignedAppointments();
|
|
3039
3167
|
return this.schedulerService.filterAppointmentsByResources(allAppointments, resources, showUnassigned);
|
|
3040
|
-
},
|
|
3168
|
+
}, /* @ts-ignore */
|
|
3169
|
+
...(ngDevMode ? [{ debugName: "appointmentsByResource" }] : /* istanbul ignore next */ []));
|
|
3041
3170
|
/**
|
|
3042
3171
|
* Gets all resource IDs including unassigned if applicable.
|
|
3043
3172
|
*/
|
|
@@ -3045,7 +3174,8 @@ class AXSchedulerTimelineWeeklyViewComponent extends NXComponent {
|
|
|
3045
3174
|
const resources = this.resources();
|
|
3046
3175
|
const showUnassigned = this.showUnassignedAppointments();
|
|
3047
3176
|
return this.schedulerService.getAllResourceIds(resources, showUnassigned);
|
|
3048
|
-
},
|
|
3177
|
+
}, /* @ts-ignore */
|
|
3178
|
+
...(ngDevMode ? [{ debugName: "resourceIds" }] : /* istanbul ignore next */ []));
|
|
3049
3179
|
}
|
|
3050
3180
|
isActive(appointmentId) {
|
|
3051
3181
|
return this.selectedAppointmentId() === appointmentId;
|
|
@@ -3405,12 +3535,12 @@ class AXSchedulerTimelineWeeklyViewComponent extends NXComponent {
|
|
|
3405
3535
|
}
|
|
3406
3536
|
return { state: 'none' };
|
|
3407
3537
|
}
|
|
3408
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
3409
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXSchedulerTimelineWeeklyViewComponent, isStandalone: true, selector: "ax-scheduler-timeline-weekly-view", inputs: { daysCount: { classPropertyName: "daysCount", publicName: "daysCount", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, draggable: { classPropertyName: "draggable", publicName: "draggable", isSignal: true, isRequired: false, transformFunction: null }, hasActions: { classPropertyName: "hasActions", publicName: "hasActions", isSignal: true, isRequired: false, transformFunction: null }, dragStartDelay: { classPropertyName: "dragStartDelay", publicName: "dragStartDelay", isSignal: true, isRequired: false, transformFunction: null }, calendar: { classPropertyName: "calendar", publicName: "calendar", isSignal: true, isRequired: false, transformFunction: null }, showResourceHeaders: { classPropertyName: "showResourceHeaders", publicName: "showResourceHeaders", isSignal: true, isRequired: false, transformFunction: null }, date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: true, transformFunction: null }, endDayHour: { classPropertyName: "endDayHour", publicName: "endDayHour", isSignal: true, isRequired: true, transformFunction: null }, selectedAppointmentId: { classPropertyName: "selectedAppointmentId", publicName: "selectedAppointmentId", isSignal: true, isRequired: false, transformFunction: null }, showCurrentTimeIndicator: { classPropertyName: "showCurrentTimeIndicator", publicName: "showCurrentTimeIndicator", isSignal: true, isRequired: false, transformFunction: null }, scrollToCurrentTimeIndicator: { classPropertyName: "scrollToCurrentTimeIndicator", publicName: "scrollToCurrentTimeIndicator", isSignal: true, isRequired: false, transformFunction: null }, startDayHour: { classPropertyName: "startDayHour", publicName: "startDayHour", isSignal: true, isRequired: true, transformFunction: null }, showUnassignedAppointments: { classPropertyName: "showUnassignedAppointments", publicName: "showUnassignedAppointments", isSignal: true, isRequired: false, transformFunction: null }, resources: { classPropertyName: "resources", publicName: "resources", isSignal: true, isRequired: false, transformFunction: null }, resourceTemplate: { classPropertyName: "resourceTemplate", publicName: "resourceTemplate", isSignal: true, isRequired: false, transformFunction: null }, appointments: { classPropertyName: "appointments", publicName: "appointments", isSignal: true, isRequired: false, transformFunction: null }, tooltipTemplate: { classPropertyName: "tooltipTemplate", publicName: "tooltipTemplate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { slotClickedInternal: "slotClickedInternal", slotDblClickedInternal: "slotDblClickedInternal", slotRightClickedInternal: "slotRightClickedInternal", appointmentClickedInternal: "appointmentClickedInternal", appointmentDblClickedInternal: "appointmentDblClickedInternal", appointmentRightClickedInternal: "appointmentRightClickedInternal", onActionClickInternal: "onActionClickInternal", onAppointmentDropInternal: "onAppointmentDropInternal" }, host: { properties: { "class.ax-state-readonly": "readonly()" } }, providers: [{ provide: AXComponent, useExisting: AXSchedulerTimelineWeeklyViewComponent }], viewQueries: [{ propertyName: "currentTimeLineElement", first: true, predicate: ["currentTimeLine"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (resources().length === 0 || !showResourceHeaders()) {\n <!-- Original layout when no resources -->\n <div class=\"ax-scheduler-timeline-day-view-container\" [style.--spanning-rows-count]=\"maxSpanningRows()\">\n <!-- Spanning appointments layer -->\n @if (spanningAppointments().length > 0) {\n <div\n class=\"ax-scheduler-timeline-weekly-spanning-layer\"\n [style.--timeline-days-count]=\"daysDataForTimelineViews().length\"\n >\n @for (spanning of spanningAppointments(); track spanning.appointment.id) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragData]=\"spanning.appointment\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || spanning.appointment.readonly || readonly()\"\n (click)=\"handleSpanningAppointmentEvent($event, spanning.appointment)\"\n (dblclick)=\"handleSpanningAppointmentEvent($event, spanning.appointment)\"\n (contextmenu)=\"handleSpanningAppointmentEvent($event, spanning.appointment)\"\n [title]=\"\n spanning.appointment.title +\n ' (' +\n (spanning.appointment.startDate | format: 'date' : { format: 'MMM d', calendar: calendar() } | async) +\n ' - ' +\n (spanning.appointment.endDate | format: 'date' : { format: 'MMM d', calendar: calendar() } | async) +\n ')'\n \"\n class=\"ax-scheduler-timeline-spanning-appointment {{\n spanning.appointment.cssClass ??\n 'ax-scheduler-' + (spanning.appointment.priority ?? 'primary') + '-priority'\n }}\"\n [class.ax-spanning-start-clipped]=\"spanning.isStartClipped\"\n [class.ax-spanning-end-clipped]=\"spanning.isEndClipped\"\n [class.ax-state-active]=\"isActive(spanning.appointment.id)\"\n [style.grid-column]=\"spanning.startDayIndex + 1 + ' / span ' + spanning.spanCount\"\n [style.grid-row]=\"spanning.rowIndex + 1\"\n >\n <span class=\"ax-spanning-appointment-title\">\n <span class=\"ax-scheduler-truncate\">{{ spanning.appointment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleSpanningActionClick($event, spanning.appointment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n ></ax-icon>\n }\n </span>\n </div>\n }\n </div>\n }\n @for (daySlot of daysDataForTimelineViews(); track daySlot.date.date.getTime()) {\n <div class=\"ax-scheduler-timeline-weekly-column\">\n <div\n [class.ax-state-today]=\"isToday(daySlot.date)\"\n class=\"ax-scheduler-week-header-date-day {{\n daySlot.holiday.state !== 'none' ? (daySlot.holiday.holiday?.cssClass ?? 'ax-state-holiday') : ''\n }}\"\n [style.--ax-scheduler-holiday-color]=\"daySlot.holiday.holiday?.color ?? null\"\n >\n <span\n class=\"ax-scheduler-week-header-date-day-char ax-scheduler-truncate\"\n [axTooltip]=\"(daySlot.holiday.holiday?.description ?? daySlot.holiday.holiday?.title ?? '') | translate | async\"\n >\n {{ daySlot.date | format: 'date' : { format: 'dddd', calendar: calendar() } | async }}\n @if (daySlot.holiday.state === 'holiday' && daySlot.holiday.holiday.title) {\n ( {{ daySlot.holiday.holiday.title | translate | async }} )\n }\n </span>\n <span class=\"ax-scheduler-week-header-date-day-num\">\n {{ daySlot.date | format: 'date' : { format: 'DD', calendar: calendar() } | async }}\n </span>\n </div>\n <ax-scheduler-timeline-day-view\n [date]=\"daySlot.date\"\n [readonly]=\"readonly()\"\n [draggable]=\"draggable()\"\n [resources]=\"resources()\"\n [endDayHour]=\"endDayHour()\"\n [hasActions]=\"hasActions()\"\n [showResourceHeaders]=\"true\"\n [startDayHour]=\"startDayHour()\"\n [dragStartDelay]=\"dragStartDelay()\"\n [tooltipTemplate]=\"tooltipTemplate()\"\n [showCurrentTimeIndicator]=\"showCurrentTimeIndicator()\"\n [appointments]=\"getFilteredAppointmentsForDay(daySlot.originalAppointmentsForThisDay)\"\n [showUnassignedAppointments]=\"showUnassignedAppointments()\"\n (onActionClickInternal)=\"onActionClickInternal.emit($event)\"\n (slotClickedInternal)=\"slotClickedInternal.emit($event)\"\n (slotDblClickedInternal)=\"slotDblClickedInternal.emit($event)\"\n (slotRightClickedInternal)=\"slotRightClickedInternal.emit($event)\"\n (onAppointmentDropInternal)=\"handleDrop($event, undefined)\"\n (appointmentClickedInternal)=\"appointmentClickedInternal.emit($event)\"\n (appointmentDblClickedInternal)=\"appointmentDblClickedInternal.emit($event)\"\n (appointmentRightClickedInternal)=\"appointmentRightClickedInternal.emit($event)\"\n >\n </ax-scheduler-timeline-day-view>\n </div>\n }\n </div>\n} @else {\n <!-- Resource-based layout for weekly -->\n <div\n class=\"ax-scheduler-timeline-weekly-resource-container\"\n [style.--ax-comp-scheduler-hours-count]=\"getHoursCount()\"\n >\n <!-- Top header with day names -->\n <div class=\"ax-scheduler-timeline-weekly-top-header\">\n <!-- Resource placeholder -->\n <div class=\"ax-scheduler-timeline-weekly-resource-header-placeholder\"></div>\n <!-- Day headers -->\n @for (daySlot of daysDataForTimelineViews(); track daySlot.date.date.getTime()) {\n <div class=\"ax-scheduler-timeline-weekly-day-header\">\n <div\n [class.ax-state-today]=\"isToday(daySlot.date)\"\n class=\"ax-scheduler-week-header-date-day {{\n daySlot.holiday.state !== 'none' ? (daySlot.holiday.holiday?.cssClass ?? 'ax-state-holiday') : ''\n }}\"\n [style.--ax-scheduler-holiday-color]=\"daySlot.holiday.holiday?.color ?? null\"\n >\n <span\n class=\"ax-scheduler-week-header-date-day-char ax-scheduler-truncate\"\n [axTooltip]=\"(daySlot.holiday.holiday?.description ?? daySlot.holiday.holiday?.title ?? '') | translate | async\"\n >\n {{ daySlot.date | format: 'date' : { format: 'dddd', calendar: calendar() } | async }}\n @if (daySlot.holiday.state === 'holiday' && daySlot.holiday.holiday.title) {\n ( {{ daySlot.holiday.holiday.title | translate | async }} )\n }\n </span>\n <span class=\"ax-scheduler-week-header-date-day-num\">\n {{ daySlot.date | format: 'date' : { format: 'DD', calendar: calendar() } | async }}\n </span>\n </div>\n </div>\n }\n </div>\n\n <!-- Time header with hours for each day -->\n <div class=\"ax-scheduler-timeline-weekly-time-header\">\n <!-- Resource placeholder -->\n <div class=\"ax-scheduler-timeline-weekly-time-header-placeholder\"><span>Resources</span></div>\n <!-- Time slots for each day -->\n @for (daySlot of daysDataForTimelineViews(); track daySlot.date.date.getTime()) {\n <div class=\"ax-scheduler-timeline-weekly-day-time-slots\">\n @for (hour of getHoursArray(); track hour.date.getTime()) {\n <div class=\"ax-scheduler-timeline-weekly-time-slot\">\n <span>{{ hour | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}</span>\n </div>\n }\n </div>\n }\n </div>\n\n <!-- Main content area -->\n <div class=\"ax-scheduler-timeline-weekly-content\">\n <!-- Resource headers column -->\n <div class=\"ax-scheduler-timeline-weekly-resource-headers\">\n <!-- Resource headers -->\n @for (resourceId of resourceIds(); track resourceId) {\n <div\n class=\"ax-scheduler-timeline-weekly-resource-header\"\n [style.height]=\"getResourceRowHeight(resourceId)\"\n [style.--resource-spanning-rows-count]=\"getMaxSpanningRowsForResource(resourceId)\"\n >\n @if (resourceTemplate() && typeof resourceTemplate() !== 'string') {\n <ng-container\n [ngTemplateOutlet]=\"$any(resourceTemplate())\"\n [ngTemplateOutletContext]=\"{\n $implicit: getResourceContext(resourceId),\n resource: getResourceContext(resourceId),\n resourceId: resourceId,\n }\"\n ></ng-container>\n } @else {\n <span class=\"ax-scheduler-timeline-resource-title\">{{ getResourceTitle(resourceId) }}</span>\n }\n </div>\n }\n </div>\n\n <!-- Days columns -->\n <div class=\"ax-scheduler-timeline-weekly-days-container\" #daysContainer>\n @for (daySlot of daysDataForTimelineViews(); track daySlot.date.date.getTime(); let dayIndex = $index) {\n <div class=\"ax-scheduler-timeline-weekly-column\">\n <!-- Current Time Line Indicator for this day -->\n @if (\n showCurrentTimeIndicator() &&\n shouldShowCurrentTimeForDay(daySlot.date) &&\n getCurrentTimePosition() !== null\n ) {\n <div\n class=\"ax-scheduler-current-time-line\"\n [style.inset-inline-start.%]=\"getCurrentTimePosition()\"\n #currentTimeLine\n ></div>\n }\n <!-- Resource rows for this day -->\n <div class=\"ax-scheduler-timeline-weekly-resource-rows\">\n @for (resourceId of resourceIds(); track resourceId) {\n <div\n class=\"ax-scheduler-timeline-weekly-resource-row\"\n [style.height]=\"getResourceRowHeight(resourceId)\"\n [style.--resource-spanning-rows-count]=\"getMaxSpanningRowsForResource(resourceId)\"\n >\n <!-- Spanning layer for this resource (only on first day column) -->\n @if (dayIndex === 0 && getSpanningAppointmentsForResource(resourceId).length > 0) {\n <div\n class=\"ax-scheduler-timeline-resource-spanning-layer\"\n [style.--timeline-days-count]=\"daysDataForTimelineViews().length\"\n >\n @for (spanning of getSpanningAppointmentsForResource(resourceId); track spanning.appointment.id) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragData]=\"spanning.appointment\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || spanning.appointment.readonly || readonly()\"\n (click)=\"handleSpanningAppointmentEvent($event, spanning.appointment)\"\n (dblclick)=\"handleSpanningAppointmentEvent($event, spanning.appointment)\"\n (contextmenu)=\"handleSpanningAppointmentEvent($event, spanning.appointment)\"\n [title]=\"\n spanning.appointment.title +\n ' (' +\n (spanning.appointment.startDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async) +\n ' - ' +\n (spanning.appointment.endDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async) +\n ')'\n \"\n class=\"ax-scheduler-timeline-spanning-appointment {{\n spanning.appointment.cssClass ??\n 'ax-scheduler-' + (spanning.appointment.priority ?? 'primary') + '-priority'\n }}\"\n [class.ax-spanning-start-clipped]=\"spanning.isStartClipped\"\n [class.ax-spanning-end-clipped]=\"spanning.isEndClipped\"\n [class.ax-state-active]=\"isActive(spanning.appointment.id)\"\n [style.grid-column]=\"spanning.startDayIndex + 1 + ' / span ' + spanning.spanCount\"\n [style.grid-row]=\"spanning.rowIndex + 1\"\n >\n <span class=\"ax-spanning-appointment-title\">\n <span class=\"ax-scheduler-truncate\">{{ spanning.appointment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleSpanningActionClick($event, spanning.appointment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n ></ax-icon>\n }\n </span>\n </div>\n }\n </div>\n }\n <ax-scheduler-timeline-day-view\n [date]=\"daySlot.date\"\n [readonly]=\"readonly()\"\n [draggable]=\"draggable()\"\n [resources]=\"\n resourceId === 'unassigned' ? [] : [{ id: resourceId, title: getResourceTitle(resourceId) }]\n \"\n [endDayHour]=\"endDayHour()\"\n [hasActions]=\"hasActions()\"\n [showResourceHeaders]=\"false\"\n [startDayHour]=\"startDayHour()\"\n [showCurrentTimeIndicator]=\"false\"\n [dragStartDelay]=\"dragStartDelay()\"\n [tooltipTemplate]=\"tooltipTemplate()\"\n [showUnassignedAppointments]=\"resourceId === 'unassigned'\"\n [appointments]=\"\n getFilteredAppointmentsForDay(\n getAppointmentsForResourceAndDay(resourceId, daySlot.originalAppointmentsForThisDay)\n )\n \"\n (onActionClickInternal)=\"onActionClickInternal.emit($event)\"\n (slotClickedInternal)=\"slotClickedInternal.emit($event)\"\n (slotDblClickedInternal)=\"slotDblClickedInternal.emit($event)\"\n (slotRightClickedInternal)=\"slotRightClickedInternal.emit($event)\"\n (onAppointmentDropInternal)=\"handleDrop($event, resourceId)\"\n (appointmentClickedInternal)=\"appointmentClickedInternal.emit($event)\"\n (appointmentDblClickedInternal)=\"appointmentDblClickedInternal.emit($event)\"\n (appointmentRightClickedInternal)=\"appointmentRightClickedInternal.emit($event)\"\n >\n </ax-scheduler-timeline-day-view>\n </div>\n }\n </div>\n </div>\n }\n </div>\n </div>\n </div>\n}\n", styles: ["@layer properties;@layer components{ax-scheduler-timeline-weekly-view{--ax-scheduler-timeline-spanning-row-height: 1.5rem;--ax-scheduler-timeline-spanning-gap: .125rem;background-color:inherit}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container{position:relative;display:flex;height:100%;flex-direction:row;background-color:inherit}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container .ax-scheduler-timeline-weekly-spanning-layer{pointer-events:none;position:absolute;inset-inline-start:calc(var(--spacing, .25rem) * 0);inset-inline-end:calc(var(--spacing, .25rem) * 0);top:calc(var(--spacing, .25rem) * 16);z-index:5;display:grid;align-content:flex-start;padding-inline:calc(var(--spacing, .25rem) * .5);padding-block:calc(var(--spacing, .25rem) * 1);row-gap:var(--ax-scheduler-timeline-spanning-gap);grid-auto-rows:var(--ax-scheduler-timeline-spanning-row-height);grid-template-columns:repeat(var(--timeline-days-count, 7),calc(var(--ax-comp-scheduler-timeline-view-blocks-width) * var(--ax-comp-scheduler-hours-count, 16)))}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container .ax-scheduler-timeline-weekly-spanning-layer .ax-scheduler-timeline-spanning-appointment{z-index:6;display:flex;cursor:pointer;align-items:center;overflow:hidden;text-overflow:ellipsis;border-radius:var(--radius-sm, .25rem);padding-inline:calc(var(--spacing, .25rem) * 1);padding-block:calc(var(--spacing, .25rem) * .5);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));white-space:nowrap;margin-inline:.125rem;pointer-events:auto}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container .ax-scheduler-timeline-weekly-spanning-layer .ax-scheduler-timeline-spanning-appointment .ax-spanning-appointment-title{display:flex;height:100%;width:100%;align-items:center;justify-content:space-between;padding-inline:calc(var(--spacing, .25rem) * 2)}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container .ax-scheduler-timeline-weekly-spanning-layer .ax-scheduler-timeline-spanning-appointment .ax-spanning-appointment-title .ax-scheduler-truncate{min-width:calc(var(--spacing, .25rem) * 0);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container .ax-scheduler-timeline-weekly-spanning-layer .ax-scheduler-timeline-spanning-appointment .ax-spanning-appointment-title .ax-scheduler-action-icon{margin-inline-start:calc(var(--spacing, .25rem) * 1);width:auto;flex-shrink:0;cursor:pointer}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container .ax-scheduler-timeline-weekly-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-start-clipped{position:relative;border-start-start-radius:0;border-end-start-radius:0;margin-inline-start:0}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container .ax-scheduler-timeline-weekly-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-start-clipped:before{content:\"\\2190 \";position:absolute;top:calc(var(--spacing, .25rem) * .5);font-size:.65rem;opacity:70%;inset-inline-start:0}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container .ax-scheduler-timeline-weekly-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-end-clipped{position:relative;border-start-end-radius:0;border-end-end-radius:0;margin-inline-end:0}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container .ax-scheduler-timeline-weekly-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-end-clipped:after{content:\" \\2192\";position:absolute;top:calc(var(--spacing, .25rem) * .5);font-size:.65rem;opacity:70%;inset-inline-end:0}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day{position:relative;display:flex;height:calc(var(--spacing, .25rem) * 16);flex-direction:column;align-items:flex-start;justify-content:center;gap:calc(var(--spacing, .25rem) * 1);border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 1)}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day.ax-state-today{background-color:rgba(var(--ax-sys-color-primary-surface));color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day.ax-state-today{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 5%,transparent)}}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day.ax-state-today .ax-scheduler-week-header-date-day-char{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day.ax-state-today .ax-scheduler-week-header-date-day-num{--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700)}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day.ax-state-holiday{color:var(--ax-scheduler-holiday-color, rgba(var(--ax-sys-color-danger-surface)))}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day.ax-state-holiday.ax-state-today{color:rgba(var(--ax-sys-color-primary-surface))}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day .ax-scheduler-week-header-date-day-char{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 4);max-width:100%;--tw-font-weight: var(--font-weight-light, 300);font-weight:var(--font-weight-light, 300)}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day .ax-scheduler-week-header-date-day-num{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 4);font-size:var(--text-xl, 1.25rem);line-height:var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container ax-scheduler-timeline-day-view{height:calc(100% - 4rem - var(--spanning-rows-count, 0) * (var(--ax-scheduler-timeline-spanning-row-height) + var(--ax-scheduler-timeline-spanning-gap)) - .5rem);margin-top:calc(var(--spanning-rows-count, 0) * (var(--ax-scheduler-timeline-spanning-row-height) + var(--ax-scheduler-timeline-spanning-gap)) + .5rem)}ax-scheduler-timeline-weekly-view ax-scheduler-timeline-day-view{height:calc(100% - 4rem)}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container{display:flex;height:100%;flex-direction:column;overflow:auto;background-color:inherit}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-top-header{position:sticky;top:calc(var(--spacing, .25rem) * 0);z-index:10;display:flex;min-width:max-content;flex-direction:row;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-top-header .ax-scheduler-timeline-weekly-resource-header-placeholder{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 0);z-index:15;display:flex;height:calc(var(--spacing, .25rem) * 16);width:var(--ax-comp-scheduler-resource-header-width,8rem);min-width:var(--ax-comp-scheduler-resource-header-width,8rem);align-items:center;justify-content:center;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-top-header .ax-scheduler-timeline-weekly-day-header{width:calc(var(--ax-comp-scheduler-timeline-view-blocks-width) * var(--ax-comp-scheduler-hours-count,16));min-width:calc(var(--ax-comp-scheduler-timeline-view-blocks-width) * var(--ax-comp-scheduler-hours-count,16));flex-shrink:0;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-top-header .ax-scheduler-timeline-weekly-day-header .ax-scheduler-week-header-date-day{position:relative;display:flex;height:calc(var(--spacing, .25rem) * 16);flex-direction:column;align-items:flex-start;justify-content:center;gap:calc(var(--spacing, .25rem) * 1);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 1)}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-top-header .ax-scheduler-timeline-weekly-day-header .ax-scheduler-week-header-date-day.ax-state-today{background-color:rgba(var(--ax-sys-color-primary-surface));color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-top-header .ax-scheduler-timeline-weekly-day-header .ax-scheduler-week-header-date-day.ax-state-today{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 5%,transparent)}}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-top-header .ax-scheduler-timeline-weekly-day-header .ax-scheduler-week-header-date-day.ax-state-today .ax-scheduler-week-header-date-day-char{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-top-header .ax-scheduler-timeline-weekly-day-header .ax-scheduler-week-header-date-day.ax-state-today .ax-scheduler-week-header-date-day-num{--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700)}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-top-header .ax-scheduler-timeline-weekly-day-header .ax-scheduler-week-header-date-day.ax-state-holiday{color:var(--ax-scheduler-holiday-color, rgba(var(--ax-sys-color-danger-surface)))}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-top-header .ax-scheduler-timeline-weekly-day-header .ax-scheduler-week-header-date-day.ax-state-holiday.ax-state-today{color:rgba(var(--ax-sys-color-primary-surface))}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-top-header .ax-scheduler-timeline-weekly-day-header .ax-scheduler-week-header-date-day .ax-scheduler-week-header-date-day-char{position:sticky;max-width:100%;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-light, 300);font-weight:var(--font-weight-light, 300);inset-inline-start:calc(var(--ax-comp-scheduler-resource-header-width, 8rem) + 1rem)}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-top-header .ax-scheduler-timeline-weekly-day-header .ax-scheduler-week-header-date-day .ax-scheduler-week-header-date-day-num{position:sticky;font-size:var(--text-xl, 1.25rem);line-height:var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);inset-inline-start:calc(var(--ax-comp-scheduler-resource-header-width, 8rem) + 1rem)}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-time-header{position:sticky;top:calc(var(--spacing, .25rem) * 16);z-index:10;display:flex;min-width:max-content;flex-direction:row;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-time-header .ax-scheduler-timeline-weekly-time-header-placeholder{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 0);z-index:15;display:flex;height:calc(var(--spacing, .25rem) * 8);width:var(--ax-comp-scheduler-resource-header-width,8rem);min-width:var(--ax-comp-scheduler-resource-header-width,8rem);align-items:center;justify-content:center;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-time-header .ax-scheduler-timeline-weekly-day-time-slots{display:flex;height:calc(var(--spacing, .25rem) * 8);width:calc(var(--ax-comp-scheduler-timeline-view-blocks-width) * var(--ax-comp-scheduler-hours-count,16));min-width:calc(var(--ax-comp-scheduler-timeline-view-blocks-width) * var(--ax-comp-scheduler-hours-count,16));flex-shrink:0;flex-direction:row;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-time-header .ax-scheduler-timeline-weekly-day-time-slots .ax-scheduler-timeline-weekly-time-slot{position:relative;display:flex;width:var(--ax-comp-scheduler-timeline-view-blocks-width);min-width:var(--ax-comp-scheduler-timeline-view-blocks-width);flex-shrink:0;align-items:center;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 4)}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-time-header .ax-scheduler-timeline-weekly-day-time-slots .ax-scheduler-timeline-weekly-time-slot span{position:sticky;z-index:5;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-normal, 400);font-weight:var(--font-weight-normal, 400);inset-inline-start:calc(var(--ax-comp-scheduler-resource-header-width, 8rem) + 1rem)}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content{display:flex;min-height:calc(var(--spacing, .25rem) * 0);width:fit-content;flex:1;flex-direction:row;align-items:stretch;background-color:inherit}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-resource-headers{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 0);z-index:15;display:flex;width:var(--ax-comp-scheduler-resource-header-width,8rem);min-width:var(--ax-comp-scheduler-resource-header-width,8rem);flex-direction:column;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-resource-headers .ax-scheduler-timeline-weekly-resource-header{box-sizing:border-box;display:flex;align-items:center;justify-content:center;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));padding:calc(var(--spacing, .25rem) * 2)}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-resource-headers .ax-scheduler-timeline-weekly-resource-header .ax-scheduler-timeline-resource-title{text-align:center;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);overflow-wrap:break-word}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container{display:flex;min-width:max-content;flex:1;flex-direction:row}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column{position:relative;display:flex;width:calc(var(--ax-comp-scheduler-timeline-view-blocks-width) * var(--ax-comp-scheduler-hours-count,16));min-width:calc(var(--ax-comp-scheduler-timeline-view-blocks-width) * var(--ax-comp-scheduler-hours-count,16));flex-shrink:0;flex-direction:column;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows{display:flex;flex:1;flex-direction:column}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows .ax-scheduler-timeline-weekly-resource-row{position:relative;box-sizing:border-box;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows .ax-scheduler-timeline-weekly-resource-row .ax-scheduler-timeline-resource-spanning-layer{pointer-events:none;position:absolute;inset-inline-start:calc(var(--spacing, .25rem) * 0);top:calc(var(--spacing, .25rem) * 0);z-index:5;display:grid;align-content:flex-start;padding-inline:calc(var(--spacing, .25rem) * .5);padding-block:calc(var(--spacing, .25rem) * 1);row-gap:var(--ax-scheduler-timeline-spanning-gap);grid-auto-rows:var(--ax-scheduler-timeline-spanning-row-height);width:calc(var(--timeline-days-count, 7) * var(--ax-comp-scheduler-timeline-view-blocks-width) * var(--ax-comp-scheduler-hours-count, 16));grid-template-columns:repeat(var(--timeline-days-count, 7),calc(var(--ax-comp-scheduler-timeline-view-blocks-width) * var(--ax-comp-scheduler-hours-count, 16)))}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows .ax-scheduler-timeline-weekly-resource-row .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment{z-index:6;display:flex;cursor:pointer;align-items:center;overflow:hidden;text-overflow:ellipsis;border-radius:var(--radius-sm, .25rem);padding-inline:calc(var(--spacing, .25rem) * 1);padding-block:calc(var(--spacing, .25rem) * .5);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));white-space:nowrap;margin-inline:.125rem;pointer-events:auto}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows .ax-scheduler-timeline-weekly-resource-row .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment .ax-spanning-appointment-title{display:flex;height:100%;width:100%;align-items:center;justify-content:space-between;padding-inline:calc(var(--spacing, .25rem) * 2)}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows .ax-scheduler-timeline-weekly-resource-row .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment .ax-spanning-appointment-title .ax-scheduler-truncate{min-width:calc(var(--spacing, .25rem) * 0);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows .ax-scheduler-timeline-weekly-resource-row .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment .ax-spanning-appointment-title .ax-scheduler-action-icon{margin-inline-start:calc(var(--spacing, .25rem) * 1);width:auto;flex-shrink:0;cursor:pointer}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows .ax-scheduler-timeline-weekly-resource-row .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-start-clipped{position:relative;border-start-start-radius:0;border-end-start-radius:0;margin-inline-start:0}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows .ax-scheduler-timeline-weekly-resource-row .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-start-clipped:before{content:\"\\2190 \";position:absolute;top:calc(var(--spacing, .25rem) * .5);font-size:.65rem;opacity:70%;inset-inline-start:0}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows .ax-scheduler-timeline-weekly-resource-row .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-end-clipped{position:relative;border-start-end-radius:0;border-end-end-radius:0;margin-inline-end:0}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows .ax-scheduler-timeline-weekly-resource-row .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-end-clipped:after{content:\" \\2192\";position:absolute;top:calc(var(--spacing, .25rem) * .5);font-size:.65rem;opacity:70%;inset-inline-end:0}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows .ax-scheduler-timeline-weekly-resource-row ax-scheduler-timeline-day-view{display:block;width:100%;height:100%}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows .ax-scheduler-timeline-weekly-resource-row ax-scheduler-timeline-day-view .ax-scheduler-timeline-header{display:none}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows .ax-scheduler-timeline-weekly-resource-row ax-scheduler-timeline-day-view .ax-scheduler-timeline-content{position:relative;height:100%}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows .ax-scheduler-timeline-weekly-resource-row ax-scheduler-timeline-day-view .ax-scheduler-timeline-appointment-container{position:absolute;width:100%;top:calc(var(--resource-spanning-rows-count, 0) * (var(--ax-scheduler-timeline-spanning-row-height) + var(--ax-scheduler-timeline-spanning-gap)) + .25rem);height:calc(100% - var(--resource-spanning-rows-count, 0) * (var(--ax-scheduler-timeline-spanning-row-height) + var(--ax-scheduler-timeline-spanning-gap)) - .25rem)}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows .ax-scheduler-timeline-weekly-resource-row ax-scheduler-timeline-day-view .ax-scheduler-timeline-appointment-container .ax-scheduler-timeline-appointment{position:absolute;inset-inline-start:calc(var(--spacing, .25rem) * 0);display:flex;width:100%;flex-direction:column;overflow:hidden;border-radius:calc(var(--ax-sys-border-radius) / 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1)}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows .ax-scheduler-timeline-weekly-resource-row ax-scheduler-timeline-day-view .ax-scheduler-timeline-slot-row{position:relative;box-sizing:border-box;display:flex;height:100%;width:max-content;padding-top:calc(var(--resource-spanning-rows-count, 0) * (var(--ax-scheduler-timeline-spanning-row-height) + var(--ax-scheduler-timeline-spanning-gap)) + .25rem)}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows .ax-scheduler-timeline-weekly-resource-row ax-scheduler-timeline-day-view .ax-scheduler-timeline-slot-row .ax-scheduler-timeline-slot-cell{position:relative;width:var(--ax-comp-scheduler-timeline-view-blocks-width);flex-shrink:0;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows .ax-scheduler-timeline-weekly-resource-row ax-scheduler-timeline-day-view .ax-scheduler-timeline-slot-row .ax-scheduler-timeline-slot-cell:after{inset-inline-end:calc(var(--spacing, .25rem) * 0);top:calc(var(--spacing, .25rem) * 0);height:100%;width:1px;background-color:rgba(var(--ax-sys-color-border-lightest-surface));--tw-content: \"\";content:var(--tw-content);position:absolute}@supports (color: color-mix(in lab,red,red)){ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows .ax-scheduler-timeline-weekly-resource-row ax-scheduler-timeline-day-view .ax-scheduler-timeline-slot-row .ax-scheduler-timeline-slot-cell:after{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-border-lightest-surface)) 30%,transparent)}}ax-scheduler-timeline-weekly-view .ax-scheduler-current-time-line{top:calc(var(--spacing, .25rem) * 0);bottom:calc(var(--spacing, .25rem) * 0);width:calc(var(--spacing, .25rem) * .5)}ax-scheduler-timeline-weekly-view .ax-scheduler-current-time-line:before{content:var(--tw-content);inset-inline-start:-5px}ax-scheduler-timeline-weekly-view .ax-scheduler-current-time-line:before{content:var(--tw-content);top:calc(var(--spacing, .25rem) * -1.5)}ax-scheduler.ax-rtl ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-spanning-appointment.ax-spanning-start-clipped:before{content:\"\\2192 \"}ax-scheduler.ax-rtl ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-spanning-appointment.ax-spanning-end-clipped:after{content:\" \\2190\"}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-content{syntax: \"*\"; inherits: false; initial-value: \"\";}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial;--tw-content: \"\"}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: AXDragDirective, selector: "[axDrag]", inputs: ["axDrag", "dragData", "dragDisabled", "dragTransition", "dragElementClone", "dropZoneGroup", "dragStartDelay", "dragResetOnDblClick", "dragLockAxis", "dragClonedTemplate", "dragCursor", "dragBoundary", "dragTransitionDuration"], outputs: ["dragPositionChanged"] }, { kind: "directive", type: AXTooltipDirective, selector: "[axTooltip]", inputs: ["axTooltipDisabled", "axTooltip", "axTooltipContext", "axTooltipPlacement", "axTooltipOffsetX", "axTooltipOffsetY", "axTooltipOpenAfter", "axTooltipCloseAfter"] }, { kind: "component", type: AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: AXSchedulerTimelineDayViewComponent, selector: "ax-scheduler-timeline-day-view", inputs: ["readonly", "draggable", "hasActions", "dragStartDelay", "calendar", "showResourceHeaders", "date", "endDayHour", "selectedAppointmentId", "startDayHour", "showUnassignedAppointments", "resources", "showCurrentTimeIndicator", "scrollToCurrentTimeIndicator", "resourceTemplate", "appointments", "tooltipTemplate"], outputs: ["slotClickedInternal", "slotDblClickedInternal", "slotRightClickedInternal", "appointmentClickedInternal", "appointmentDblClickedInternal", "appointmentRightClickedInternal", "onActionClickInternal", "onAppointmentDropInternal"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXFormatPipe, name: "format" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
3538
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXSchedulerTimelineWeeklyViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
3539
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXSchedulerTimelineWeeklyViewComponent, isStandalone: true, selector: "ax-scheduler-timeline-weekly-view", inputs: { daysCount: { classPropertyName: "daysCount", publicName: "daysCount", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, draggable: { classPropertyName: "draggable", publicName: "draggable", isSignal: true, isRequired: false, transformFunction: null }, hasActions: { classPropertyName: "hasActions", publicName: "hasActions", isSignal: true, isRequired: false, transformFunction: null }, dragStartDelay: { classPropertyName: "dragStartDelay", publicName: "dragStartDelay", isSignal: true, isRequired: false, transformFunction: null }, calendar: { classPropertyName: "calendar", publicName: "calendar", isSignal: true, isRequired: false, transformFunction: null }, showResourceHeaders: { classPropertyName: "showResourceHeaders", publicName: "showResourceHeaders", isSignal: true, isRequired: false, transformFunction: null }, date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: true, transformFunction: null }, endDayHour: { classPropertyName: "endDayHour", publicName: "endDayHour", isSignal: true, isRequired: true, transformFunction: null }, selectedAppointmentId: { classPropertyName: "selectedAppointmentId", publicName: "selectedAppointmentId", isSignal: true, isRequired: false, transformFunction: null }, showCurrentTimeIndicator: { classPropertyName: "showCurrentTimeIndicator", publicName: "showCurrentTimeIndicator", isSignal: true, isRequired: false, transformFunction: null }, scrollToCurrentTimeIndicator: { classPropertyName: "scrollToCurrentTimeIndicator", publicName: "scrollToCurrentTimeIndicator", isSignal: true, isRequired: false, transformFunction: null }, startDayHour: { classPropertyName: "startDayHour", publicName: "startDayHour", isSignal: true, isRequired: true, transformFunction: null }, showUnassignedAppointments: { classPropertyName: "showUnassignedAppointments", publicName: "showUnassignedAppointments", isSignal: true, isRequired: false, transformFunction: null }, resources: { classPropertyName: "resources", publicName: "resources", isSignal: true, isRequired: false, transformFunction: null }, resourceTemplate: { classPropertyName: "resourceTemplate", publicName: "resourceTemplate", isSignal: true, isRequired: false, transformFunction: null }, appointments: { classPropertyName: "appointments", publicName: "appointments", isSignal: true, isRequired: false, transformFunction: null }, tooltipTemplate: { classPropertyName: "tooltipTemplate", publicName: "tooltipTemplate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { slotClickedInternal: "slotClickedInternal", slotDblClickedInternal: "slotDblClickedInternal", slotRightClickedInternal: "slotRightClickedInternal", appointmentClickedInternal: "appointmentClickedInternal", appointmentDblClickedInternal: "appointmentDblClickedInternal", appointmentRightClickedInternal: "appointmentRightClickedInternal", onActionClickInternal: "onActionClickInternal", onAppointmentDropInternal: "onAppointmentDropInternal" }, host: { properties: { "class.ax-state-readonly": "readonly()" } }, providers: [{ provide: AXComponent, useExisting: AXSchedulerTimelineWeeklyViewComponent }], viewQueries: [{ propertyName: "currentTimeLineElement", first: true, predicate: ["currentTimeLine"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (resources().length === 0 || !showResourceHeaders()) {\n <!-- Original layout when no resources -->\n <div class=\"ax-scheduler-timeline-day-view-container\" [style.--spanning-rows-count]=\"maxSpanningRows()\">\n <!-- Spanning appointments layer -->\n @if (spanningAppointments().length > 0) {\n <div\n class=\"ax-scheduler-timeline-weekly-spanning-layer\"\n [style.--timeline-days-count]=\"daysDataForTimelineViews().length\"\n >\n @for (spanning of spanningAppointments(); track spanning.appointment.id) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragData]=\"spanning.appointment\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || spanning.appointment.readonly || readonly()\"\n (click)=\"handleSpanningAppointmentEvent($event, spanning.appointment)\"\n (dblclick)=\"handleSpanningAppointmentEvent($event, spanning.appointment)\"\n (contextmenu)=\"handleSpanningAppointmentEvent($event, spanning.appointment)\"\n [title]=\"\n spanning.appointment.title +\n ' (' +\n (spanning.appointment.startDate | format: 'date' : { format: 'MMM d', calendar: calendar() } | async) +\n ' - ' +\n (spanning.appointment.endDate | format: 'date' : { format: 'MMM d', calendar: calendar() } | async) +\n ')'\n \"\n class=\"ax-scheduler-timeline-spanning-appointment {{\n spanning.appointment.cssClass ??\n 'ax-scheduler-' + (spanning.appointment.priority ?? 'primary') + '-priority'\n }}\"\n [class.ax-spanning-start-clipped]=\"spanning.isStartClipped\"\n [class.ax-spanning-end-clipped]=\"spanning.isEndClipped\"\n [class.ax-state-active]=\"isActive(spanning.appointment.id)\"\n [style.grid-column]=\"spanning.startDayIndex + 1 + ' / span ' + spanning.spanCount\"\n [style.grid-row]=\"spanning.rowIndex + 1\"\n >\n <span class=\"ax-spanning-appointment-title\">\n <span class=\"ax-scheduler-truncate\">{{ spanning.appointment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleSpanningActionClick($event, spanning.appointment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n ></ax-icon>\n }\n </span>\n </div>\n }\n </div>\n }\n @for (daySlot of daysDataForTimelineViews(); track daySlot.date.date.getTime()) {\n <div class=\"ax-scheduler-timeline-weekly-column\">\n <div\n [class.ax-state-today]=\"isToday(daySlot.date)\"\n class=\"ax-scheduler-week-header-date-day {{\n daySlot.holiday.state !== 'none' ? (daySlot.holiday.holiday?.cssClass ?? 'ax-state-holiday') : ''\n }}\"\n [style.--ax-scheduler-holiday-color]=\"daySlot.holiday.holiday?.color ?? null\"\n >\n <span\n class=\"ax-scheduler-week-header-date-day-char ax-scheduler-truncate\"\n [axTooltip]=\"(daySlot.holiday.holiday?.description ?? daySlot.holiday.holiday?.title ?? '') | translate | async\"\n >\n {{ daySlot.date | format: 'date' : { format: 'dddd', calendar: calendar() } | async }}\n @if (daySlot.holiday.state === 'holiday' && daySlot.holiday.holiday.title) {\n ( {{ daySlot.holiday.holiday.title | translate | async }} )\n }\n </span>\n <span class=\"ax-scheduler-week-header-date-day-num\">\n {{ daySlot.date | format: 'date' : { format: 'DD', calendar: calendar() } | async }}\n </span>\n </div>\n <ax-scheduler-timeline-day-view\n [date]=\"daySlot.date\"\n [readonly]=\"readonly()\"\n [draggable]=\"draggable()\"\n [resources]=\"resources()\"\n [endDayHour]=\"endDayHour()\"\n [hasActions]=\"hasActions()\"\n [showResourceHeaders]=\"true\"\n [startDayHour]=\"startDayHour()\"\n [dragStartDelay]=\"dragStartDelay()\"\n [tooltipTemplate]=\"tooltipTemplate()\"\n [showCurrentTimeIndicator]=\"showCurrentTimeIndicator()\"\n [appointments]=\"getFilteredAppointmentsForDay(daySlot.originalAppointmentsForThisDay)\"\n [showUnassignedAppointments]=\"showUnassignedAppointments()\"\n (onActionClickInternal)=\"onActionClickInternal.emit($event)\"\n (slotClickedInternal)=\"slotClickedInternal.emit($event)\"\n (slotDblClickedInternal)=\"slotDblClickedInternal.emit($event)\"\n (slotRightClickedInternal)=\"slotRightClickedInternal.emit($event)\"\n (onAppointmentDropInternal)=\"handleDrop($event, undefined)\"\n (appointmentClickedInternal)=\"appointmentClickedInternal.emit($event)\"\n (appointmentDblClickedInternal)=\"appointmentDblClickedInternal.emit($event)\"\n (appointmentRightClickedInternal)=\"appointmentRightClickedInternal.emit($event)\"\n >\n </ax-scheduler-timeline-day-view>\n </div>\n }\n </div>\n} @else {\n <!-- Resource-based layout for weekly -->\n <div\n class=\"ax-scheduler-timeline-weekly-resource-container\"\n [style.--ax-comp-scheduler-hours-count]=\"getHoursCount()\"\n >\n <!-- Top header with day names -->\n <div class=\"ax-scheduler-timeline-weekly-top-header\">\n <!-- Resource placeholder -->\n <div class=\"ax-scheduler-timeline-weekly-resource-header-placeholder\"></div>\n <!-- Day headers -->\n @for (daySlot of daysDataForTimelineViews(); track daySlot.date.date.getTime()) {\n <div class=\"ax-scheduler-timeline-weekly-day-header\">\n <div\n [class.ax-state-today]=\"isToday(daySlot.date)\"\n class=\"ax-scheduler-week-header-date-day {{\n daySlot.holiday.state !== 'none' ? (daySlot.holiday.holiday?.cssClass ?? 'ax-state-holiday') : ''\n }}\"\n [style.--ax-scheduler-holiday-color]=\"daySlot.holiday.holiday?.color ?? null\"\n >\n <span\n class=\"ax-scheduler-week-header-date-day-char ax-scheduler-truncate\"\n [axTooltip]=\"(daySlot.holiday.holiday?.description ?? daySlot.holiday.holiday?.title ?? '') | translate | async\"\n >\n {{ daySlot.date | format: 'date' : { format: 'dddd', calendar: calendar() } | async }}\n @if (daySlot.holiday.state === 'holiday' && daySlot.holiday.holiday.title) {\n ( {{ daySlot.holiday.holiday.title | translate | async }} )\n }\n </span>\n <span class=\"ax-scheduler-week-header-date-day-num\">\n {{ daySlot.date | format: 'date' : { format: 'DD', calendar: calendar() } | async }}\n </span>\n </div>\n </div>\n }\n </div>\n\n <!-- Time header with hours for each day -->\n <div class=\"ax-scheduler-timeline-weekly-time-header\">\n <!-- Resource placeholder -->\n <div class=\"ax-scheduler-timeline-weekly-time-header-placeholder\"><span>Resources</span></div>\n <!-- Time slots for each day -->\n @for (daySlot of daysDataForTimelineViews(); track daySlot.date.date.getTime()) {\n <div class=\"ax-scheduler-timeline-weekly-day-time-slots\">\n @for (hour of getHoursArray(); track hour.date.getTime()) {\n <div class=\"ax-scheduler-timeline-weekly-time-slot\">\n <span>{{ hour | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}</span>\n </div>\n }\n </div>\n }\n </div>\n\n <!-- Main content area -->\n <div class=\"ax-scheduler-timeline-weekly-content\">\n <!-- Resource headers column -->\n <div class=\"ax-scheduler-timeline-weekly-resource-headers\">\n <!-- Resource headers -->\n @for (resourceId of resourceIds(); track resourceId) {\n <div\n class=\"ax-scheduler-timeline-weekly-resource-header\"\n [style.height]=\"getResourceRowHeight(resourceId)\"\n [style.--resource-spanning-rows-count]=\"getMaxSpanningRowsForResource(resourceId)\"\n >\n @if (resourceTemplate() && typeof resourceTemplate() !== 'string') {\n <ng-container\n [ngTemplateOutlet]=\"$any(resourceTemplate())\"\n [ngTemplateOutletContext]=\"{\n $implicit: getResourceContext(resourceId),\n resource: getResourceContext(resourceId),\n resourceId: resourceId,\n }\"\n ></ng-container>\n } @else {\n <span class=\"ax-scheduler-timeline-resource-title\">{{ getResourceTitle(resourceId) }}</span>\n }\n </div>\n }\n </div>\n\n <!-- Days columns -->\n <div class=\"ax-scheduler-timeline-weekly-days-container\" #daysContainer>\n @for (daySlot of daysDataForTimelineViews(); track daySlot.date.date.getTime(); let dayIndex = $index) {\n <div class=\"ax-scheduler-timeline-weekly-column\">\n <!-- Current Time Line Indicator for this day -->\n @if (\n showCurrentTimeIndicator() &&\n shouldShowCurrentTimeForDay(daySlot.date) &&\n getCurrentTimePosition() !== null\n ) {\n <div\n class=\"ax-scheduler-current-time-line\"\n [style.inset-inline-start.%]=\"getCurrentTimePosition()\"\n #currentTimeLine\n ></div>\n }\n <!-- Resource rows for this day -->\n <div class=\"ax-scheduler-timeline-weekly-resource-rows\">\n @for (resourceId of resourceIds(); track resourceId) {\n <div\n class=\"ax-scheduler-timeline-weekly-resource-row\"\n [style.height]=\"getResourceRowHeight(resourceId)\"\n [style.--resource-spanning-rows-count]=\"getMaxSpanningRowsForResource(resourceId)\"\n >\n <!-- Spanning layer for this resource (only on first day column) -->\n @if (dayIndex === 0 && getSpanningAppointmentsForResource(resourceId).length > 0) {\n <div\n class=\"ax-scheduler-timeline-resource-spanning-layer\"\n [style.--timeline-days-count]=\"daysDataForTimelineViews().length\"\n >\n @for (spanning of getSpanningAppointmentsForResource(resourceId); track spanning.appointment.id) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragData]=\"spanning.appointment\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || spanning.appointment.readonly || readonly()\"\n (click)=\"handleSpanningAppointmentEvent($event, spanning.appointment)\"\n (dblclick)=\"handleSpanningAppointmentEvent($event, spanning.appointment)\"\n (contextmenu)=\"handleSpanningAppointmentEvent($event, spanning.appointment)\"\n [title]=\"\n spanning.appointment.title +\n ' (' +\n (spanning.appointment.startDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async) +\n ' - ' +\n (spanning.appointment.endDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async) +\n ')'\n \"\n class=\"ax-scheduler-timeline-spanning-appointment {{\n spanning.appointment.cssClass ??\n 'ax-scheduler-' + (spanning.appointment.priority ?? 'primary') + '-priority'\n }}\"\n [class.ax-spanning-start-clipped]=\"spanning.isStartClipped\"\n [class.ax-spanning-end-clipped]=\"spanning.isEndClipped\"\n [class.ax-state-active]=\"isActive(spanning.appointment.id)\"\n [style.grid-column]=\"spanning.startDayIndex + 1 + ' / span ' + spanning.spanCount\"\n [style.grid-row]=\"spanning.rowIndex + 1\"\n >\n <span class=\"ax-spanning-appointment-title\">\n <span class=\"ax-scheduler-truncate\">{{ spanning.appointment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleSpanningActionClick($event, spanning.appointment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n ></ax-icon>\n }\n </span>\n </div>\n }\n </div>\n }\n <ax-scheduler-timeline-day-view\n [date]=\"daySlot.date\"\n [readonly]=\"readonly()\"\n [draggable]=\"draggable()\"\n [resources]=\"\n resourceId === 'unassigned' ? [] : [{ id: resourceId, title: getResourceTitle(resourceId) }]\n \"\n [endDayHour]=\"endDayHour()\"\n [hasActions]=\"hasActions()\"\n [showResourceHeaders]=\"false\"\n [startDayHour]=\"startDayHour()\"\n [showCurrentTimeIndicator]=\"false\"\n [dragStartDelay]=\"dragStartDelay()\"\n [tooltipTemplate]=\"tooltipTemplate()\"\n [showUnassignedAppointments]=\"resourceId === 'unassigned'\"\n [appointments]=\"\n getFilteredAppointmentsForDay(\n getAppointmentsForResourceAndDay(resourceId, daySlot.originalAppointmentsForThisDay)\n )\n \"\n (onActionClickInternal)=\"onActionClickInternal.emit($event)\"\n (slotClickedInternal)=\"slotClickedInternal.emit($event)\"\n (slotDblClickedInternal)=\"slotDblClickedInternal.emit($event)\"\n (slotRightClickedInternal)=\"slotRightClickedInternal.emit($event)\"\n (onAppointmentDropInternal)=\"handleDrop($event, resourceId)\"\n (appointmentClickedInternal)=\"appointmentClickedInternal.emit($event)\"\n (appointmentDblClickedInternal)=\"appointmentDblClickedInternal.emit($event)\"\n (appointmentRightClickedInternal)=\"appointmentRightClickedInternal.emit($event)\"\n >\n </ax-scheduler-timeline-day-view>\n </div>\n }\n </div>\n </div>\n }\n </div>\n </div>\n </div>\n}\n", styles: ["@layer properties;@layer components{ax-scheduler-timeline-weekly-view{--ax-scheduler-timeline-spanning-row-height: 1.5rem;--ax-scheduler-timeline-spanning-gap: .125rem;background-color:inherit}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container{position:relative;display:flex;height:100%;flex-direction:row;background-color:inherit}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container .ax-scheduler-timeline-weekly-spanning-layer{pointer-events:none;position:absolute;inset-inline-start:calc(var(--spacing, .25rem) * 0);inset-inline-end:calc(var(--spacing, .25rem) * 0);top:calc(var(--spacing, .25rem) * 16);z-index:5;display:grid;align-content:flex-start;padding-inline:calc(var(--spacing, .25rem) * .5);padding-block:calc(var(--spacing, .25rem) * 1);row-gap:var(--ax-scheduler-timeline-spanning-gap);grid-auto-rows:var(--ax-scheduler-timeline-spanning-row-height);grid-template-columns:repeat(var(--timeline-days-count, 7),calc(var(--ax-comp-scheduler-timeline-view-blocks-width) * var(--ax-comp-scheduler-hours-count, 16)))}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container .ax-scheduler-timeline-weekly-spanning-layer .ax-scheduler-timeline-spanning-appointment{z-index:6;display:flex;cursor:pointer;align-items:center;overflow:hidden;text-overflow:ellipsis;border-radius:var(--radius-sm, .25rem);padding-inline:calc(var(--spacing, .25rem) * 1);padding-block:calc(var(--spacing, .25rem) * .5);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));white-space:nowrap;margin-inline:.125rem;pointer-events:auto}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container .ax-scheduler-timeline-weekly-spanning-layer .ax-scheduler-timeline-spanning-appointment .ax-spanning-appointment-title{display:flex;height:100%;width:100%;align-items:center;justify-content:space-between;padding-inline:calc(var(--spacing, .25rem) * 2)}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container .ax-scheduler-timeline-weekly-spanning-layer .ax-scheduler-timeline-spanning-appointment .ax-spanning-appointment-title .ax-scheduler-truncate{min-width:calc(var(--spacing, .25rem) * 0);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container .ax-scheduler-timeline-weekly-spanning-layer .ax-scheduler-timeline-spanning-appointment .ax-spanning-appointment-title .ax-scheduler-action-icon{margin-inline-start:calc(var(--spacing, .25rem) * 1);width:auto;flex-shrink:0;cursor:pointer}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container .ax-scheduler-timeline-weekly-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-start-clipped{position:relative;border-start-start-radius:0;border-end-start-radius:0;margin-inline-start:0}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container .ax-scheduler-timeline-weekly-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-start-clipped:before{content:\"\\2190 \";position:absolute;top:calc(var(--spacing, .25rem) * .5);font-size:.65rem;opacity:70%;inset-inline-start:0}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container .ax-scheduler-timeline-weekly-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-end-clipped{position:relative;border-start-end-radius:0;border-end-end-radius:0;margin-inline-end:0}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container .ax-scheduler-timeline-weekly-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-end-clipped:after{content:\" \\2192\";position:absolute;top:calc(var(--spacing, .25rem) * .5);font-size:.65rem;opacity:70%;inset-inline-end:0}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day{position:relative;display:flex;height:calc(var(--spacing, .25rem) * 16);flex-direction:column;align-items:flex-start;justify-content:center;gap:calc(var(--spacing, .25rem) * 1);border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 1)}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day.ax-state-today{background-color:rgba(var(--ax-sys-color-primary-surface));color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day.ax-state-today{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 5%,transparent)}}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day.ax-state-today .ax-scheduler-week-header-date-day-char{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day.ax-state-today .ax-scheduler-week-header-date-day-num{--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700)}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day.ax-state-holiday{color:var(--ax-scheduler-holiday-color, rgba(var(--ax-sys-color-danger-surface)))}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day.ax-state-holiday.ax-state-today{color:rgba(var(--ax-sys-color-primary-surface))}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day .ax-scheduler-week-header-date-day-char{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 4);max-width:100%;--tw-font-weight: var(--font-weight-light, 300);font-weight:var(--font-weight-light, 300)}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day .ax-scheduler-week-header-date-day-num{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 4);font-size:var(--text-xl, 1.25rem);line-height:var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-day-view-container ax-scheduler-timeline-day-view{height:calc(100% - 4rem - var(--spanning-rows-count, 0) * (var(--ax-scheduler-timeline-spanning-row-height) + var(--ax-scheduler-timeline-spanning-gap)) - .5rem);margin-top:calc(var(--spanning-rows-count, 0) * (var(--ax-scheduler-timeline-spanning-row-height) + var(--ax-scheduler-timeline-spanning-gap)) + .5rem)}ax-scheduler-timeline-weekly-view ax-scheduler-timeline-day-view{height:calc(100% - 4rem)}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container{display:flex;height:100%;flex-direction:column;overflow:auto;background-color:inherit}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-top-header{position:sticky;top:calc(var(--spacing, .25rem) * 0);z-index:10;display:flex;min-width:max-content;flex-direction:row;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-top-header .ax-scheduler-timeline-weekly-resource-header-placeholder{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 0);z-index:15;display:flex;height:calc(var(--spacing, .25rem) * 16);width:var(--ax-comp-scheduler-resource-header-width,8rem);min-width:var(--ax-comp-scheduler-resource-header-width,8rem);align-items:center;justify-content:center;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-top-header .ax-scheduler-timeline-weekly-day-header{width:calc(var(--ax-comp-scheduler-timeline-view-blocks-width) * var(--ax-comp-scheduler-hours-count,16));min-width:calc(var(--ax-comp-scheduler-timeline-view-blocks-width) * var(--ax-comp-scheduler-hours-count,16));flex-shrink:0;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-top-header .ax-scheduler-timeline-weekly-day-header .ax-scheduler-week-header-date-day{position:relative;display:flex;height:calc(var(--spacing, .25rem) * 16);flex-direction:column;align-items:flex-start;justify-content:center;gap:calc(var(--spacing, .25rem) * 1);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 1)}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-top-header .ax-scheduler-timeline-weekly-day-header .ax-scheduler-week-header-date-day.ax-state-today{background-color:rgba(var(--ax-sys-color-primary-surface));color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-top-header .ax-scheduler-timeline-weekly-day-header .ax-scheduler-week-header-date-day.ax-state-today{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 5%,transparent)}}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-top-header .ax-scheduler-timeline-weekly-day-header .ax-scheduler-week-header-date-day.ax-state-today .ax-scheduler-week-header-date-day-char{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-top-header .ax-scheduler-timeline-weekly-day-header .ax-scheduler-week-header-date-day.ax-state-today .ax-scheduler-week-header-date-day-num{--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700)}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-top-header .ax-scheduler-timeline-weekly-day-header .ax-scheduler-week-header-date-day.ax-state-holiday{color:var(--ax-scheduler-holiday-color, rgba(var(--ax-sys-color-danger-surface)))}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-top-header .ax-scheduler-timeline-weekly-day-header .ax-scheduler-week-header-date-day.ax-state-holiday.ax-state-today{color:rgba(var(--ax-sys-color-primary-surface))}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-top-header .ax-scheduler-timeline-weekly-day-header .ax-scheduler-week-header-date-day .ax-scheduler-week-header-date-day-char{position:sticky;max-width:100%;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-light, 300);font-weight:var(--font-weight-light, 300);inset-inline-start:calc(var(--ax-comp-scheduler-resource-header-width, 8rem) + 1rem)}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-top-header .ax-scheduler-timeline-weekly-day-header .ax-scheduler-week-header-date-day .ax-scheduler-week-header-date-day-num{position:sticky;font-size:var(--text-xl, 1.25rem);line-height:var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);inset-inline-start:calc(var(--ax-comp-scheduler-resource-header-width, 8rem) + 1rem)}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-time-header{position:sticky;top:calc(var(--spacing, .25rem) * 16);z-index:10;display:flex;min-width:max-content;flex-direction:row;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-time-header .ax-scheduler-timeline-weekly-time-header-placeholder{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 0);z-index:15;display:flex;height:calc(var(--spacing, .25rem) * 8);width:var(--ax-comp-scheduler-resource-header-width,8rem);min-width:var(--ax-comp-scheduler-resource-header-width,8rem);align-items:center;justify-content:center;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-time-header .ax-scheduler-timeline-weekly-day-time-slots{display:flex;height:calc(var(--spacing, .25rem) * 8);width:calc(var(--ax-comp-scheduler-timeline-view-blocks-width) * var(--ax-comp-scheduler-hours-count,16));min-width:calc(var(--ax-comp-scheduler-timeline-view-blocks-width) * var(--ax-comp-scheduler-hours-count,16));flex-shrink:0;flex-direction:row;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-time-header .ax-scheduler-timeline-weekly-day-time-slots .ax-scheduler-timeline-weekly-time-slot{position:relative;display:flex;width:var(--ax-comp-scheduler-timeline-view-blocks-width);min-width:var(--ax-comp-scheduler-timeline-view-blocks-width);flex-shrink:0;align-items:center;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 4)}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-time-header .ax-scheduler-timeline-weekly-day-time-slots .ax-scheduler-timeline-weekly-time-slot span{position:sticky;z-index:5;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-normal, 400);font-weight:var(--font-weight-normal, 400);inset-inline-start:calc(var(--ax-comp-scheduler-resource-header-width, 8rem) + 1rem)}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content{display:flex;min-height:calc(var(--spacing, .25rem) * 0);width:fit-content;flex:1;flex-direction:row;align-items:stretch;background-color:inherit}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-resource-headers{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 0);z-index:15;display:flex;width:var(--ax-comp-scheduler-resource-header-width,8rem);min-width:var(--ax-comp-scheduler-resource-header-width,8rem);flex-direction:column;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-resource-headers .ax-scheduler-timeline-weekly-resource-header{box-sizing:border-box;display:flex;align-items:center;justify-content:center;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));padding:calc(var(--spacing, .25rem) * 2)}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-resource-headers .ax-scheduler-timeline-weekly-resource-header .ax-scheduler-timeline-resource-title{text-align:center;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);overflow-wrap:break-word}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container{display:flex;min-width:max-content;flex:1;flex-direction:row}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column{position:relative;display:flex;width:calc(var(--ax-comp-scheduler-timeline-view-blocks-width) * var(--ax-comp-scheduler-hours-count,16));min-width:calc(var(--ax-comp-scheduler-timeline-view-blocks-width) * var(--ax-comp-scheduler-hours-count,16));flex-shrink:0;flex-direction:column;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows{display:flex;flex:1;flex-direction:column}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows .ax-scheduler-timeline-weekly-resource-row{position:relative;box-sizing:border-box;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows .ax-scheduler-timeline-weekly-resource-row .ax-scheduler-timeline-resource-spanning-layer{pointer-events:none;position:absolute;inset-inline-start:calc(var(--spacing, .25rem) * 0);top:calc(var(--spacing, .25rem) * 0);z-index:5;display:grid;align-content:flex-start;padding-inline:calc(var(--spacing, .25rem) * .5);padding-block:calc(var(--spacing, .25rem) * 1);row-gap:var(--ax-scheduler-timeline-spanning-gap);grid-auto-rows:var(--ax-scheduler-timeline-spanning-row-height);width:calc(var(--timeline-days-count, 7) * var(--ax-comp-scheduler-timeline-view-blocks-width) * var(--ax-comp-scheduler-hours-count, 16));grid-template-columns:repeat(var(--timeline-days-count, 7),calc(var(--ax-comp-scheduler-timeline-view-blocks-width) * var(--ax-comp-scheduler-hours-count, 16)))}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows .ax-scheduler-timeline-weekly-resource-row .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment{z-index:6;display:flex;cursor:pointer;align-items:center;overflow:hidden;text-overflow:ellipsis;border-radius:var(--radius-sm, .25rem);padding-inline:calc(var(--spacing, .25rem) * 1);padding-block:calc(var(--spacing, .25rem) * .5);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));white-space:nowrap;margin-inline:.125rem;pointer-events:auto}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows .ax-scheduler-timeline-weekly-resource-row .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment .ax-spanning-appointment-title{display:flex;height:100%;width:100%;align-items:center;justify-content:space-between;padding-inline:calc(var(--spacing, .25rem) * 2)}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows .ax-scheduler-timeline-weekly-resource-row .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment .ax-spanning-appointment-title .ax-scheduler-truncate{min-width:calc(var(--spacing, .25rem) * 0);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows .ax-scheduler-timeline-weekly-resource-row .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment .ax-spanning-appointment-title .ax-scheduler-action-icon{margin-inline-start:calc(var(--spacing, .25rem) * 1);width:auto;flex-shrink:0;cursor:pointer}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows .ax-scheduler-timeline-weekly-resource-row .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-start-clipped{position:relative;border-start-start-radius:0;border-end-start-radius:0;margin-inline-start:0}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows .ax-scheduler-timeline-weekly-resource-row .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-start-clipped:before{content:\"\\2190 \";position:absolute;top:calc(var(--spacing, .25rem) * .5);font-size:.65rem;opacity:70%;inset-inline-start:0}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows .ax-scheduler-timeline-weekly-resource-row .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-end-clipped{position:relative;border-start-end-radius:0;border-end-end-radius:0;margin-inline-end:0}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows .ax-scheduler-timeline-weekly-resource-row .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-end-clipped:after{content:\" \\2192\";position:absolute;top:calc(var(--spacing, .25rem) * .5);font-size:.65rem;opacity:70%;inset-inline-end:0}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows .ax-scheduler-timeline-weekly-resource-row ax-scheduler-timeline-day-view{display:block;width:100%;height:100%}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows .ax-scheduler-timeline-weekly-resource-row ax-scheduler-timeline-day-view .ax-scheduler-timeline-header{display:none}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows .ax-scheduler-timeline-weekly-resource-row ax-scheduler-timeline-day-view .ax-scheduler-timeline-content{position:relative;height:100%}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows .ax-scheduler-timeline-weekly-resource-row ax-scheduler-timeline-day-view .ax-scheduler-timeline-appointment-container{position:absolute;width:100%;top:calc(var(--resource-spanning-rows-count, 0) * (var(--ax-scheduler-timeline-spanning-row-height) + var(--ax-scheduler-timeline-spanning-gap)) + .25rem);height:calc(100% - var(--resource-spanning-rows-count, 0) * (var(--ax-scheduler-timeline-spanning-row-height) + var(--ax-scheduler-timeline-spanning-gap)) - .25rem)}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows .ax-scheduler-timeline-weekly-resource-row ax-scheduler-timeline-day-view .ax-scheduler-timeline-appointment-container .ax-scheduler-timeline-appointment{position:absolute;inset-inline-start:calc(var(--spacing, .25rem) * 0);display:flex;width:100%;flex-direction:column;overflow:hidden;border-radius:calc(var(--ax-sys-border-radius) / 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1)}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows .ax-scheduler-timeline-weekly-resource-row ax-scheduler-timeline-day-view .ax-scheduler-timeline-slot-row{position:relative;box-sizing:border-box;display:flex;height:100%;width:max-content;padding-top:calc(var(--resource-spanning-rows-count, 0) * (var(--ax-scheduler-timeline-spanning-row-height) + var(--ax-scheduler-timeline-spanning-gap)) + .25rem)}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows .ax-scheduler-timeline-weekly-resource-row ax-scheduler-timeline-day-view .ax-scheduler-timeline-slot-row .ax-scheduler-timeline-slot-cell{position:relative;width:var(--ax-comp-scheduler-timeline-view-blocks-width);flex-shrink:0;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows .ax-scheduler-timeline-weekly-resource-row ax-scheduler-timeline-day-view .ax-scheduler-timeline-slot-row .ax-scheduler-timeline-slot-cell:after{inset-inline-end:calc(var(--spacing, .25rem) * 0);top:calc(var(--spacing, .25rem) * 0);height:100%;width:1px;background-color:rgba(var(--ax-sys-color-border-lightest-surface));--tw-content: \"\";content:var(--tw-content);position:absolute}@supports (color: color-mix(in lab,red,red)){ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-weekly-resource-container .ax-scheduler-timeline-weekly-content .ax-scheduler-timeline-weekly-days-container .ax-scheduler-timeline-weekly-column .ax-scheduler-timeline-weekly-resource-rows .ax-scheduler-timeline-weekly-resource-row ax-scheduler-timeline-day-view .ax-scheduler-timeline-slot-row .ax-scheduler-timeline-slot-cell:after{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-border-lightest-surface)) 30%,transparent)}}ax-scheduler-timeline-weekly-view .ax-scheduler-current-time-line{top:calc(var(--spacing, .25rem) * 0);bottom:calc(var(--spacing, .25rem) * 0);width:calc(var(--spacing, .25rem) * .5)}ax-scheduler-timeline-weekly-view .ax-scheduler-current-time-line:before{content:var(--tw-content);inset-inline-start:-5px}ax-scheduler-timeline-weekly-view .ax-scheduler-current-time-line:before{content:var(--tw-content);top:calc(var(--spacing, .25rem) * -1.5)}ax-scheduler.ax-rtl ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-spanning-appointment.ax-spanning-start-clipped:before{content:\"\\2192 \"}ax-scheduler.ax-rtl ax-scheduler-timeline-weekly-view .ax-scheduler-timeline-spanning-appointment.ax-spanning-end-clipped:after{content:\" \\2190\"}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-content{syntax: \"*\"; inherits: false; initial-value: \"\";}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial;--tw-content: \"\"}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: AXDragDirective, selector: "[axDrag]", inputs: ["axDrag", "dragData", "dragDisabled", "dragTransition", "dragElementClone", "dropZoneGroup", "dragStartDelay", "dragResetOnDblClick", "dragLockAxis", "dragClonedTemplate", "dragCursor", "dragBoundary", "dragTransitionDuration"], outputs: ["dragPositionChanged"] }, { kind: "directive", type: AXTooltipDirective, selector: "[axTooltip]", inputs: ["axTooltipDisabled", "axTooltip", "axTooltipContext", "axTooltipPlacement", "axTooltipOffsetX", "axTooltipOffsetY", "axTooltipOpenAfter", "axTooltipCloseAfter"] }, { kind: "component", type: AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: AXSchedulerTimelineDayViewComponent, selector: "ax-scheduler-timeline-day-view", inputs: ["readonly", "draggable", "hasActions", "dragStartDelay", "calendar", "showResourceHeaders", "date", "endDayHour", "selectedAppointmentId", "startDayHour", "showUnassignedAppointments", "resources", "showCurrentTimeIndicator", "scrollToCurrentTimeIndicator", "resourceTemplate", "appointments", "tooltipTemplate"], outputs: ["slotClickedInternal", "slotDblClickedInternal", "slotRightClickedInternal", "appointmentClickedInternal", "appointmentDblClickedInternal", "appointmentRightClickedInternal", "onActionClickInternal", "onAppointmentDropInternal"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXFormatPipe, name: "format" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
3410
3540
|
}
|
|
3411
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
3541
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXSchedulerTimelineWeeklyViewComponent, decorators: [{
|
|
3412
3542
|
type: Component,
|
|
3413
|
-
args: [{ selector: 'ax-scheduler-timeline-weekly-view',
|
|
3543
|
+
args: [{ selector: 'ax-scheduler-timeline-weekly-view', encapsulation: ViewEncapsulation.None, host: {
|
|
3414
3544
|
'[class.ax-state-readonly]': 'readonly()',
|
|
3415
3545
|
}, imports: [
|
|
3416
3546
|
AsyncPipe,
|
|
@@ -3523,41 +3653,63 @@ class AXSchedulerTimelineYearViewComponent extends NXComponent {
|
|
|
3523
3653
|
});
|
|
3524
3654
|
}
|
|
3525
3655
|
return spanningResult;
|
|
3526
|
-
},
|
|
3656
|
+
}, /* @ts-ignore */
|
|
3657
|
+
...(ngDevMode ? [{ debugName: "spanningAppointments" }] : /* istanbul ignore next */ []));
|
|
3527
3658
|
// Get the set of multi-day appointment IDs for exclusion from per-day rendering
|
|
3528
3659
|
this.multiDayAppointmentIds = computed(() => {
|
|
3529
3660
|
const spanning = this.spanningAppointments();
|
|
3530
3661
|
return new Set(spanning.map((s) => s.appointment.id));
|
|
3531
|
-
},
|
|
3662
|
+
}, /* @ts-ignore */
|
|
3663
|
+
...(ngDevMode ? [{ debugName: "multiDayAppointmentIds" }] : /* istanbul ignore next */ []));
|
|
3532
3664
|
// Calculate max spanning rows for the non-resource view
|
|
3533
3665
|
this.maxSpanningRows = computed(() => {
|
|
3534
3666
|
const spanning = this.spanningAppointments();
|
|
3535
3667
|
if (spanning.length === 0)
|
|
3536
3668
|
return 0;
|
|
3537
3669
|
return Math.max(...spanning.map((s) => s.rowIndex)) + 1;
|
|
3538
|
-
},
|
|
3539
|
-
|
|
3540
|
-
this.
|
|
3541
|
-
|
|
3542
|
-
this.
|
|
3543
|
-
|
|
3544
|
-
this.
|
|
3545
|
-
|
|
3546
|
-
this.
|
|
3547
|
-
|
|
3548
|
-
this.
|
|
3549
|
-
|
|
3550
|
-
this.
|
|
3551
|
-
|
|
3552
|
-
this.
|
|
3553
|
-
|
|
3554
|
-
this.
|
|
3555
|
-
|
|
3556
|
-
this.
|
|
3670
|
+
}, /* @ts-ignore */
|
|
3671
|
+
...(ngDevMode ? [{ debugName: "maxSpanningRows" }] : /* istanbul ignore next */ []));
|
|
3672
|
+
this.readonly = input(false, /* @ts-ignore */
|
|
3673
|
+
...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
|
|
3674
|
+
this.draggable = input(true, /* @ts-ignore */
|
|
3675
|
+
...(ngDevMode ? [{ debugName: "draggable" }] : /* istanbul ignore next */ []));
|
|
3676
|
+
this.hasActions = input(false, /* @ts-ignore */
|
|
3677
|
+
...(ngDevMode ? [{ debugName: "hasActions" }] : /* istanbul ignore next */ []));
|
|
3678
|
+
this.dragStartDelay = input(0, /* @ts-ignore */
|
|
3679
|
+
...(ngDevMode ? [{ debugName: "dragStartDelay" }] : /* istanbul ignore next */ []));
|
|
3680
|
+
this.calendar = input(/* @ts-ignore */
|
|
3681
|
+
...(ngDevMode ? [undefined, { debugName: "calendar" }] : /* istanbul ignore next */ []));
|
|
3682
|
+
this.showResourceHeaders = input(true, /* @ts-ignore */
|
|
3683
|
+
...(ngDevMode ? [{ debugName: "showResourceHeaders" }] : /* istanbul ignore next */ []));
|
|
3684
|
+
this.date = input.required(/* @ts-ignore */
|
|
3685
|
+
...(ngDevMode ? [{ debugName: "date" }] : /* istanbul ignore next */ []));
|
|
3686
|
+
this.showUnassignedAppointments = input(true, /* @ts-ignore */
|
|
3687
|
+
...(ngDevMode ? [{ debugName: "showUnassignedAppointments" }] : /* istanbul ignore next */ []));
|
|
3688
|
+
this.selectedAppointmentId = input(null, /* @ts-ignore */
|
|
3689
|
+
...(ngDevMode ? [{ debugName: "selectedAppointmentId" }] : /* istanbul ignore next */ []));
|
|
3690
|
+
this.resources = input([], /* @ts-ignore */
|
|
3691
|
+
...(ngDevMode ? [{ debugName: "resources" }] : /* istanbul ignore next */ []));
|
|
3692
|
+
this.showCurrentTimeIndicator = input(true, /* @ts-ignore */
|
|
3693
|
+
...(ngDevMode ? [{ debugName: "showCurrentTimeIndicator" }] : /* istanbul ignore next */ []));
|
|
3694
|
+
this.scrollToCurrentTimeIndicator = input(false, /* @ts-ignore */
|
|
3695
|
+
...(ngDevMode ? [{ debugName: "scrollToCurrentTimeIndicator" }] : /* istanbul ignore next */ []));
|
|
3696
|
+
this.resourceTemplate = input(/* @ts-ignore */
|
|
3697
|
+
...(ngDevMode ? [undefined, { debugName: "resourceTemplate" }] : /* istanbul ignore next */ []));
|
|
3698
|
+
this.appointments = input([], /* @ts-ignore */
|
|
3699
|
+
...(ngDevMode ? [{ debugName: "appointments" }] : /* istanbul ignore next */ []));
|
|
3700
|
+
this.tooltipTemplate = input(/* @ts-ignore */
|
|
3701
|
+
...(ngDevMode ? [undefined, { debugName: "tooltipTemplate" }] : /* istanbul ignore next */ []));
|
|
3702
|
+
this.dragStartSlotId = signal(null, /* @ts-ignore */
|
|
3703
|
+
...(ngDevMode ? [{ debugName: "dragStartSlotId" }] : /* istanbul ignore next */ []));
|
|
3704
|
+
this.dragStartSlotResourceId = signal(null, /* @ts-ignore */
|
|
3705
|
+
...(ngDevMode ? [{ debugName: "dragStartSlotResourceId" }] : /* istanbul ignore next */ []));
|
|
3706
|
+
this.currentTimeLineElement = viewChild('currentTimeLine', /* @ts-ignore */
|
|
3707
|
+
...(ngDevMode ? [{ debugName: "currentTimeLineElement" }] : /* istanbul ignore next */ []));
|
|
3557
3708
|
// Performance optimization: reduce drag start delay for year view
|
|
3558
3709
|
this.optimizedDragStartDelay = computed(() => {
|
|
3559
3710
|
return this.dragStartDelay() > 0 ? Math.min(this.dragStartDelay(), 50) : 0;
|
|
3560
|
-
},
|
|
3711
|
+
}, /* @ts-ignore */
|
|
3712
|
+
...(ngDevMode ? [{ debugName: "optimizedDragStartDelay" }] : /* istanbul ignore next */ []));
|
|
3561
3713
|
this.processedDayData = computed(() => {
|
|
3562
3714
|
const allOriginalAppointments = this.appointments();
|
|
3563
3715
|
const yearStartDate = this.date().startOf('year');
|
|
@@ -3641,13 +3793,15 @@ class AXSchedulerTimelineYearViewComponent extends NXComponent {
|
|
|
3641
3793
|
});
|
|
3642
3794
|
}
|
|
3643
3795
|
return result;
|
|
3644
|
-
},
|
|
3796
|
+
}, /* @ts-ignore */
|
|
3797
|
+
...(ngDevMode ? [{ debugName: "processedDayData" }] : /* istanbul ignore next */ []));
|
|
3645
3798
|
this.resourceIds = computed(() => {
|
|
3646
3799
|
const resources = this.resources();
|
|
3647
3800
|
if (resources.length === 0)
|
|
3648
3801
|
return [];
|
|
3649
3802
|
return this.schedulerService.getAllResourceIds(resources, this.showUnassignedAppointments());
|
|
3650
|
-
},
|
|
3803
|
+
}, /* @ts-ignore */
|
|
3804
|
+
...(ngDevMode ? [{ debugName: "resourceIds" }] : /* istanbul ignore next */ []));
|
|
3651
3805
|
// Internal outputs to be caught by parent AXSchedulerComponent
|
|
3652
3806
|
this.slotClickedInternal = output();
|
|
3653
3807
|
this.slotDblClickedInternal = output();
|
|
@@ -3854,12 +4008,12 @@ class AXSchedulerTimelineYearViewComponent extends NXComponent {
|
|
|
3854
4008
|
this.dragStartSlotId.set(dropListElement ? dropListElement.dataset['slotId'] : null);
|
|
3855
4009
|
this.dragStartSlotResourceId.set(dropListElement ? dropListElement.dataset['resourceId'] : null);
|
|
3856
4010
|
}
|
|
3857
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
3858
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXSchedulerTimelineYearViewComponent, isStandalone: true, selector: "ax-scheduler-timeline-year-view", inputs: { readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, draggable: { classPropertyName: "draggable", publicName: "draggable", isSignal: true, isRequired: false, transformFunction: null }, hasActions: { classPropertyName: "hasActions", publicName: "hasActions", isSignal: true, isRequired: false, transformFunction: null }, dragStartDelay: { classPropertyName: "dragStartDelay", publicName: "dragStartDelay", isSignal: true, isRequired: false, transformFunction: null }, calendar: { classPropertyName: "calendar", publicName: "calendar", isSignal: true, isRequired: false, transformFunction: null }, showResourceHeaders: { classPropertyName: "showResourceHeaders", publicName: "showResourceHeaders", isSignal: true, isRequired: false, transformFunction: null }, date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: true, transformFunction: null }, showUnassignedAppointments: { classPropertyName: "showUnassignedAppointments", publicName: "showUnassignedAppointments", isSignal: true, isRequired: false, transformFunction: null }, selectedAppointmentId: { classPropertyName: "selectedAppointmentId", publicName: "selectedAppointmentId", isSignal: true, isRequired: false, transformFunction: null }, resources: { classPropertyName: "resources", publicName: "resources", isSignal: true, isRequired: false, transformFunction: null }, showCurrentTimeIndicator: { classPropertyName: "showCurrentTimeIndicator", publicName: "showCurrentTimeIndicator", isSignal: true, isRequired: false, transformFunction: null }, scrollToCurrentTimeIndicator: { classPropertyName: "scrollToCurrentTimeIndicator", publicName: "scrollToCurrentTimeIndicator", isSignal: true, isRequired: false, transformFunction: null }, resourceTemplate: { classPropertyName: "resourceTemplate", publicName: "resourceTemplate", isSignal: true, isRequired: false, transformFunction: null }, appointments: { classPropertyName: "appointments", publicName: "appointments", isSignal: true, isRequired: false, transformFunction: null }, tooltipTemplate: { classPropertyName: "tooltipTemplate", publicName: "tooltipTemplate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { slotClickedInternal: "slotClickedInternal", slotDblClickedInternal: "slotDblClickedInternal", slotRightClickedInternal: "slotRightClickedInternal", appointmentClickedInternal: "appointmentClickedInternal", appointmentDblClickedInternal: "appointmentDblClickedInternal", appointmentRightClickedInternal: "appointmentRightClickedInternal", onActionClickInternal: "onActionClickInternal", onAppointmentDropInternal: "onAppointmentDropInternal" }, host: { properties: { "class.ax-state-readonly": "readonly()" } }, providers: [{ provide: AXComponent, useExisting: AXSchedulerTimelineYearViewComponent }], viewQueries: [{ propertyName: "currentTimeLineElement", first: true, predicate: ["currentTimeLine"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (resources().length === 0 || !showResourceHeaders()) {\n <!-- Original layout when no resources -->\n <div class=\"ax-scheduler-timeline-year-wrapper\">\n <!-- Spanning appointments layer -->\n @if (spanningAppointments().length > 0) {\n <div class=\"ax-scheduler-timeline-year-spanning-layer\" [style.--timeline-days-count]=\"processedDayData().length\">\n @for (spanning of spanningAppointments(); track spanning.appointment.id) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragData]=\"spanning.appointment\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"optimizedDragStartDelay()\"\n [dragDisabled]=\"!draggable() || spanning.appointment.readonly || readonly()\"\n (pointerdown)=\"getSlotId($event)\"\n (click)=\"handleAppointmentEvent($event, spanning.appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, spanning.appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, spanning.appointment)\"\n [title]=\"\n tooltipTemplate()\n ? ''\n : spanning.appointment.title +\n ' (' +\n (spanning.appointment.startDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async) +\n ' - ' +\n (spanning.appointment.endDate | format: 'date' : { format: 'MMM d', calendar: calendar() } | async) +\n ')'\n \"\n class=\"ax-scheduler-timeline-spanning-appointment {{\n spanning.appointment.cssClass ??\n 'ax-scheduler-' + (spanning.appointment.priority ?? 'primary') + '-priority'\n }}\"\n [class.ax-spanning-start-clipped]=\"spanning.isStartClipped\"\n [class.ax-spanning-end-clipped]=\"spanning.isEndClipped\"\n [class.ax-state-active]=\"isActive(spanning.appointment.id)\"\n [style.grid-column]=\"spanning.startDayIndex + 1 + ' / span ' + spanning.spanCount\"\n [style.grid-row]=\"spanning.rowIndex + 1\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltip]=\"tooltipTemplate()\"\n [axTooltipContext]=\"spanning.appointment\"\n >\n <span class=\"ax-spanning-appointment-title\">\n <span class=\"ax-scheduler-truncate\">{{ spanning.appointment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, spanning.appointment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n ></ax-icon>\n }\n </span>\n </div>\n }\n </div>\n }\n\n <div class=\"ax-scheduler-timeline-year-container\">\n @for (dayData of processedDayData(); track dayData.date.date.getTime()) {\n <div>\n <div class=\"ax-scheduler-timeline-header\">\n <div\n [class.ax-state-today]=\"isToday(dayData.date)\"\n class=\"ax-scheduler-year-header-date-day {{\n dayData.holiday.state !== 'none' ? (dayData.holiday.holiday?.cssClass ?? 'ax-state-holiday') : ''\n }}\"\n [style.--ax-scheduler-holiday-color]=\"dayData.holiday.holiday?.color ?? null\"\n >\n <span\n class=\"ax-scheduler-year-header-date-day-char ax-scheduler-truncate\"\n [axTooltip]=\"(dayData.holiday.holiday?.description ?? dayData.holiday.holiday?.title ?? '') | translate | async\"\n >\n {{ dayData.date | format: 'date' : { format: 'MMMM', calendar: calendar() } | async }}\n @if (dayData.holiday.state === 'holiday' && dayData.holiday.holiday.title) {\n ( {{ dayData.holiday.holiday.title | translate | async }} )\n }\n </span>\n <span class=\"ax-scheduler-year-header-date-day-num\">\n {{ dayData.date | format: 'date' : { format: 'DD', calendar: calendar() } | async }}\n </span>\n </div>\n </div>\n\n <div\n axDropZone\n #zone=\"axDropZone\"\n (onElementDrop)=\"handleDrop($event, dayData.date)\"\n [class.ax-scheduler-slot-hovered]=\"zone.isHovered()\"\n class=\"ax-scheduler-timeline-content\"\n (click)=\"handleSlotEvent($event, dayData.date)\"\n (dblclick)=\"handleSlotEvent($event, dayData.date)\"\n (contextmenu)=\"handleSlotEvent($event, dayData.date)\"\n [attr.data-slot-id]=\"dayData.date.format('YYYYMMDD')\"\n [style.pointer-events]=\"draggable() ? 'auto' : 'none'\"\n [style.--spanning-rows-count]=\"maxSpanningRows()\"\n >\n <!-- Current Time Line Indicator -->\n @if (\n showCurrentTimeIndicator() &&\n shouldShowCurrentTimeForDay(dayData.date) &&\n getCurrentTimePosition() !== null\n ) {\n <div\n class=\"ax-scheduler-current-time-line\"\n [style.inset-inline-start.%]=\"getCurrentTimePosition()\"\n #currentTimeLine\n ></div>\n }\n <div class=\"ax-scheduler-timeline-appointment-container\">\n @for (segment of dayData.visibleAppointments; track segment.id + segment.originalStartDate.getTime()) {\n <div\n axDrag\n [dragData]=\"segment\"\n [dragCursor]=\"'grab'\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"optimizedDragStartDelay()\"\n [dragDisabled]=\"!draggable() || segment.readonly || readonly()\"\n (pointerdown)=\"getSlotId($event)\"\n (click)=\"handleAppointmentEvent($event, segment)\"\n (dblclick)=\"handleAppointmentEvent($event, segment)\"\n (contextmenu)=\"handleAppointmentEvent($event, segment)\"\n [title]=\"\n tooltipTemplate()\n ? ''\n : segment.title +\n ' (' +\n (segment.originalStartDate | format: 'time' : { calendar: calendar() } | async) +\n ' - ' +\n (segment.originalEndDate | format: 'time' : { calendar: calendar() } | async) +\n ')'\n \"\n class=\"ax-scheduler-timeline-appointment {{\n segment.cssClass ?? 'ax-scheduler-' + (segment.priority ?? 'primary') + '-priority'\n }}\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltip]=\"tooltipTemplate()\"\n [axTooltipContext]=\"segment\"\n >\n <ax-title>\n <span class=\"ax-scheduler-truncate\">{{ segment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, segment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n >\n </ax-icon>\n }\n </ax-title>\n <span class=\"ax-scheduler-timeline-appointment-time\">\n {{ segment.originalStartDate | format: 'time' : { calendar: calendar() } | async }}\n @if (segment.originalStartDate.getTime() !== segment.originalEndDate.getTime()) {\n -\n {{ segment.originalEndDate | format: 'time' : { calendar: calendar() } | async }}\n }\n </span>\n </div>\n }\n\n <!-- Overflow Badge and Popover -->\n @if (dayData.moreCount > 0) {\n <div #moreAppointments class=\"ax-scheduler-year-overflow-badge\" (click)=\"$event.stopPropagation()\">\n +{{\n '@acorex:common.general.more-items' | translate: { params: { number: dayData.moreCount } } | async\n }}\n </div>\n <ax-popover [target]=\"moreAppointments\" placement=\"bottom-start\" trigger=\"click\">\n <div\n axDropZone\n [class.ax-state-readonly]=\"readonly()\"\n class=\"ax-scheduler-popover ax-scheduler-timeline-year-popover-appointment\"\n >\n @for (\n segment of dayData.hiddenAppointments;\n track segment.id + segment.originalStartDate.getTime()\n ) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragData]=\"segment\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"optimizedDragStartDelay()\"\n [dragDisabled]=\"!draggable() || segment.readonly || readonly()\"\n (click)=\"handleAppointmentEvent($event, segment); $event.stopPropagation()\"\n (dblclick)=\"handleAppointmentEvent($event, segment); $event.stopPropagation()\"\n (contextmenu)=\"handleAppointmentEvent($event, segment); $event.stopPropagation()\"\n [title]=\"\n tooltipTemplate()\n ? ''\n : segment.title +\n ' (' +\n (segment.originalStartDate | format: 'time' : { calendar: calendar() } | async) +\n ' - ' +\n (segment.originalEndDate | format: 'time' : { calendar: calendar() } | async) +\n ')'\n \"\n class=\"ax-scheduler-popover-appointment {{\n segment.cssClass ?? 'ax-scheduler-' + (segment.priority ?? 'primary') + '-priority'\n }}\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltip]=\"tooltipTemplate()\"\n [axTooltipContext]=\"segment\"\n >\n <ax-title>\n <span class=\"ax-scheduler-truncate\">{{ segment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, segment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n >\n </ax-icon>\n }\n </ax-title>\n <span class=\"ax-scheduler-timeline-appointment-time\">\n {{ segment.originalStartDate | format: 'time' : { calendar: calendar() } | async }}\n @if (segment.originalStartDate.getTime() !== segment.originalEndDate.getTime()) {\n -\n {{ segment.originalEndDate | format: 'time' : { calendar: calendar() } | async }}\n }\n </span>\n </div>\n }\n </div>\n </ax-popover>\n }\n </div>\n </div>\n </div>\n }\n </div>\n </div>\n} @else {\n <!-- Resource-based layout -->\n <div class=\"ax-scheduler-timeline-year-resource-container\">\n <div class=\"ax-scheduler-timeline-year-header-sticky\">\n <div class=\"ax-scheduler-timeline-year-resource-header-placeholder\">\n <span>Resources</span>\n </div>\n\n <div class=\"ax-scheduler-timeline-year-day-header\">\n @for (dayData of processedDayData(); track dayData.date.date.getTime()) {\n <div\n [class.ax-state-today]=\"isToday(dayData.date)\"\n class=\"ax-scheduler-year-header-date-day {{\n dayData.holiday.state !== 'none' ? (dayData.holiday.holiday?.cssClass ?? 'ax-state-holiday') : ''\n }}\"\n [style.--ax-scheduler-holiday-color]=\"dayData.holiday.holiday?.color ?? null\"\n >\n <span\n class=\"ax-scheduler-year-header-date-day-char ax-scheduler-truncate\"\n [axTooltip]=\"(dayData.holiday.holiday?.description ?? dayData.holiday.holiday?.title ?? '') | translate | async\"\n >\n {{ dayData.date | format: 'date' : { format: 'MMMM', calendar: calendar() } | async }}\n @if (dayData.holiday.state === 'holiday' && dayData.holiday.holiday.title) {\n ( {{ dayData.holiday.holiday.title | translate | async }} )\n }\n </span>\n <span class=\"ax-scheduler-year-header-date-day-num\">\n {{ dayData.date | format: 'date' : { format: 'DD', calendar: calendar() } | async }}\n </span>\n </div>\n }\n </div>\n </div>\n\n <div class=\"ax-scheduler-timeline-year-resource-rows\">\n <!-- Current Time Line Indicator -->\n @if (showCurrentTimeIndicator() && getCurrentTimePosition() !== null) {\n <div\n class=\"ax-scheduler-current-time-line\"\n [style.inset-inline-start.%]=\"getCurrentTimePosition()\"\n #currentTimeLine\n ></div>\n }\n\n @for (resourceId of resourceIds(); track resourceId) {\n <div\n class=\"ax-scheduler-timeline-year-resource-row\"\n [style.--resource-spanning-rows-count]=\"getMaxSpanningRowsForResource(resourceId)\"\n >\n <div class=\"ax-scheduler-timeline-year-resource-header ax-scheduler-timeline-year-resource-header-sticky\">\n @if (resourceTemplate() && typeof resourceTemplate() !== 'string') {\n <ng-container\n [ngTemplateOutlet]=\"$any(resourceTemplate())\"\n [ngTemplateOutletContext]=\"{\n $implicit: getResourceContext(resourceId),\n resource: getResourceContext(resourceId),\n resourceId: resourceId,\n }\"\n ></ng-container>\n } @else {\n <div class=\"ax-scheduler-timeline-year-resource-title\">\n {{ getResourceTitle(resourceId) | translate | async }}\n </div>\n }\n </div>\n\n <div class=\"ax-scheduler-timeline-year-resource-content\">\n <!-- Spanning appointments layer for this resource -->\n @if (getSpanningAppointmentsForResource(resourceId).length > 0) {\n <div\n class=\"ax-scheduler-timeline-resource-spanning-layer\"\n [style.--timeline-days-count]=\"processedDayData().length\"\n >\n @for (spanning of getSpanningAppointmentsForResource(resourceId); track spanning.appointment.id) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragData]=\"spanning.appointment\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"optimizedDragStartDelay()\"\n [dragDisabled]=\"!draggable() || spanning.appointment.readonly || readonly()\"\n (pointerdown)=\"getSlotId($event)\"\n (click)=\"handleAppointmentEvent($event, spanning.appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, spanning.appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, spanning.appointment)\"\n [title]=\"\n tooltipTemplate()\n ? ''\n : spanning.appointment.title +\n ' (' +\n (spanning.appointment.startDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async) +\n ' - ' +\n (spanning.appointment.endDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async) +\n ')'\n \"\n class=\"ax-scheduler-timeline-spanning-appointment {{\n spanning.appointment.cssClass ??\n 'ax-scheduler-' + (spanning.appointment.priority ?? 'primary') + '-priority'\n }}\"\n [class.ax-spanning-start-clipped]=\"spanning.isStartClipped\"\n [class.ax-spanning-end-clipped]=\"spanning.isEndClipped\"\n [class.ax-state-active]=\"isActive(spanning.appointment.id)\"\n [style.grid-column]=\"spanning.startDayIndex + 1 + ' / span ' + spanning.spanCount\"\n [style.grid-row]=\"spanning.rowIndex + 1\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltip]=\"tooltipTemplate()\"\n [axTooltipContext]=\"spanning.appointment\"\n >\n <span class=\"ax-spanning-appointment-title\">\n <span class=\"ax-scheduler-truncate\">{{ spanning.appointment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, spanning.appointment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n ></ax-icon>\n }\n </span>\n </div>\n }\n </div>\n }\n\n @for (dayData of processedDayData(); track dayData.date.date.getTime()) {\n <div\n axDropZone\n #zone=\"axDropZone\"\n (onElementDrop)=\"handleDrop($event, dayData.date, resourceId)\"\n [class.ax-scheduler-slot-hovered]=\"zone.isHovered()\"\n class=\"ax-scheduler-timeline-year-slot-row\"\n (click)=\"handleSlotEvent($event, dayData.date)\"\n (dblclick)=\"handleSlotEvent($event, dayData.date)\"\n (contextmenu)=\"handleSlotEvent($event, dayData.date)\"\n [attr.data-slot-id]=\"dayData.date.format('YYYYMMDD')\"\n [attr.data-resource-id]=\"resourceId\"\n [style.pointer-events]=\"draggable() ? 'auto' : 'none'\"\n [style.--spanning-rows-count]=\"getMaxSpanningRowsForResource(resourceId)\"\n >\n <div class=\"ax-scheduler-timeline-appointment-container\">\n @for (\n segment of getAppointmentsForResourceAndDay(resourceId, dayData).visible;\n track segment.id + segment.originalStartDate.getTime()\n ) {\n <div\n axDrag\n [dragData]=\"segment\"\n [dragCursor]=\"'grab'\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"optimizedDragStartDelay()\"\n [dragDisabled]=\"!draggable() || segment.readonly || readonly()\"\n (pointerdown)=\"getSlotId($event)\"\n (click)=\"handleAppointmentEvent($event, segment)\"\n (dblclick)=\"handleAppointmentEvent($event, segment)\"\n (contextmenu)=\"handleAppointmentEvent($event, segment)\"\n [title]=\"\n tooltipTemplate()\n ? ''\n : segment.allDay\n ? segment.title +\n ' (' +\n (segment.originalStartDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async) +\n ' - ' +\n (segment.originalEndDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async) +\n ')'\n : segment.title +\n ' (' +\n (segment.originalStartDate | format: 'time' : { calendar: calendar() } | async) +\n ' - ' +\n (segment.originalEndDate | format: 'time' : { calendar: calendar() } | async) +\n ')'\n \"\n class=\"ax-scheduler-timeline-appointment {{\n segment.cssClass ?? 'ax-scheduler-' + (segment.priority ?? 'primary') + '-priority'\n }}\"\n [class.all-day-segment]=\"segment.allDay\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltip]=\"tooltipTemplate()\"\n [axTooltipContext]=\"segment\"\n >\n <ax-title>\n <span class=\"ax-scheduler-truncate\">{{ segment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, segment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n >\n </ax-icon>\n }\n </ax-title>\n <span class=\"ax-scheduler-timeline-appointment-time\">\n @if (segment.allDay) {\n {{\n segment.originalStartDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async\n }}\n @if (segment.originalStartDate.getTime() !== segment.originalEndDate.getTime()) {\n -\n {{\n segment.originalEndDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async\n }}\n }\n } @else {\n {{ segment.originalStartDate | format: 'time' : { calendar: calendar() } | async }}\n @if (segment.originalStartDate.getTime() !== segment.originalEndDate.getTime()) {\n -\n {{ segment.originalEndDate | format: 'time' : { calendar: calendar() } | async }}\n }\n }\n </span>\n </div>\n }\n\n <!-- Overflow Badge and Popover -->\n @if (getAppointmentsForResourceAndDay(resourceId, dayData).moreCount > 0) {\n <div #moreAppointments class=\"ax-scheduler-year-overflow-badge\" (click)=\"$event.stopPropagation()\">\n +{{\n '@acorex:common.general.more-items'\n | translate\n : { params: { number: getAppointmentsForResourceAndDay(resourceId, dayData).moreCount } }\n | async\n }}\n </div>\n <ax-popover [target]=\"moreAppointments\" placement=\"bottom-start\" trigger=\"click\">\n <div\n axDropZone\n [class.ax-state-readonly]=\"readonly()\"\n class=\"ax-scheduler-popover ax-scheduler-timeline-year-popover-appointment\"\n >\n @for (\n segment of getAppointmentsForResourceAndDay(resourceId, dayData).hidden;\n track segment.id + segment.originalStartDate.getTime()\n ) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragData]=\"segment\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"optimizedDragStartDelay()\"\n [dragDisabled]=\"!draggable() || segment.readonly || readonly()\"\n (click)=\"handleAppointmentEvent($event, segment); $event.stopPropagation()\"\n (dblclick)=\"handleAppointmentEvent($event, segment); $event.stopPropagation()\"\n (contextmenu)=\"handleAppointmentEvent($event, segment); $event.stopPropagation()\"\n [title]=\"\n tooltipTemplate()\n ? ''\n : segment.allDay\n ? segment.title\n : segment.title +\n ' (' +\n (segment.originalStartDate | format: 'time' : { calendar: calendar() } | async) +\n ' - ' +\n (segment.originalEndDate | format: 'time' : { calendar: calendar() } | async) +\n ')'\n \"\n class=\"ax-scheduler-popover-appointment {{\n segment.cssClass ?? 'ax-scheduler-' + (segment.priority ?? 'primary') + '-priority'\n }}\"\n [class.all-day-segment]=\"segment.allDay\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltip]=\"tooltipTemplate()\"\n [axTooltipContext]=\"segment\"\n >\n <ax-title>\n <span class=\"ax-scheduler-truncate\">{{ segment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, segment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n >\n </ax-icon>\n }\n </ax-title>\n @if (!segment.allDay) {\n <span class=\"ax-scheduler-timeline-appointment-time\">\n {{ segment.originalStartDate | format: 'time' : { calendar: calendar() } | async }}\n @if (\n !segment.allDay &&\n segment.originalStartDate.getTime() !== segment.originalEndDate.getTime()\n ) {\n -\n {{ segment.originalEndDate | format: 'time' : { calendar: calendar() } | async }}\n }\n </span>\n }\n </div>\n }\n </div>\n </ax-popover>\n }\n </div>\n </div>\n }\n </div>\n </div>\n }\n </div>\n </div>\n}\n", styles: ["@layer properties;@layer components{ax-scheduler-timeline-year-view{--ax-scheduler-timeline-spanning-row-height: 1.5rem;--ax-scheduler-timeline-spanning-gap: .125rem;position:relative;display:inline-flex;height:100%;flex-direction:column;background-color:inherit;--ax-comp-scheduler-timeline-year-view-blocks-width: calc(var(--ax-comp-scheduler-timeline-view-blocks-width) / 2)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-wrapper{position:relative;display:flex;height:100%;flex-direction:column}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-spanning-layer{pointer-events:none;position:absolute;inset-inline-start:calc(var(--spacing, .25rem) * 0);inset-inline-end:calc(var(--spacing, .25rem) * 0);top:calc(var(--spacing, .25rem) * 16);z-index:5;display:grid;align-content:flex-start;padding-inline:calc(var(--spacing, .25rem) * .5);padding-block:calc(var(--spacing, .25rem) * 1);row-gap:var(--ax-scheduler-timeline-spanning-gap);grid-auto-rows:var(--ax-scheduler-timeline-spanning-row-height);grid-template-columns:repeat(var(--timeline-days-count, 365),var(--ax-comp-scheduler-timeline-year-view-blocks-width))}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-spanning-layer .ax-scheduler-timeline-spanning-appointment{z-index:6;display:flex;cursor:pointer;align-items:center;overflow:hidden;text-overflow:ellipsis;border-radius:var(--radius-sm, .25rem);padding-inline:calc(var(--spacing, .25rem) * 1);padding-block:calc(var(--spacing, .25rem) * .5);font-size:.7rem;white-space:nowrap;margin-inline:.125rem;pointer-events:auto}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-spanning-layer .ax-scheduler-timeline-spanning-appointment .ax-spanning-appointment-title{display:flex;height:100%;width:100%;align-items:center;justify-content:space-between;padding-inline:calc(var(--spacing, .25rem) * 2)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-spanning-layer .ax-scheduler-timeline-spanning-appointment .ax-spanning-appointment-title .ax-scheduler-truncate{min-width:calc(var(--spacing, .25rem) * 0);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-spanning-layer .ax-scheduler-timeline-spanning-appointment .ax-spanning-appointment-title .ax-scheduler-action-icon{margin-inline-start:calc(var(--spacing, .25rem) * 1);width:auto;flex-shrink:0;cursor:pointer}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-start-clipped{position:relative;border-start-start-radius:0;border-end-start-radius:0;margin-inline-start:0}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-start-clipped:before{content:\"\\2190 \";position:absolute;top:calc(var(--spacing, .25rem) * .5);font-size:.6rem;opacity:70%;inset-inline-start:0}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-end-clipped{position:relative;border-start-end-radius:0;border-end-end-radius:0;margin-inline-end:0}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-end-clipped:after{content:\" \\2192\";position:absolute;top:calc(var(--spacing, .25rem) * .5);font-size:.6rem;opacity:70%;inset-inline-end:0}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-container{display:flex;height:100%;--tw-translate-z: calc(var(--spacing, .25rem) * 0);translate:var(--tw-translate-x) var(--tw-translate-y) var(--tw-translate-z);will-change:transform}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-container .ax-scheduler-timeline-header{display:flex;width:100%;background-color:var(--ax-comp-scheduler-all-day-bg,inherit)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-container .ax-scheduler-timeline-header .ax-scheduler-year-header-date-day{position:relative;display:flex;height:calc(var(--spacing, .25rem) * 16);width:var(--ax-comp-scheduler-timeline-year-view-blocks-width);flex-direction:column;align-items:flex-start;justify-content:center;gap:calc(var(--spacing, .25rem) * 1);border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 1)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-container .ax-scheduler-timeline-header .ax-scheduler-year-header-date-day.ax-state-today{background-color:rgba(var(--ax-sys-color-primary-surface));color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-container .ax-scheduler-timeline-header .ax-scheduler-year-header-date-day.ax-state-today{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 5%,transparent)}}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-container .ax-scheduler-timeline-header .ax-scheduler-year-header-date-day.ax-state-today .ax-scheduler-year-header-date-day-char{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-container .ax-scheduler-timeline-header .ax-scheduler-year-header-date-day.ax-state-today .ax-scheduler-year-header-date-day-num{--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-container .ax-scheduler-timeline-header .ax-scheduler-year-header-date-day.ax-state-holiday{color:var(--ax-scheduler-holiday-color, rgba(var(--ax-sys-color-danger-surface)))}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-container .ax-scheduler-timeline-header .ax-scheduler-year-header-date-day.ax-state-holiday.ax-state-today{color:rgba(var(--ax-sys-color-primary-surface))}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-container .ax-scheduler-timeline-header .ax-scheduler-year-header-date-day .ax-scheduler-year-header-date-day-char{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 4);max-width:100%;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: calc(var(--spacing, .25rem) * 3.5);line-height:calc(var(--spacing, .25rem) * 3.5);--tw-font-weight: var(--font-weight-light, 300);font-weight:var(--font-weight-light, 300)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-container .ax-scheduler-timeline-header .ax-scheduler-year-header-date-day .ax-scheduler-year-header-date-day-num{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 4);font-size:var(--text-xl, 1.25rem);line-height:var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-container .ax-scheduler-timeline-content{position:relative;height:calc(100% - 4rem);width:var(--ax-comp-scheduler-timeline-year-view-blocks-width);border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 1);padding-block:calc(var(--spacing, .25rem) * .5);padding-top:calc(var(--spanning-rows-count, 0) * (var(--ax-scheduler-timeline-spanning-row-height) + var(--ax-scheduler-timeline-spanning-gap)) + .25rem)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-container .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container{display:flex;flex-direction:column;gap:1px}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-container .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container .ax-scheduler-timeline-appointment{display:flex;width:100%;--tw-translate-z: calc(var(--spacing, .25rem) * 0);translate:var(--tw-translate-x) var(--tw-translate-y) var(--tw-translate-z);flex-direction:column;gap:calc(var(--spacing, .25rem) * .5);overflow:hidden;border-radius:calc(var(--ax-sys-border-radius) / 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: calc(var(--spacing, .25rem) * 3.5);line-height:calc(var(--spacing, .25rem) * 3.5);will-change:transform}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-container .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container .ax-scheduler-timeline-appointment ax-title{--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-container .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container .ax-scheduler-year-overflow-badge{margin-top:calc(var(--spacing, .25rem) * .5);cursor:pointer;padding-inline:calc(var(--spacing, .25rem) * 0);padding-block:calc(var(--spacing, .25rem) * .5);text-align:start;font-size:.7rem}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-container .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container .ax-scheduler-year-overflow-badge:hover{text-decoration-line:underline}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container{position:relative;display:flex;height:100%;--tw-translate-z: calc(var(--spacing, .25rem) * 0);translate:var(--tw-translate-x) var(--tw-translate-y) var(--tw-translate-z);flex-direction:column;background-color:inherit;will-change:transform}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-header-sticky{position:sticky;top:calc(var(--spacing, .25rem) * 0);z-index:10;display:flex;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-header-sticky .ax-scheduler-timeline-year-resource-header-placeholder{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 0);z-index:15;display:flex;width:var(--ax-comp-scheduler-resource-header-width,8rem);min-width:var(--ax-comp-scheduler-resource-header-width,8rem);align-items:center;justify-content:center;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit;padding:calc(var(--spacing, .25rem) * 2);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-header-sticky .ax-scheduler-timeline-year-day-header{display:flex;flex:1;overflow-x:auto;background-color:inherit}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-header-sticky .ax-scheduler-timeline-year-day-header .ax-scheduler-year-header-date-day{position:relative;display:flex;height:calc(var(--spacing, .25rem) * 16);width:var(--ax-comp-scheduler-timeline-year-view-blocks-width);min-width:var(--ax-comp-scheduler-timeline-year-view-blocks-width);flex-direction:column;align-items:flex-start;justify-content:center;gap:calc(var(--spacing, .25rem) * 1);border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 1)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-header-sticky .ax-scheduler-timeline-year-day-header .ax-scheduler-year-header-date-day.ax-state-today{background-color:rgba(var(--ax-sys-color-primary-surface));color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-header-sticky .ax-scheduler-timeline-year-day-header .ax-scheduler-year-header-date-day.ax-state-today{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 5%,transparent)}}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-header-sticky .ax-scheduler-timeline-year-day-header .ax-scheduler-year-header-date-day.ax-state-today .ax-scheduler-year-header-date-day-char{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-header-sticky .ax-scheduler-timeline-year-day-header .ax-scheduler-year-header-date-day.ax-state-today .ax-scheduler-year-header-date-day-num{--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-header-sticky .ax-scheduler-timeline-year-day-header .ax-scheduler-year-header-date-day.ax-state-holiday{color:var(--ax-scheduler-holiday-color, rgba(var(--ax-sys-color-danger-surface)))}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-header-sticky .ax-scheduler-timeline-year-day-header .ax-scheduler-year-header-date-day.ax-state-holiday.ax-state-today{color:rgba(var(--ax-sys-color-primary-surface))}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-header-sticky .ax-scheduler-timeline-year-day-header .ax-scheduler-year-header-date-day .ax-scheduler-year-header-date-day-char{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 4);max-width:100%;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: calc(var(--spacing, .25rem) * 3.5);line-height:calc(var(--spacing, .25rem) * 3.5);--tw-font-weight: var(--font-weight-light, 300);font-weight:var(--font-weight-light, 300)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-header-sticky .ax-scheduler-timeline-year-day-header .ax-scheduler-year-header-date-day .ax-scheduler-year-header-date-day-num{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 4);font-size:var(--text-xl, 1.25rem);line-height:var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows{position:relative;flex:1;overflow:visible;background-color:inherit}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row{display:flex;width:max-content;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit;min-height:calc(var(--resource-spanning-rows-count, 0) * (var(--ax-scheduler-timeline-spanning-row-height) + var(--ax-scheduler-timeline-spanning-gap)) + var(--ax-comp-scheduler-timeline-year-row-base-height, 4rem))}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-header{display:flex;width:var(--ax-comp-scheduler-resource-header-width,8rem);min-width:var(--ax-comp-scheduler-resource-header-width,8rem);align-items:center;justify-content:center;align-self:stretch;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit;padding:calc(var(--spacing, .25rem) * 2)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-header.ax-scheduler-timeline-year-resource-header-sticky{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 0);z-index:9;background-color:inherit}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-header .ax-scheduler-timeline-year-resource-title{text-align:center;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);overflow-wrap:break-word}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-content{position:relative;display:flex;flex:1;background-color:inherit}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-content .ax-scheduler-timeline-resource-spanning-layer{pointer-events:none;position:absolute;inset-inline-start:calc(var(--spacing, .25rem) * 0);inset-inline-end:calc(var(--spacing, .25rem) * 0);top:calc(var(--spacing, .25rem) * 0);z-index:5;display:grid;align-content:flex-start;padding-inline:calc(var(--spacing, .25rem) * .5);padding-block:calc(var(--spacing, .25rem) * 1);row-gap:var(--ax-scheduler-timeline-spanning-gap);grid-auto-rows:var(--ax-scheduler-timeline-spanning-row-height);grid-template-columns:repeat(var(--timeline-days-count, 365),var(--ax-comp-scheduler-timeline-year-view-blocks-width))}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-content .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment{z-index:6;display:flex;cursor:pointer;align-items:center;overflow:hidden;text-overflow:ellipsis;border-radius:var(--radius-sm, .25rem);padding-inline:calc(var(--spacing, .25rem) * 1);padding-block:calc(var(--spacing, .25rem) * .5);font-size:.7rem;white-space:nowrap;margin-inline:.125rem;pointer-events:auto}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-content .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment .ax-spanning-appointment-title{display:flex;height:100%;width:100%;align-items:center;justify-content:space-between;padding-inline:calc(var(--spacing, .25rem) * 2)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-content .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment .ax-spanning-appointment-title .ax-scheduler-truncate{min-width:calc(var(--spacing, .25rem) * 0);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-content .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment .ax-spanning-appointment-title .ax-scheduler-action-icon{margin-inline-start:calc(var(--spacing, .25rem) * 1);width:auto;flex-shrink:0;cursor:pointer}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-content .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-start-clipped{position:relative;border-start-start-radius:0;border-end-start-radius:0;margin-inline-start:0}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-content .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-start-clipped:before{content:\"\\2190 \";position:absolute;top:calc(var(--spacing, .25rem) * .5);font-size:.6rem;opacity:70%;inset-inline-start:0}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-content .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-end-clipped{position:relative;border-start-end-radius:0;border-end-end-radius:0;margin-inline-end:0}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-content .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-end-clipped:after{content:\" \\2192\";position:absolute;top:calc(var(--spacing, .25rem) * .5);font-size:.6rem;opacity:70%;inset-inline-end:0}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-content .ax-scheduler-timeline-year-slot-row{position:relative;display:flex;width:var(--ax-comp-scheduler-timeline-year-view-blocks-width);min-width:var(--ax-comp-scheduler-timeline-year-view-blocks-width);flex-direction:column;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit;padding-bottom:calc(var(--spacing, .25rem) * 1);padding-top:calc(var(--spanning-rows-count, 0) * (var(--ax-scheduler-timeline-spanning-row-height) + var(--ax-scheduler-timeline-spanning-gap)) + .25rem)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-content .ax-scheduler-timeline-year-slot-row .ax-scheduler-timeline-appointment-container{display:flex;width:100%;flex-direction:column;gap:var(--ax-comp-scheduler-timeline-year-gap-height,.125rem);padding-inline:calc(var(--spacing, .25rem) * 1)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-content .ax-scheduler-timeline-year-slot-row .ax-scheduler-timeline-appointment-container ax-popover{display:none}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-content .ax-scheduler-timeline-year-slot-row .ax-scheduler-timeline-appointment-container .ax-scheduler-timeline-appointment{display:flex;min-height:calc(var(--spacing, .25rem) * 8);width:100%;flex-shrink:0;--tw-translate-z: calc(var(--spacing, .25rem) * 0);translate:var(--tw-translate-x) var(--tw-translate-y) var(--tw-translate-z);flex-direction:column;gap:calc(var(--spacing, .25rem) * .5);overflow:hidden;border-radius:calc(var(--ax-sys-border-radius) / 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: calc(var(--spacing, .25rem) * 3.5);line-height:calc(var(--spacing, .25rem) * 3.5);will-change:transform}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-content .ax-scheduler-timeline-year-slot-row .ax-scheduler-timeline-appointment-container .ax-scheduler-timeline-appointment ax-title{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-content .ax-scheduler-timeline-year-slot-row .ax-scheduler-timeline-appointment-container .ax-scheduler-year-overflow-badge{margin-top:calc(var(--spacing, .25rem) * .5);flex-shrink:0;cursor:pointer;padding-inline:calc(var(--spacing, .25rem) * 0);padding-block:calc(var(--spacing, .25rem) * .5);text-align:start;font-size:.7rem}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-content .ax-scheduler-timeline-year-slot-row .ax-scheduler-timeline-appointment-container .ax-scheduler-year-overflow-badge:hover{text-decoration-line:underline}ax-scheduler-timeline-year-view:not(.ax-state-readonly) .ax-scheduler-timeline-appointment{cursor:pointer}ax-scheduler-timeline-year-view:not(.ax-state-readonly) .ax-scheduler-timeline-content,ax-scheduler-timeline-year-view:not(.ax-state-readonly) .ax-scheduler-timeline-year-slot-row{cursor:pointer;transition-property:background-color;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));transition-duration:var(--ax-sys-transition-duration);transition-timing-function:var(--ax-sys-transition-timing-function)}:is(ax-scheduler-timeline-year-view:not(.ax-state-readonly) .ax-scheduler-timeline-content,ax-scheduler-timeline-year-view:not(.ax-state-readonly) .ax-scheduler-timeline-year-slot-row):hover{background-color:rgba(var(--ax-comp-scheduler-slot-hover-bg,var(--ax-sys-color-primary-surface),.1))}ax-scheduler-timeline-year-view ax-title{display:flex;justify-content:space-between}ax-scheduler-timeline-year-view ax-title .ax-scheduler-action-icon{width:auto;cursor:pointer}ax-scheduler-timeline-year-view .ax-scheduler-current-time-line{top:calc(var(--spacing, .25rem) * 0);bottom:calc(var(--spacing, .25rem) * 0);width:calc(var(--spacing, .25rem) * .5)}ax-scheduler-timeline-year-view .ax-scheduler-current-time-line:before{content:var(--tw-content);inset-inline-start:-5px}ax-scheduler-timeline-year-view .ax-scheduler-current-time-line:before{content:var(--tw-content);top:calc(var(--spacing, .25rem) * -1.5)}ax-scheduler.ax-rtl ax-scheduler-timeline-year-view .ax-scheduler-timeline-spanning-appointment.ax-spanning-start-clipped:before{content:\"\\2192 \"}ax-scheduler.ax-rtl ax-scheduler-timeline-year-view .ax-scheduler-timeline-spanning-appointment.ax-spanning-end-clipped:after{content:\" \\2190\"}}@property --tw-translate-x{syntax: \"*\"; inherits: false; initial-value: 0;}@property --tw-translate-y{syntax: \"*\"; inherits: false; initial-value: 0;}@property --tw-translate-z{syntax: \"*\"; inherits: false; initial-value: 0;}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-content{syntax: \"*\"; initial-value: \"\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x: 0;--tw-translate-y: 0;--tw-translate-z: 0;--tw-border-style: solid;--tw-font-weight: initial;--tw-leading: initial;--tw-content: \"\"}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: AXDragDirective, selector: "[axDrag]", inputs: ["axDrag", "dragData", "dragDisabled", "dragTransition", "dragElementClone", "dropZoneGroup", "dragStartDelay", "dragResetOnDblClick", "dragLockAxis", "dragClonedTemplate", "dragCursor", "dragBoundary", "dragTransitionDuration"], outputs: ["dragPositionChanged"] }, { kind: "component", type: AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disablePanelClass", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "closeOnScroll", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "directive", type: AXTooltipDirective, selector: "[axTooltip]", inputs: ["axTooltipDisabled", "axTooltip", "axTooltipContext", "axTooltipPlacement", "axTooltipOffsetX", "axTooltipOffsetY", "axTooltipOpenAfter", "axTooltipCloseAfter"] }, { kind: "directive", type: AXDropZoneDirective, selector: "[axDropZone]", inputs: ["dropZoneGroup"], outputs: ["onElementDrop", "onElementHover"], exportAs: ["axDropZone"] }, { kind: "component", type: AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXFormatPipe, name: "format" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
4011
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXSchedulerTimelineYearViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
4012
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXSchedulerTimelineYearViewComponent, isStandalone: true, selector: "ax-scheduler-timeline-year-view", inputs: { readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, draggable: { classPropertyName: "draggable", publicName: "draggable", isSignal: true, isRequired: false, transformFunction: null }, hasActions: { classPropertyName: "hasActions", publicName: "hasActions", isSignal: true, isRequired: false, transformFunction: null }, dragStartDelay: { classPropertyName: "dragStartDelay", publicName: "dragStartDelay", isSignal: true, isRequired: false, transformFunction: null }, calendar: { classPropertyName: "calendar", publicName: "calendar", isSignal: true, isRequired: false, transformFunction: null }, showResourceHeaders: { classPropertyName: "showResourceHeaders", publicName: "showResourceHeaders", isSignal: true, isRequired: false, transformFunction: null }, date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: true, transformFunction: null }, showUnassignedAppointments: { classPropertyName: "showUnassignedAppointments", publicName: "showUnassignedAppointments", isSignal: true, isRequired: false, transformFunction: null }, selectedAppointmentId: { classPropertyName: "selectedAppointmentId", publicName: "selectedAppointmentId", isSignal: true, isRequired: false, transformFunction: null }, resources: { classPropertyName: "resources", publicName: "resources", isSignal: true, isRequired: false, transformFunction: null }, showCurrentTimeIndicator: { classPropertyName: "showCurrentTimeIndicator", publicName: "showCurrentTimeIndicator", isSignal: true, isRequired: false, transformFunction: null }, scrollToCurrentTimeIndicator: { classPropertyName: "scrollToCurrentTimeIndicator", publicName: "scrollToCurrentTimeIndicator", isSignal: true, isRequired: false, transformFunction: null }, resourceTemplate: { classPropertyName: "resourceTemplate", publicName: "resourceTemplate", isSignal: true, isRequired: false, transformFunction: null }, appointments: { classPropertyName: "appointments", publicName: "appointments", isSignal: true, isRequired: false, transformFunction: null }, tooltipTemplate: { classPropertyName: "tooltipTemplate", publicName: "tooltipTemplate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { slotClickedInternal: "slotClickedInternal", slotDblClickedInternal: "slotDblClickedInternal", slotRightClickedInternal: "slotRightClickedInternal", appointmentClickedInternal: "appointmentClickedInternal", appointmentDblClickedInternal: "appointmentDblClickedInternal", appointmentRightClickedInternal: "appointmentRightClickedInternal", onActionClickInternal: "onActionClickInternal", onAppointmentDropInternal: "onAppointmentDropInternal" }, host: { properties: { "class.ax-state-readonly": "readonly()" } }, providers: [{ provide: AXComponent, useExisting: AXSchedulerTimelineYearViewComponent }], viewQueries: [{ propertyName: "currentTimeLineElement", first: true, predicate: ["currentTimeLine"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (resources().length === 0 || !showResourceHeaders()) {\n <!-- Original layout when no resources -->\n <div class=\"ax-scheduler-timeline-year-wrapper\">\n <!-- Spanning appointments layer -->\n @if (spanningAppointments().length > 0) {\n <div class=\"ax-scheduler-timeline-year-spanning-layer\" [style.--timeline-days-count]=\"processedDayData().length\">\n @for (spanning of spanningAppointments(); track spanning.appointment.id) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragData]=\"spanning.appointment\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"optimizedDragStartDelay()\"\n [dragDisabled]=\"!draggable() || spanning.appointment.readonly || readonly()\"\n (pointerdown)=\"getSlotId($event)\"\n (click)=\"handleAppointmentEvent($event, spanning.appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, spanning.appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, spanning.appointment)\"\n [title]=\"\n tooltipTemplate()\n ? ''\n : spanning.appointment.title +\n ' (' +\n (spanning.appointment.startDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async) +\n ' - ' +\n (spanning.appointment.endDate | format: 'date' : { format: 'MMM d', calendar: calendar() } | async) +\n ')'\n \"\n class=\"ax-scheduler-timeline-spanning-appointment {{\n spanning.appointment.cssClass ??\n 'ax-scheduler-' + (spanning.appointment.priority ?? 'primary') + '-priority'\n }}\"\n [class.ax-spanning-start-clipped]=\"spanning.isStartClipped\"\n [class.ax-spanning-end-clipped]=\"spanning.isEndClipped\"\n [class.ax-state-active]=\"isActive(spanning.appointment.id)\"\n [style.grid-column]=\"spanning.startDayIndex + 1 + ' / span ' + spanning.spanCount\"\n [style.grid-row]=\"spanning.rowIndex + 1\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltip]=\"tooltipTemplate()\"\n [axTooltipContext]=\"spanning.appointment\"\n >\n <span class=\"ax-spanning-appointment-title\">\n <span class=\"ax-scheduler-truncate\">{{ spanning.appointment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, spanning.appointment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n ></ax-icon>\n }\n </span>\n </div>\n }\n </div>\n }\n\n <div class=\"ax-scheduler-timeline-year-container\">\n @for (dayData of processedDayData(); track dayData.date.date.getTime()) {\n <div>\n <div class=\"ax-scheduler-timeline-header\">\n <div\n [class.ax-state-today]=\"isToday(dayData.date)\"\n class=\"ax-scheduler-year-header-date-day {{\n dayData.holiday.state !== 'none' ? (dayData.holiday.holiday?.cssClass ?? 'ax-state-holiday') : ''\n }}\"\n [style.--ax-scheduler-holiday-color]=\"dayData.holiday.holiday?.color ?? null\"\n >\n <span\n class=\"ax-scheduler-year-header-date-day-char ax-scheduler-truncate\"\n [axTooltip]=\"(dayData.holiday.holiday?.description ?? dayData.holiday.holiday?.title ?? '') | translate | async\"\n >\n {{ dayData.date | format: 'date' : { format: 'MMMM', calendar: calendar() } | async }}\n @if (dayData.holiday.state === 'holiday' && dayData.holiday.holiday.title) {\n ( {{ dayData.holiday.holiday.title | translate | async }} )\n }\n </span>\n <span class=\"ax-scheduler-year-header-date-day-num\">\n {{ dayData.date | format: 'date' : { format: 'DD', calendar: calendar() } | async }}\n </span>\n </div>\n </div>\n\n <div\n axDropZone\n #zone=\"axDropZone\"\n (onElementDrop)=\"handleDrop($event, dayData.date)\"\n [class.ax-scheduler-slot-hovered]=\"zone.isHovered()\"\n class=\"ax-scheduler-timeline-content\"\n (click)=\"handleSlotEvent($event, dayData.date)\"\n (dblclick)=\"handleSlotEvent($event, dayData.date)\"\n (contextmenu)=\"handleSlotEvent($event, dayData.date)\"\n [attr.data-slot-id]=\"dayData.date.format('YYYYMMDD')\"\n [style.pointer-events]=\"draggable() ? 'auto' : 'none'\"\n [style.--spanning-rows-count]=\"maxSpanningRows()\"\n >\n <!-- Current Time Line Indicator -->\n @if (\n showCurrentTimeIndicator() &&\n shouldShowCurrentTimeForDay(dayData.date) &&\n getCurrentTimePosition() !== null\n ) {\n <div\n class=\"ax-scheduler-current-time-line\"\n [style.inset-inline-start.%]=\"getCurrentTimePosition()\"\n #currentTimeLine\n ></div>\n }\n <div class=\"ax-scheduler-timeline-appointment-container\">\n @for (segment of dayData.visibleAppointments; track segment.id + segment.originalStartDate.getTime()) {\n <div\n axDrag\n [dragData]=\"segment\"\n [dragCursor]=\"'grab'\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"optimizedDragStartDelay()\"\n [dragDisabled]=\"!draggable() || segment.readonly || readonly()\"\n (pointerdown)=\"getSlotId($event)\"\n (click)=\"handleAppointmentEvent($event, segment)\"\n (dblclick)=\"handleAppointmentEvent($event, segment)\"\n (contextmenu)=\"handleAppointmentEvent($event, segment)\"\n [title]=\"\n tooltipTemplate()\n ? ''\n : segment.title +\n ' (' +\n (segment.originalStartDate | format: 'time' : { calendar: calendar() } | async) +\n ' - ' +\n (segment.originalEndDate | format: 'time' : { calendar: calendar() } | async) +\n ')'\n \"\n class=\"ax-scheduler-timeline-appointment {{\n segment.cssClass ?? 'ax-scheduler-' + (segment.priority ?? 'primary') + '-priority'\n }}\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltip]=\"tooltipTemplate()\"\n [axTooltipContext]=\"segment\"\n >\n <ax-title>\n <span class=\"ax-scheduler-truncate\">{{ segment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, segment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n >\n </ax-icon>\n }\n </ax-title>\n <span class=\"ax-scheduler-timeline-appointment-time\">\n {{ segment.originalStartDate | format: 'time' : { calendar: calendar() } | async }}\n @if (segment.originalStartDate.getTime() !== segment.originalEndDate.getTime()) {\n -\n {{ segment.originalEndDate | format: 'time' : { calendar: calendar() } | async }}\n }\n </span>\n </div>\n }\n\n <!-- Overflow Badge and Popover -->\n @if (dayData.moreCount > 0) {\n <div #moreAppointments class=\"ax-scheduler-year-overflow-badge\" (click)=\"$event.stopPropagation()\">\n +{{\n '@acorex:common.general.more-items' | translate: { params: { number: dayData.moreCount } } | async\n }}\n </div>\n <ax-popover [target]=\"moreAppointments\" placement=\"bottom-start\" trigger=\"click\">\n <div\n axDropZone\n [class.ax-state-readonly]=\"readonly()\"\n class=\"ax-scheduler-popover ax-scheduler-timeline-year-popover-appointment\"\n >\n @for (\n segment of dayData.hiddenAppointments;\n track segment.id + segment.originalStartDate.getTime()\n ) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragData]=\"segment\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"optimizedDragStartDelay()\"\n [dragDisabled]=\"!draggable() || segment.readonly || readonly()\"\n (click)=\"handleAppointmentEvent($event, segment); $event.stopPropagation()\"\n (dblclick)=\"handleAppointmentEvent($event, segment); $event.stopPropagation()\"\n (contextmenu)=\"handleAppointmentEvent($event, segment); $event.stopPropagation()\"\n [title]=\"\n tooltipTemplate()\n ? ''\n : segment.title +\n ' (' +\n (segment.originalStartDate | format: 'time' : { calendar: calendar() } | async) +\n ' - ' +\n (segment.originalEndDate | format: 'time' : { calendar: calendar() } | async) +\n ')'\n \"\n class=\"ax-scheduler-popover-appointment {{\n segment.cssClass ?? 'ax-scheduler-' + (segment.priority ?? 'primary') + '-priority'\n }}\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltip]=\"tooltipTemplate()\"\n [axTooltipContext]=\"segment\"\n >\n <ax-title>\n <span class=\"ax-scheduler-truncate\">{{ segment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, segment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n >\n </ax-icon>\n }\n </ax-title>\n <span class=\"ax-scheduler-timeline-appointment-time\">\n {{ segment.originalStartDate | format: 'time' : { calendar: calendar() } | async }}\n @if (segment.originalStartDate.getTime() !== segment.originalEndDate.getTime()) {\n -\n {{ segment.originalEndDate | format: 'time' : { calendar: calendar() } | async }}\n }\n </span>\n </div>\n }\n </div>\n </ax-popover>\n }\n </div>\n </div>\n </div>\n }\n </div>\n </div>\n} @else {\n <!-- Resource-based layout -->\n <div class=\"ax-scheduler-timeline-year-resource-container\">\n <div class=\"ax-scheduler-timeline-year-header-sticky\">\n <div class=\"ax-scheduler-timeline-year-resource-header-placeholder\">\n <span>Resources</span>\n </div>\n\n <div class=\"ax-scheduler-timeline-year-day-header\">\n @for (dayData of processedDayData(); track dayData.date.date.getTime()) {\n <div\n [class.ax-state-today]=\"isToday(dayData.date)\"\n class=\"ax-scheduler-year-header-date-day {{\n dayData.holiday.state !== 'none' ? (dayData.holiday.holiday?.cssClass ?? 'ax-state-holiday') : ''\n }}\"\n [style.--ax-scheduler-holiday-color]=\"dayData.holiday.holiday?.color ?? null\"\n >\n <span\n class=\"ax-scheduler-year-header-date-day-char ax-scheduler-truncate\"\n [axTooltip]=\"(dayData.holiday.holiday?.description ?? dayData.holiday.holiday?.title ?? '') | translate | async\"\n >\n {{ dayData.date | format: 'date' : { format: 'MMMM', calendar: calendar() } | async }}\n @if (dayData.holiday.state === 'holiday' && dayData.holiday.holiday.title) {\n ( {{ dayData.holiday.holiday.title | translate | async }} )\n }\n </span>\n <span class=\"ax-scheduler-year-header-date-day-num\">\n {{ dayData.date | format: 'date' : { format: 'DD', calendar: calendar() } | async }}\n </span>\n </div>\n }\n </div>\n </div>\n\n <div class=\"ax-scheduler-timeline-year-resource-rows\">\n <!-- Current Time Line Indicator -->\n @if (showCurrentTimeIndicator() && getCurrentTimePosition() !== null) {\n <div\n class=\"ax-scheduler-current-time-line\"\n [style.inset-inline-start.%]=\"getCurrentTimePosition()\"\n #currentTimeLine\n ></div>\n }\n\n @for (resourceId of resourceIds(); track resourceId) {\n <div\n class=\"ax-scheduler-timeline-year-resource-row\"\n [style.--resource-spanning-rows-count]=\"getMaxSpanningRowsForResource(resourceId)\"\n >\n <div class=\"ax-scheduler-timeline-year-resource-header ax-scheduler-timeline-year-resource-header-sticky\">\n @if (resourceTemplate() && typeof resourceTemplate() !== 'string') {\n <ng-container\n [ngTemplateOutlet]=\"$any(resourceTemplate())\"\n [ngTemplateOutletContext]=\"{\n $implicit: getResourceContext(resourceId),\n resource: getResourceContext(resourceId),\n resourceId: resourceId,\n }\"\n ></ng-container>\n } @else {\n <div class=\"ax-scheduler-timeline-year-resource-title\">\n {{ getResourceTitle(resourceId) | translate | async }}\n </div>\n }\n </div>\n\n <div class=\"ax-scheduler-timeline-year-resource-content\">\n <!-- Spanning appointments layer for this resource -->\n @if (getSpanningAppointmentsForResource(resourceId).length > 0) {\n <div\n class=\"ax-scheduler-timeline-resource-spanning-layer\"\n [style.--timeline-days-count]=\"processedDayData().length\"\n >\n @for (spanning of getSpanningAppointmentsForResource(resourceId); track spanning.appointment.id) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragData]=\"spanning.appointment\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"optimizedDragStartDelay()\"\n [dragDisabled]=\"!draggable() || spanning.appointment.readonly || readonly()\"\n (pointerdown)=\"getSlotId($event)\"\n (click)=\"handleAppointmentEvent($event, spanning.appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, spanning.appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, spanning.appointment)\"\n [title]=\"\n tooltipTemplate()\n ? ''\n : spanning.appointment.title +\n ' (' +\n (spanning.appointment.startDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async) +\n ' - ' +\n (spanning.appointment.endDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async) +\n ')'\n \"\n class=\"ax-scheduler-timeline-spanning-appointment {{\n spanning.appointment.cssClass ??\n 'ax-scheduler-' + (spanning.appointment.priority ?? 'primary') + '-priority'\n }}\"\n [class.ax-spanning-start-clipped]=\"spanning.isStartClipped\"\n [class.ax-spanning-end-clipped]=\"spanning.isEndClipped\"\n [class.ax-state-active]=\"isActive(spanning.appointment.id)\"\n [style.grid-column]=\"spanning.startDayIndex + 1 + ' / span ' + spanning.spanCount\"\n [style.grid-row]=\"spanning.rowIndex + 1\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltip]=\"tooltipTemplate()\"\n [axTooltipContext]=\"spanning.appointment\"\n >\n <span class=\"ax-spanning-appointment-title\">\n <span class=\"ax-scheduler-truncate\">{{ spanning.appointment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, spanning.appointment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n ></ax-icon>\n }\n </span>\n </div>\n }\n </div>\n }\n\n @for (dayData of processedDayData(); track dayData.date.date.getTime()) {\n <div\n axDropZone\n #zone=\"axDropZone\"\n (onElementDrop)=\"handleDrop($event, dayData.date, resourceId)\"\n [class.ax-scheduler-slot-hovered]=\"zone.isHovered()\"\n class=\"ax-scheduler-timeline-year-slot-row\"\n (click)=\"handleSlotEvent($event, dayData.date)\"\n (dblclick)=\"handleSlotEvent($event, dayData.date)\"\n (contextmenu)=\"handleSlotEvent($event, dayData.date)\"\n [attr.data-slot-id]=\"dayData.date.format('YYYYMMDD')\"\n [attr.data-resource-id]=\"resourceId\"\n [style.pointer-events]=\"draggable() ? 'auto' : 'none'\"\n [style.--spanning-rows-count]=\"getMaxSpanningRowsForResource(resourceId)\"\n >\n <div class=\"ax-scheduler-timeline-appointment-container\">\n @for (\n segment of getAppointmentsForResourceAndDay(resourceId, dayData).visible;\n track segment.id + segment.originalStartDate.getTime()\n ) {\n <div\n axDrag\n [dragData]=\"segment\"\n [dragCursor]=\"'grab'\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"optimizedDragStartDelay()\"\n [dragDisabled]=\"!draggable() || segment.readonly || readonly()\"\n (pointerdown)=\"getSlotId($event)\"\n (click)=\"handleAppointmentEvent($event, segment)\"\n (dblclick)=\"handleAppointmentEvent($event, segment)\"\n (contextmenu)=\"handleAppointmentEvent($event, segment)\"\n [title]=\"\n tooltipTemplate()\n ? ''\n : segment.allDay\n ? segment.title +\n ' (' +\n (segment.originalStartDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async) +\n ' - ' +\n (segment.originalEndDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async) +\n ')'\n : segment.title +\n ' (' +\n (segment.originalStartDate | format: 'time' : { calendar: calendar() } | async) +\n ' - ' +\n (segment.originalEndDate | format: 'time' : { calendar: calendar() } | async) +\n ')'\n \"\n class=\"ax-scheduler-timeline-appointment {{\n segment.cssClass ?? 'ax-scheduler-' + (segment.priority ?? 'primary') + '-priority'\n }}\"\n [class.all-day-segment]=\"segment.allDay\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltip]=\"tooltipTemplate()\"\n [axTooltipContext]=\"segment\"\n >\n <ax-title>\n <span class=\"ax-scheduler-truncate\">{{ segment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, segment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n >\n </ax-icon>\n }\n </ax-title>\n <span class=\"ax-scheduler-timeline-appointment-time\">\n @if (segment.allDay) {\n {{\n segment.originalStartDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async\n }}\n @if (segment.originalStartDate.getTime() !== segment.originalEndDate.getTime()) {\n -\n {{\n segment.originalEndDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async\n }}\n }\n } @else {\n {{ segment.originalStartDate | format: 'time' : { calendar: calendar() } | async }}\n @if (segment.originalStartDate.getTime() !== segment.originalEndDate.getTime()) {\n -\n {{ segment.originalEndDate | format: 'time' : { calendar: calendar() } | async }}\n }\n }\n </span>\n </div>\n }\n\n <!-- Overflow Badge and Popover -->\n @if (getAppointmentsForResourceAndDay(resourceId, dayData).moreCount > 0) {\n <div #moreAppointments class=\"ax-scheduler-year-overflow-badge\" (click)=\"$event.stopPropagation()\">\n +{{\n '@acorex:common.general.more-items'\n | translate\n : { params: { number: getAppointmentsForResourceAndDay(resourceId, dayData).moreCount } }\n | async\n }}\n </div>\n <ax-popover [target]=\"moreAppointments\" placement=\"bottom-start\" trigger=\"click\">\n <div\n axDropZone\n [class.ax-state-readonly]=\"readonly()\"\n class=\"ax-scheduler-popover ax-scheduler-timeline-year-popover-appointment\"\n >\n @for (\n segment of getAppointmentsForResourceAndDay(resourceId, dayData).hidden;\n track segment.id + segment.originalStartDate.getTime()\n ) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragData]=\"segment\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"optimizedDragStartDelay()\"\n [dragDisabled]=\"!draggable() || segment.readonly || readonly()\"\n (click)=\"handleAppointmentEvent($event, segment); $event.stopPropagation()\"\n (dblclick)=\"handleAppointmentEvent($event, segment); $event.stopPropagation()\"\n (contextmenu)=\"handleAppointmentEvent($event, segment); $event.stopPropagation()\"\n [title]=\"\n tooltipTemplate()\n ? ''\n : segment.allDay\n ? segment.title\n : segment.title +\n ' (' +\n (segment.originalStartDate | format: 'time' : { calendar: calendar() } | async) +\n ' - ' +\n (segment.originalEndDate | format: 'time' : { calendar: calendar() } | async) +\n ')'\n \"\n class=\"ax-scheduler-popover-appointment {{\n segment.cssClass ?? 'ax-scheduler-' + (segment.priority ?? 'primary') + '-priority'\n }}\"\n [class.all-day-segment]=\"segment.allDay\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltip]=\"tooltipTemplate()\"\n [axTooltipContext]=\"segment\"\n >\n <ax-title>\n <span class=\"ax-scheduler-truncate\">{{ segment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, segment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n >\n </ax-icon>\n }\n </ax-title>\n @if (!segment.allDay) {\n <span class=\"ax-scheduler-timeline-appointment-time\">\n {{ segment.originalStartDate | format: 'time' : { calendar: calendar() } | async }}\n @if (\n !segment.allDay &&\n segment.originalStartDate.getTime() !== segment.originalEndDate.getTime()\n ) {\n -\n {{ segment.originalEndDate | format: 'time' : { calendar: calendar() } | async }}\n }\n </span>\n }\n </div>\n }\n </div>\n </ax-popover>\n }\n </div>\n </div>\n }\n </div>\n </div>\n }\n </div>\n </div>\n}\n", styles: ["@layer properties;@layer components{ax-scheduler-timeline-year-view{--ax-scheduler-timeline-spanning-row-height: 1.5rem;--ax-scheduler-timeline-spanning-gap: .125rem;position:relative;display:inline-flex;height:100%;flex-direction:column;background-color:inherit;--ax-comp-scheduler-timeline-year-view-blocks-width: calc(var(--ax-comp-scheduler-timeline-view-blocks-width) / 2)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-wrapper{position:relative;display:flex;height:100%;flex-direction:column}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-spanning-layer{pointer-events:none;position:absolute;inset-inline-start:calc(var(--spacing, .25rem) * 0);inset-inline-end:calc(var(--spacing, .25rem) * 0);top:calc(var(--spacing, .25rem) * 16);z-index:5;display:grid;align-content:flex-start;padding-inline:calc(var(--spacing, .25rem) * .5);padding-block:calc(var(--spacing, .25rem) * 1);row-gap:var(--ax-scheduler-timeline-spanning-gap);grid-auto-rows:var(--ax-scheduler-timeline-spanning-row-height);grid-template-columns:repeat(var(--timeline-days-count, 365),var(--ax-comp-scheduler-timeline-year-view-blocks-width))}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-spanning-layer .ax-scheduler-timeline-spanning-appointment{z-index:6;display:flex;cursor:pointer;align-items:center;overflow:hidden;text-overflow:ellipsis;border-radius:var(--radius-sm, .25rem);padding-inline:calc(var(--spacing, .25rem) * 1);padding-block:calc(var(--spacing, .25rem) * .5);font-size:.7rem;white-space:nowrap;margin-inline:.125rem;pointer-events:auto}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-spanning-layer .ax-scheduler-timeline-spanning-appointment .ax-spanning-appointment-title{display:flex;height:100%;width:100%;align-items:center;justify-content:space-between;padding-inline:calc(var(--spacing, .25rem) * 2)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-spanning-layer .ax-scheduler-timeline-spanning-appointment .ax-spanning-appointment-title .ax-scheduler-truncate{min-width:calc(var(--spacing, .25rem) * 0);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-spanning-layer .ax-scheduler-timeline-spanning-appointment .ax-spanning-appointment-title .ax-scheduler-action-icon{margin-inline-start:calc(var(--spacing, .25rem) * 1);width:auto;flex-shrink:0;cursor:pointer}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-start-clipped{position:relative;border-start-start-radius:0;border-end-start-radius:0;margin-inline-start:0}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-start-clipped:before{content:\"\\2190 \";position:absolute;top:calc(var(--spacing, .25rem) * .5);font-size:.6rem;opacity:70%;inset-inline-start:0}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-end-clipped{position:relative;border-start-end-radius:0;border-end-end-radius:0;margin-inline-end:0}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-end-clipped:after{content:\" \\2192\";position:absolute;top:calc(var(--spacing, .25rem) * .5);font-size:.6rem;opacity:70%;inset-inline-end:0}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-container{display:flex;height:100%;--tw-translate-z: calc(var(--spacing, .25rem) * 0);translate:var(--tw-translate-x) var(--tw-translate-y) var(--tw-translate-z);will-change:transform}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-container .ax-scheduler-timeline-header{display:flex;width:100%;background-color:var(--ax-comp-scheduler-all-day-bg,inherit)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-container .ax-scheduler-timeline-header .ax-scheduler-year-header-date-day{position:relative;display:flex;height:calc(var(--spacing, .25rem) * 16);width:var(--ax-comp-scheduler-timeline-year-view-blocks-width);flex-direction:column;align-items:flex-start;justify-content:center;gap:calc(var(--spacing, .25rem) * 1);border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 1)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-container .ax-scheduler-timeline-header .ax-scheduler-year-header-date-day.ax-state-today{background-color:rgba(var(--ax-sys-color-primary-surface));color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-container .ax-scheduler-timeline-header .ax-scheduler-year-header-date-day.ax-state-today{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 5%,transparent)}}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-container .ax-scheduler-timeline-header .ax-scheduler-year-header-date-day.ax-state-today .ax-scheduler-year-header-date-day-char{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-container .ax-scheduler-timeline-header .ax-scheduler-year-header-date-day.ax-state-today .ax-scheduler-year-header-date-day-num{--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-container .ax-scheduler-timeline-header .ax-scheduler-year-header-date-day.ax-state-holiday{color:var(--ax-scheduler-holiday-color, rgba(var(--ax-sys-color-danger-surface)))}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-container .ax-scheduler-timeline-header .ax-scheduler-year-header-date-day.ax-state-holiday.ax-state-today{color:rgba(var(--ax-sys-color-primary-surface))}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-container .ax-scheduler-timeline-header .ax-scheduler-year-header-date-day .ax-scheduler-year-header-date-day-char{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 4);max-width:100%;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: calc(var(--spacing, .25rem) * 3.5);line-height:calc(var(--spacing, .25rem) * 3.5);--tw-font-weight: var(--font-weight-light, 300);font-weight:var(--font-weight-light, 300)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-container .ax-scheduler-timeline-header .ax-scheduler-year-header-date-day .ax-scheduler-year-header-date-day-num{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 4);font-size:var(--text-xl, 1.25rem);line-height:var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-container .ax-scheduler-timeline-content{position:relative;height:calc(100% - 4rem);width:var(--ax-comp-scheduler-timeline-year-view-blocks-width);border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 1);padding-block:calc(var(--spacing, .25rem) * .5);padding-top:calc(var(--spanning-rows-count, 0) * (var(--ax-scheduler-timeline-spanning-row-height) + var(--ax-scheduler-timeline-spanning-gap)) + .25rem)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-container .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container{display:flex;flex-direction:column;gap:1px}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-container .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container .ax-scheduler-timeline-appointment{display:flex;width:100%;--tw-translate-z: calc(var(--spacing, .25rem) * 0);translate:var(--tw-translate-x) var(--tw-translate-y) var(--tw-translate-z);flex-direction:column;gap:calc(var(--spacing, .25rem) * .5);overflow:hidden;border-radius:calc(var(--ax-sys-border-radius) / 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: calc(var(--spacing, .25rem) * 3.5);line-height:calc(var(--spacing, .25rem) * 3.5);will-change:transform}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-container .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container .ax-scheduler-timeline-appointment ax-title{--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-container .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container .ax-scheduler-year-overflow-badge{margin-top:calc(var(--spacing, .25rem) * .5);cursor:pointer;padding-inline:calc(var(--spacing, .25rem) * 0);padding-block:calc(var(--spacing, .25rem) * .5);text-align:start;font-size:.7rem}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-container .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container .ax-scheduler-year-overflow-badge:hover{text-decoration-line:underline}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container{position:relative;display:flex;height:100%;--tw-translate-z: calc(var(--spacing, .25rem) * 0);translate:var(--tw-translate-x) var(--tw-translate-y) var(--tw-translate-z);flex-direction:column;background-color:inherit;will-change:transform}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-header-sticky{position:sticky;top:calc(var(--spacing, .25rem) * 0);z-index:10;display:flex;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-header-sticky .ax-scheduler-timeline-year-resource-header-placeholder{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 0);z-index:15;display:flex;width:var(--ax-comp-scheduler-resource-header-width,8rem);min-width:var(--ax-comp-scheduler-resource-header-width,8rem);align-items:center;justify-content:center;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit;padding:calc(var(--spacing, .25rem) * 2);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-header-sticky .ax-scheduler-timeline-year-day-header{display:flex;flex:1;overflow-x:auto;background-color:inherit}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-header-sticky .ax-scheduler-timeline-year-day-header .ax-scheduler-year-header-date-day{position:relative;display:flex;height:calc(var(--spacing, .25rem) * 16);width:var(--ax-comp-scheduler-timeline-year-view-blocks-width);min-width:var(--ax-comp-scheduler-timeline-year-view-blocks-width);flex-direction:column;align-items:flex-start;justify-content:center;gap:calc(var(--spacing, .25rem) * 1);border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 1)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-header-sticky .ax-scheduler-timeline-year-day-header .ax-scheduler-year-header-date-day.ax-state-today{background-color:rgba(var(--ax-sys-color-primary-surface));color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-header-sticky .ax-scheduler-timeline-year-day-header .ax-scheduler-year-header-date-day.ax-state-today{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 5%,transparent)}}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-header-sticky .ax-scheduler-timeline-year-day-header .ax-scheduler-year-header-date-day.ax-state-today .ax-scheduler-year-header-date-day-char{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-header-sticky .ax-scheduler-timeline-year-day-header .ax-scheduler-year-header-date-day.ax-state-today .ax-scheduler-year-header-date-day-num{--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-header-sticky .ax-scheduler-timeline-year-day-header .ax-scheduler-year-header-date-day.ax-state-holiday{color:var(--ax-scheduler-holiday-color, rgba(var(--ax-sys-color-danger-surface)))}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-header-sticky .ax-scheduler-timeline-year-day-header .ax-scheduler-year-header-date-day.ax-state-holiday.ax-state-today{color:rgba(var(--ax-sys-color-primary-surface))}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-header-sticky .ax-scheduler-timeline-year-day-header .ax-scheduler-year-header-date-day .ax-scheduler-year-header-date-day-char{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 4);max-width:100%;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: calc(var(--spacing, .25rem) * 3.5);line-height:calc(var(--spacing, .25rem) * 3.5);--tw-font-weight: var(--font-weight-light, 300);font-weight:var(--font-weight-light, 300)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-header-sticky .ax-scheduler-timeline-year-day-header .ax-scheduler-year-header-date-day .ax-scheduler-year-header-date-day-num{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 4);font-size:var(--text-xl, 1.25rem);line-height:var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows{position:relative;flex:1;overflow:visible;background-color:inherit}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row{display:flex;width:max-content;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit;min-height:calc(var(--resource-spanning-rows-count, 0) * (var(--ax-scheduler-timeline-spanning-row-height) + var(--ax-scheduler-timeline-spanning-gap)) + var(--ax-comp-scheduler-timeline-year-row-base-height, 4rem))}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-header{display:flex;width:var(--ax-comp-scheduler-resource-header-width,8rem);min-width:var(--ax-comp-scheduler-resource-header-width,8rem);align-items:center;justify-content:center;align-self:stretch;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit;padding:calc(var(--spacing, .25rem) * 2)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-header.ax-scheduler-timeline-year-resource-header-sticky{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 0);z-index:9;background-color:inherit}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-header .ax-scheduler-timeline-year-resource-title{text-align:center;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);overflow-wrap:break-word}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-content{position:relative;display:flex;flex:1;background-color:inherit}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-content .ax-scheduler-timeline-resource-spanning-layer{pointer-events:none;position:absolute;inset-inline-start:calc(var(--spacing, .25rem) * 0);inset-inline-end:calc(var(--spacing, .25rem) * 0);top:calc(var(--spacing, .25rem) * 0);z-index:5;display:grid;align-content:flex-start;padding-inline:calc(var(--spacing, .25rem) * .5);padding-block:calc(var(--spacing, .25rem) * 1);row-gap:var(--ax-scheduler-timeline-spanning-gap);grid-auto-rows:var(--ax-scheduler-timeline-spanning-row-height);grid-template-columns:repeat(var(--timeline-days-count, 365),var(--ax-comp-scheduler-timeline-year-view-blocks-width))}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-content .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment{z-index:6;display:flex;cursor:pointer;align-items:center;overflow:hidden;text-overflow:ellipsis;border-radius:var(--radius-sm, .25rem);padding-inline:calc(var(--spacing, .25rem) * 1);padding-block:calc(var(--spacing, .25rem) * .5);font-size:.7rem;white-space:nowrap;margin-inline:.125rem;pointer-events:auto}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-content .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment .ax-spanning-appointment-title{display:flex;height:100%;width:100%;align-items:center;justify-content:space-between;padding-inline:calc(var(--spacing, .25rem) * 2)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-content .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment .ax-spanning-appointment-title .ax-scheduler-truncate{min-width:calc(var(--spacing, .25rem) * 0);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-content .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment .ax-spanning-appointment-title .ax-scheduler-action-icon{margin-inline-start:calc(var(--spacing, .25rem) * 1);width:auto;flex-shrink:0;cursor:pointer}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-content .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-start-clipped{position:relative;border-start-start-radius:0;border-end-start-radius:0;margin-inline-start:0}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-content .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-start-clipped:before{content:\"\\2190 \";position:absolute;top:calc(var(--spacing, .25rem) * .5);font-size:.6rem;opacity:70%;inset-inline-start:0}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-content .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-end-clipped{position:relative;border-start-end-radius:0;border-end-end-radius:0;margin-inline-end:0}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-content .ax-scheduler-timeline-resource-spanning-layer .ax-scheduler-timeline-spanning-appointment.ax-spanning-end-clipped:after{content:\" \\2192\";position:absolute;top:calc(var(--spacing, .25rem) * .5);font-size:.6rem;opacity:70%;inset-inline-end:0}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-content .ax-scheduler-timeline-year-slot-row{position:relative;display:flex;width:var(--ax-comp-scheduler-timeline-year-view-blocks-width);min-width:var(--ax-comp-scheduler-timeline-year-view-blocks-width);flex-direction:column;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit;padding-bottom:calc(var(--spacing, .25rem) * 1);padding-top:calc(var(--spanning-rows-count, 0) * (var(--ax-scheduler-timeline-spanning-row-height) + var(--ax-scheduler-timeline-spanning-gap)) + .25rem)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-content .ax-scheduler-timeline-year-slot-row .ax-scheduler-timeline-appointment-container{display:flex;width:100%;flex-direction:column;gap:var(--ax-comp-scheduler-timeline-year-gap-height,.125rem);padding-inline:calc(var(--spacing, .25rem) * 1)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-content .ax-scheduler-timeline-year-slot-row .ax-scheduler-timeline-appointment-container ax-popover{display:none}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-content .ax-scheduler-timeline-year-slot-row .ax-scheduler-timeline-appointment-container .ax-scheduler-timeline-appointment{display:flex;min-height:calc(var(--spacing, .25rem) * 8);width:100%;flex-shrink:0;--tw-translate-z: calc(var(--spacing, .25rem) * 0);translate:var(--tw-translate-x) var(--tw-translate-y) var(--tw-translate-z);flex-direction:column;gap:calc(var(--spacing, .25rem) * .5);overflow:hidden;border-radius:calc(var(--ax-sys-border-radius) / 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: calc(var(--spacing, .25rem) * 3.5);line-height:calc(var(--spacing, .25rem) * 3.5);will-change:transform}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-content .ax-scheduler-timeline-year-slot-row .ax-scheduler-timeline-appointment-container .ax-scheduler-timeline-appointment ax-title{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-content .ax-scheduler-timeline-year-slot-row .ax-scheduler-timeline-appointment-container .ax-scheduler-year-overflow-badge{margin-top:calc(var(--spacing, .25rem) * .5);flex-shrink:0;cursor:pointer;padding-inline:calc(var(--spacing, .25rem) * 0);padding-block:calc(var(--spacing, .25rem) * .5);text-align:start;font-size:.7rem}ax-scheduler-timeline-year-view .ax-scheduler-timeline-year-resource-container .ax-scheduler-timeline-year-resource-rows .ax-scheduler-timeline-year-resource-row .ax-scheduler-timeline-year-resource-content .ax-scheduler-timeline-year-slot-row .ax-scheduler-timeline-appointment-container .ax-scheduler-year-overflow-badge:hover{text-decoration-line:underline}ax-scheduler-timeline-year-view:not(.ax-state-readonly) .ax-scheduler-timeline-appointment{cursor:pointer}ax-scheduler-timeline-year-view:not(.ax-state-readonly) .ax-scheduler-timeline-content,ax-scheduler-timeline-year-view:not(.ax-state-readonly) .ax-scheduler-timeline-year-slot-row{cursor:pointer;transition-property:background-color;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));transition-duration:var(--ax-sys-transition-duration);transition-timing-function:var(--ax-sys-transition-timing-function)}:is(ax-scheduler-timeline-year-view:not(.ax-state-readonly) .ax-scheduler-timeline-content,ax-scheduler-timeline-year-view:not(.ax-state-readonly) .ax-scheduler-timeline-year-slot-row):hover{background-color:rgba(var(--ax-comp-scheduler-slot-hover-bg,var(--ax-sys-color-primary-surface),.1))}ax-scheduler-timeline-year-view ax-title{display:flex;justify-content:space-between}ax-scheduler-timeline-year-view ax-title .ax-scheduler-action-icon{width:auto;cursor:pointer}ax-scheduler-timeline-year-view .ax-scheduler-current-time-line{top:calc(var(--spacing, .25rem) * 0);bottom:calc(var(--spacing, .25rem) * 0);width:calc(var(--spacing, .25rem) * .5)}ax-scheduler-timeline-year-view .ax-scheduler-current-time-line:before{content:var(--tw-content);inset-inline-start:-5px}ax-scheduler-timeline-year-view .ax-scheduler-current-time-line:before{content:var(--tw-content);top:calc(var(--spacing, .25rem) * -1.5)}ax-scheduler.ax-rtl ax-scheduler-timeline-year-view .ax-scheduler-timeline-spanning-appointment.ax-spanning-start-clipped:before{content:\"\\2192 \"}ax-scheduler.ax-rtl ax-scheduler-timeline-year-view .ax-scheduler-timeline-spanning-appointment.ax-spanning-end-clipped:after{content:\" \\2190\"}}@property --tw-translate-x{syntax: \"*\"; inherits: false; initial-value: 0;}@property --tw-translate-y{syntax: \"*\"; inherits: false; initial-value: 0;}@property --tw-translate-z{syntax: \"*\"; inherits: false; initial-value: 0;}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-content{syntax: \"*\"; initial-value: \"\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x: 0;--tw-translate-y: 0;--tw-translate-z: 0;--tw-border-style: solid;--tw-font-weight: initial;--tw-leading: initial;--tw-content: \"\"}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: AXDragDirective, selector: "[axDrag]", inputs: ["axDrag", "dragData", "dragDisabled", "dragTransition", "dragElementClone", "dropZoneGroup", "dragStartDelay", "dragResetOnDblClick", "dragLockAxis", "dragClonedTemplate", "dragCursor", "dragBoundary", "dragTransitionDuration"], outputs: ["dragPositionChanged"] }, { kind: "component", type: AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disablePanelClass", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "closeOnScroll", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "directive", type: AXTooltipDirective, selector: "[axTooltip]", inputs: ["axTooltipDisabled", "axTooltip", "axTooltipContext", "axTooltipPlacement", "axTooltipOffsetX", "axTooltipOffsetY", "axTooltipOpenAfter", "axTooltipCloseAfter"] }, { kind: "directive", type: AXDropZoneDirective, selector: "[axDropZone]", inputs: ["dropZoneGroup"], outputs: ["onElementDrop", "onElementHover"], exportAs: ["axDropZone"] }, { kind: "component", type: AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXFormatPipe, name: "format" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
3859
4013
|
}
|
|
3860
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
4014
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXSchedulerTimelineYearViewComponent, decorators: [{
|
|
3861
4015
|
type: Component,
|
|
3862
|
-
args: [{ selector: 'ax-scheduler-timeline-year-view',
|
|
4016
|
+
args: [{ selector: 'ax-scheduler-timeline-year-view', encapsulation: ViewEncapsulation.None, host: {
|
|
3863
4017
|
'[class.ax-state-readonly]': 'readonly()',
|
|
3864
4018
|
}, imports: [
|
|
3865
4019
|
NgTemplateOutlet,
|
|
@@ -3884,26 +4038,41 @@ class AXSchedulerWeekViewComponent extends NXComponent {
|
|
|
3884
4038
|
this.scheduler = inject(AXSchedulerComponent);
|
|
3885
4039
|
this.calendarService = inject(AXCalendarService);
|
|
3886
4040
|
this.schedulerService = inject(AXSchedulerService);
|
|
3887
|
-
this.dragStartSlotId = signal(null,
|
|
4041
|
+
this.dragStartSlotId = signal(null, /* @ts-ignore */
|
|
4042
|
+
...(ngDevMode ? [{ debugName: "dragStartSlotId" }] : /* istanbul ignore next */ []));
|
|
3888
4043
|
// --- Constants ---
|
|
3889
4044
|
this.GAP_PX = 1;
|
|
3890
4045
|
this.BADGE_SPACE_REM = 2;
|
|
3891
4046
|
// --- Component Inputs ---
|
|
3892
|
-
this.readonly = input(false,
|
|
3893
|
-
|
|
3894
|
-
this.
|
|
3895
|
-
|
|
3896
|
-
this.
|
|
3897
|
-
|
|
3898
|
-
this.
|
|
3899
|
-
|
|
3900
|
-
this.
|
|
3901
|
-
|
|
3902
|
-
this.
|
|
3903
|
-
|
|
3904
|
-
this.
|
|
4047
|
+
this.readonly = input(false, /* @ts-ignore */
|
|
4048
|
+
...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
|
|
4049
|
+
this.draggable = input(true, /* @ts-ignore */
|
|
4050
|
+
...(ngDevMode ? [{ debugName: "draggable" }] : /* istanbul ignore next */ []));
|
|
4051
|
+
this.hasActions = input(false, /* @ts-ignore */
|
|
4052
|
+
...(ngDevMode ? [{ debugName: "hasActions" }] : /* istanbul ignore next */ []));
|
|
4053
|
+
this.dragStartDelay = input(0, /* @ts-ignore */
|
|
4054
|
+
...(ngDevMode ? [{ debugName: "dragStartDelay" }] : /* istanbul ignore next */ []));
|
|
4055
|
+
this.calendar = input(/* @ts-ignore */
|
|
4056
|
+
...(ngDevMode ? [undefined, { debugName: "calendar" }] : /* istanbul ignore next */ []));
|
|
4057
|
+
this.date = input.required(/* @ts-ignore */
|
|
4058
|
+
...(ngDevMode ? [{ debugName: "date" }] : /* istanbul ignore next */ []));
|
|
4059
|
+
this.endDayHour = input.required(/* @ts-ignore */
|
|
4060
|
+
...(ngDevMode ? [{ debugName: "endDayHour" }] : /* istanbul ignore next */ []));
|
|
4061
|
+
this.startDayHour = input.required(/* @ts-ignore */
|
|
4062
|
+
...(ngDevMode ? [{ debugName: "startDayHour" }] : /* istanbul ignore next */ []));
|
|
4063
|
+
this.showCurrentTimeIndicator = input(true, /* @ts-ignore */
|
|
4064
|
+
...(ngDevMode ? [{ debugName: "showCurrentTimeIndicator" }] : /* istanbul ignore next */ []));
|
|
4065
|
+
this.scrollToCurrentTimeIndicator = input(false, /* @ts-ignore */
|
|
4066
|
+
...(ngDevMode ? [{ debugName: "scrollToCurrentTimeIndicator" }] : /* istanbul ignore next */ []));
|
|
4067
|
+
this.appointments = input([], /* @ts-ignore */
|
|
4068
|
+
...(ngDevMode ? [{ debugName: "appointments" }] : /* istanbul ignore next */ []));
|
|
4069
|
+
this.tooltipTemplate = input(/* @ts-ignore */
|
|
4070
|
+
...(ngDevMode ? [undefined, { debugName: "tooltipTemplate" }] : /* istanbul ignore next */ []));
|
|
4071
|
+
this.selectedAppointmentId = input(null, /* @ts-ignore */
|
|
4072
|
+
...(ngDevMode ? [{ debugName: "selectedAppointmentId" }] : /* istanbul ignore next */ []));
|
|
3905
4073
|
// ViewChild for current time line element
|
|
3906
|
-
this.currentTimeLineElement = viewChild('currentTimeLine',
|
|
4074
|
+
this.currentTimeLineElement = viewChild('currentTimeLine', /* @ts-ignore */
|
|
4075
|
+
...(ngDevMode ? [{ debugName: "currentTimeLineElement" }] : /* istanbul ignore next */ []));
|
|
3907
4076
|
// --- Component Outputs (Internal, to be caught by the main scheduler) ---
|
|
3908
4077
|
this.slotClickedInternal = output();
|
|
3909
4078
|
this.slotDblClickedInternal = output();
|
|
@@ -3934,7 +4103,8 @@ class AXSchedulerWeekViewComponent extends NXComponent {
|
|
|
3934
4103
|
hours.push(time);
|
|
3935
4104
|
}
|
|
3936
4105
|
return hours;
|
|
3937
|
-
},
|
|
4106
|
+
}, /* @ts-ignore */
|
|
4107
|
+
...(ngDevMode ? [{ debugName: "hoursArray" }] : /* istanbul ignore next */ []));
|
|
3938
4108
|
/**
|
|
3939
4109
|
* @protected
|
|
3940
4110
|
* Generates an array of day data objects for the 7 days in the view, including holiday info.
|
|
@@ -3950,7 +4120,8 @@ class AXSchedulerWeekViewComponent extends NXComponent {
|
|
|
3950
4120
|
days.push({ date, holiday: this.isHoliday(date) });
|
|
3951
4121
|
}
|
|
3952
4122
|
return days;
|
|
3953
|
-
},
|
|
4123
|
+
}, /* @ts-ignore */
|
|
4124
|
+
...(ngDevMode ? [{ debugName: "daysArray" }] : /* istanbul ignore next */ []));
|
|
3954
4125
|
/**
|
|
3955
4126
|
* @protected
|
|
3956
4127
|
* Calculates the total number of 30-minute blocks within the visible hours of a single day.
|
|
@@ -3959,7 +4130,8 @@ class AXSchedulerWeekViewComponent extends NXComponent {
|
|
|
3959
4130
|
const startH = this.startDayHour();
|
|
3960
4131
|
const endH = this.endDayHour();
|
|
3961
4132
|
return Math.max(0, (endH - startH) * (60 / 30));
|
|
3962
|
-
},
|
|
4133
|
+
}, /* @ts-ignore */
|
|
4134
|
+
...(ngDevMode ? [{ debugName: "totalBlocksPerViewDay" }] : /* istanbul ignore next */ []));
|
|
3963
4135
|
// Calculate spanning appointments with their grid positions for the all-day header
|
|
3964
4136
|
this.spanningAppointments = computed(() => {
|
|
3965
4137
|
const daysInWeek = this.daysArray();
|
|
@@ -4053,19 +4225,22 @@ class AXSchedulerWeekViewComponent extends NXComponent {
|
|
|
4053
4225
|
});
|
|
4054
4226
|
}
|
|
4055
4227
|
return spanningResult;
|
|
4056
|
-
},
|
|
4228
|
+
}, /* @ts-ignore */
|
|
4229
|
+
...(ngDevMode ? [{ debugName: "spanningAppointments" }] : /* istanbul ignore next */ []));
|
|
4057
4230
|
// Get the set of multi-day/all-day appointment IDs for exclusion from regular all-day rendering
|
|
4058
4231
|
this.multiDayAppointmentIds = computed(() => {
|
|
4059
4232
|
const spanning = this.spanningAppointments();
|
|
4060
4233
|
return new Set(spanning.map((s) => s.appointment.id));
|
|
4061
|
-
},
|
|
4234
|
+
}, /* @ts-ignore */
|
|
4235
|
+
...(ngDevMode ? [{ debugName: "multiDayAppointmentIds" }] : /* istanbul ignore next */ []));
|
|
4062
4236
|
// Calculate the maximum row index to determine header height
|
|
4063
4237
|
this.maxSpanningRowIndex = computed(() => {
|
|
4064
4238
|
const spanning = this.spanningAppointments();
|
|
4065
4239
|
if (spanning.length === 0)
|
|
4066
4240
|
return -1;
|
|
4067
4241
|
return Math.max(...spanning.map((s) => s.rowIndex));
|
|
4068
|
-
},
|
|
4242
|
+
}, /* @ts-ignore */
|
|
4243
|
+
...(ngDevMode ? [{ debugName: "maxSpanningRowIndex" }] : /* istanbul ignore next */ []));
|
|
4069
4244
|
/**
|
|
4070
4245
|
* @protected
|
|
4071
4246
|
* Filters processed segments to get only single-day all-day appointments for the all-day header.
|
|
@@ -4084,7 +4259,8 @@ class AXSchedulerWeekViewComponent extends NXComponent {
|
|
|
4084
4259
|
appointments: orderBy(appointmentsForThisDay, ['originalStartDate', 'title'], ['asc', 'asc']),
|
|
4085
4260
|
};
|
|
4086
4261
|
});
|
|
4087
|
-
},
|
|
4262
|
+
}, /* @ts-ignore */
|
|
4263
|
+
...(ngDevMode ? [{ debugName: "allDayAppointmentsPerDay" }] : /* istanbul ignore next */ []));
|
|
4088
4264
|
// =================================================================================================
|
|
4089
4265
|
//
|
|
4090
4266
|
// GRID LAYOUT & BADGE LOGIC (THE CORE FIX)
|
|
@@ -4138,7 +4314,8 @@ class AXSchedulerWeekViewComponent extends NXComponent {
|
|
|
4138
4314
|
layoutsByDay.set(dayIndex, dayLayouts);
|
|
4139
4315
|
}
|
|
4140
4316
|
return layoutsByDay;
|
|
4141
|
-
},
|
|
4317
|
+
}, /* @ts-ignore */
|
|
4318
|
+
...(ngDevMode ? [{ debugName: "dayViewLayoutsByDay" }] : /* istanbul ignore next */ []));
|
|
4142
4319
|
/**
|
|
4143
4320
|
* @protected
|
|
4144
4321
|
* [STEP 2] From the full layout, select ONLY appointments in the first column (`columnIndex: 0`)
|
|
@@ -4177,7 +4354,8 @@ class AXSchedulerWeekViewComponent extends NXComponent {
|
|
|
4177
4354
|
});
|
|
4178
4355
|
}
|
|
4179
4356
|
return finalLayouts;
|
|
4180
|
-
},
|
|
4357
|
+
}, /* @ts-ignore */
|
|
4358
|
+
...(ngDevMode ? [{ debugName: "visibleAppointmentsLayout" }] : /* istanbul ignore next */ []));
|
|
4181
4359
|
/**
|
|
4182
4360
|
* @protected
|
|
4183
4361
|
* [STEP 3] Create badges for all appointments NOT in the first column (`columnIndex > 0`).
|
|
@@ -4221,7 +4399,8 @@ class AXSchedulerWeekViewComponent extends NXComponent {
|
|
|
4221
4399
|
});
|
|
4222
4400
|
});
|
|
4223
4401
|
return badgesInfo;
|
|
4224
|
-
},
|
|
4402
|
+
}, /* @ts-ignore */
|
|
4403
|
+
...(ngDevMode ? [{ debugName: "overflowBadgesWithData" }] : /* istanbul ignore next */ []));
|
|
4225
4404
|
// =================================================================================================
|
|
4226
4405
|
//
|
|
4227
4406
|
// EVENT HANDLERS & UTILITY METHODS
|
|
@@ -4262,10 +4441,12 @@ class AXSchedulerWeekViewComponent extends NXComponent {
|
|
|
4262
4441
|
uniqueSegmentsMap.set(mapKey, seg);
|
|
4263
4442
|
});
|
|
4264
4443
|
return Array.from(uniqueSegmentsMap.values());
|
|
4265
|
-
},
|
|
4444
|
+
}, /* @ts-ignore */
|
|
4445
|
+
...(ngDevMode ? [{ debugName: "processedAppointmentsForLayout" }] : /* istanbul ignore next */ []));
|
|
4266
4446
|
this.timedGridSegments = computed(() => {
|
|
4267
4447
|
return this.processedAppointmentsForLayout()?.filter((segment) => !segment.allDay) ?? [];
|
|
4268
|
-
},
|
|
4448
|
+
}, /* @ts-ignore */
|
|
4449
|
+
...(ngDevMode ? [{ debugName: "timedGridSegments" }] : /* istanbul ignore next */ []));
|
|
4269
4450
|
}
|
|
4270
4451
|
isActive(appointmentId) {
|
|
4271
4452
|
return this.selectedAppointmentId() === appointmentId;
|
|
@@ -4519,12 +4700,12 @@ class AXSchedulerWeekViewComponent extends NXComponent {
|
|
|
4519
4700
|
}
|
|
4520
4701
|
return true;
|
|
4521
4702
|
}
|
|
4522
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
4523
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXSchedulerWeekViewComponent, isStandalone: true, selector: "ax-scheduler-week-view", inputs: { readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, draggable: { classPropertyName: "draggable", publicName: "draggable", isSignal: true, isRequired: false, transformFunction: null }, hasActions: { classPropertyName: "hasActions", publicName: "hasActions", isSignal: true, isRequired: false, transformFunction: null }, dragStartDelay: { classPropertyName: "dragStartDelay", publicName: "dragStartDelay", isSignal: true, isRequired: false, transformFunction: null }, calendar: { classPropertyName: "calendar", publicName: "calendar", isSignal: true, isRequired: false, transformFunction: null }, date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: true, transformFunction: null }, endDayHour: { classPropertyName: "endDayHour", publicName: "endDayHour", isSignal: true, isRequired: true, transformFunction: null }, startDayHour: { classPropertyName: "startDayHour", publicName: "startDayHour", isSignal: true, isRequired: true, transformFunction: null }, showCurrentTimeIndicator: { classPropertyName: "showCurrentTimeIndicator", publicName: "showCurrentTimeIndicator", isSignal: true, isRequired: false, transformFunction: null }, scrollToCurrentTimeIndicator: { classPropertyName: "scrollToCurrentTimeIndicator", publicName: "scrollToCurrentTimeIndicator", isSignal: true, isRequired: false, transformFunction: null }, appointments: { classPropertyName: "appointments", publicName: "appointments", isSignal: true, isRequired: false, transformFunction: null }, tooltipTemplate: { classPropertyName: "tooltipTemplate", publicName: "tooltipTemplate", isSignal: true, isRequired: false, transformFunction: null }, selectedAppointmentId: { classPropertyName: "selectedAppointmentId", publicName: "selectedAppointmentId", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { slotClickedInternal: "slotClickedInternal", slotDblClickedInternal: "slotDblClickedInternal", slotRightClickedInternal: "slotRightClickedInternal", appointmentClickedInternal: "appointmentClickedInternal", appointmentDblClickedInternal: "appointmentDblClickedInternal", appointmentRightClickedInternal: "appointmentRightClickedInternal", onActionClickInternal: "onActionClickInternal", onAppointmentDropInternal: "onAppointmentDropInternal" }, host: { properties: { "class.ax-state-readonly": "readonly()" } }, providers: [{ provide: AXComponent, useExisting: AXSchedulerWeekViewComponent }], viewQueries: [{ propertyName: "currentTimeLineElement", first: true, predicate: ["currentTimeLine"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"ax-scheduler-week-header\">\n <div class=\"ax-scheduler-week-header-days\">\n <div class=\"ax-scheduler-week-header-table\"></div>\n <div class=\"ax-scheduler-week-header-date\" aria-hidden=\"true\">\n @for (day of daysArray(); track day.date.date.getTime()) {\n <div\n [class.ax-state-today]=\"isToday(day.date)\"\n class=\"ax-scheduler-week-header-date-day {{\n day.holiday.state !== 'none' ? (day.holiday.holiday?.cssClass ?? 'ax-state-holiday') : ''\n }}\"\n [style.--ax-scheduler-holiday-color]=\"day.holiday.holiday?.color ?? null\"\n >\n <span\n class=\"ax-scheduler-week-header-date-day-char ax-scheduler-truncate\"\n [axTooltip]=\"(day.holiday?.holiday?.description ?? day.holiday?.holiday?.title ?? '') | translate | async\"\n >\n {{ day.date | format: 'date' : { format: 'dddd', calendar: calendar() } | async }}\n @if (day.holiday.state === 'holiday' && day.holiday.holiday.title) {\n ( {{ day.holiday.holiday.title | translate | async }} )\n }\n </span>\n <span class=\"ax-scheduler-week-header-date-day-num\">\n {{ day.date | format: 'date' : { format: 'DD', calendar: calendar() } | async }}\n </span>\n </div>\n }\n </div>\n </div>\n <!-- All-day / Multi-day Spanning Appointments Header -->\n <div class=\"ax-scheduler-week-header-days ax-scheduler-week-allday-header\">\n <div class=\"ax-scheduler-week-header-table\">{{ '@acorex:dateTime.duration.all-day' | translate | async }}</div>\n <div class=\"ax-scheduler-week-allday-content\">\n <!-- Spanning Appointments Layer -->\n @if (spanningAppointments().length > 0) {\n <div class=\"ax-scheduler-week-spanning-layer\">\n @for (spanning of spanningAppointments(); track spanning.appointment.id) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragData]=\"spanning.appointment\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || spanning.appointment.readonly || readonly()\"\n (pointerdown)=\"getSlotId($event)\"\n (click)=\"handleAppointmentEvent($event, spanning.appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, spanning.appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, spanning.appointment)\"\n [title]=\"\n tooltipTemplate()\n ? ''\n : spanning.appointment.title +\n ' (' +\n (spanning.appointment.startDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async) +\n ' - ' +\n (spanning.appointment.endDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async) +\n ')'\n \"\n class=\"ax-scheduler-week-spanning-appointment\"\n [class.ax-spanning-start-clipped]=\"spanning.isStartClipped\"\n [class.ax-spanning-end-clipped]=\"spanning.isEndClipped\"\n [class.ax-state-active]=\"isActive(spanning.appointment.id)\"\n [class]=\"\n spanning.appointment.cssClass ??\n 'ax-scheduler-' + (spanning.appointment.priority ?? 'primary') + '-priority'\n \"\n [style.grid-column]=\"spanning.startDayIndex + 1 + ' / span ' + spanning.spanCount\"\n [style.--spanning-row-index]=\"spanning.rowIndex\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltip]=\"tooltipTemplate()\"\n [axTooltipContext]=\"spanning.appointment\"\n >\n <span class=\"ax-spanning-appointment-title\">\n <span class=\"ax-scheduler-truncate\">{{ spanning.appointment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, spanning.appointment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n ></ax-icon>\n }\n </span>\n </div>\n }\n </div>\n }\n <!-- Drop zones for each day -->\n <div class=\"ax-scheduler-week-allday-slots\">\n @for (slotData of allDayAppointmentsPerDay(); track slotData.day.date.getTime()) {\n <div\n axDropZone\n #zone2=\"axDropZone\"\n [class.ax-scheduler-slot-hovered]=\"zone2.isHovered()\"\n (onElementDrop)=\"handleAllDayDrop($event, slotData.day)\"\n class=\"ax-scheduler-all-day-slot\"\n (click)=\"handleAllDaySlotEvent($event, slotData.day)\"\n (dblclick)=\"handleAllDaySlotEvent($event, slotData.day)\"\n (contextmenu)=\"handleAllDaySlotEvent($event, slotData.day)\"\n >\n <!-- Single-day all-day appointments only -->\n @if (slotData.appointments.length > 0) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragData]=\"slotData.appointments[0]\"\n [dragDisabled]=\"!draggable() || slotData.appointments[0].readonly || readonly()\"\n (pointerdown)=\"getSlotId($event)\"\n (click)=\"handleAppointmentEvent($event, slotData.appointments[0])\"\n (dblclick)=\"handleAppointmentEvent($event, slotData.appointments[0])\"\n (contextmenu)=\"handleAppointmentEvent($event, slotData.appointments[0])\"\n [title]=\"tooltipTemplate() ? '' : slotData.appointments[0].title\"\n class=\"ax-scheduler-header-week-appointment\"\n [style.width]=\"slotData.appointments.length > 1 ? 'calc(100% - 2rem)' : '100%'\"\n [class.ax-state-active]=\"isActive(slotData.appointments[0].id)\"\n [class]=\"\n slotData.appointments[0].cssClass ??\n 'ax-scheduler-' + (slotData.appointments[0].priority ?? 'primary') + '-priority'\n \"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltipContext]=\"slotData.appointments[0]\"\n [axTooltip]=\"tooltipTemplate()\"\n >\n <ax-title>\n <span class=\"ax-scheduler-truncate\">{{ slotData.appointments[0].title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, slotData.appointments[0])\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n ></ax-icon>\n }\n </ax-title>\n </div>\n }\n @if (slotData.appointments.length > 1) {\n <div\n #moreAppointments\n class=\"ax-scheduler-appointment-badge\"\n [style.width]=\"'1.5rem'\"\n [style.border]=\"'none'\"\n [class]=\"\n slotData.appointments[1].cssClass ??\n 'ax-scheduler-' + (slotData.appointments[1].priority ?? 'primary') + '-priority'\n \"\n >\n +{{ slotData.appointments.length - 1 }}\n </div>\n <ax-popover [target]=\"moreAppointments\">\n <div class=\"ax-scheduler-popover\" [class.ax-state-readonly]=\"readonly()\" axDropZone>\n @for (appointment of slotData.appointments; track appointment.id; let first = $first) {\n @if (!first) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragData]=\"appointment\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || appointment.readonly || readonly()\"\n (click)=\"handleAppointmentEvent($event, appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, appointment)\"\n [title]=\"tooltipTemplate() ? '' : appointment.title\"\n class=\"ax-scheduler-popover-appointment\"\n [class.ax-state-active]=\"isActive(appointment.id)\"\n [class]=\"\n appointment.cssClass ?? 'ax-scheduler-' + (appointment.priority ?? 'primary') + '-priority'\n \"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltipContext]=\"appointment\"\n [axTooltip]=\"tooltipTemplate()\"\n >\n <ax-title>\n <span class=\"ax-scheduler-truncate\">{{ appointment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, appointment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n ></ax-icon>\n }\n </ax-title>\n </div>\n }\n }\n </div>\n </ax-popover>\n }\n </div>\n }\n </div>\n </div>\n </div>\n</div>\n\n<div class=\"ax-scheduler-week-time-container\">\n <div class=\"ax-scheduler-week-time\" aria-hidden=\"true\">\n @for (time of hoursArray(); track time.date.getTime()) {\n <div>\n {{ time | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}\n </div>\n }\n </div>\n\n <div class=\"ax-scheduler-week-table-container\">\n <!-- Current Time Line Indicator -->\n @if (\n shouldShowCurrentTimeForToday() &&\n getCurrentTimePositionWithOffset() !== null &&\n getCurrentDayColumnPosition() !== null\n ) {\n <div\n #currentTimeLine\n class=\"ax-scheduler-current-time-line\"\n [style.inset-block-start]=\"getCurrentTimePositionWithOffset()\"\n [style.inset-inline-start]=\"getCurrentDayColumnPosition()\"\n [style.width]=\"getCurrentDayColumnWidth()\"\n ></div>\n }\n <div class=\"ax-scheduler-week-appointment-container\">\n @for (appt of visibleAppointmentsLayout(); track appt.appointment.id) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragData]=\"appt.appointment\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || appt.appointment.readonly || readonly()\"\n (pointerdown)=\"getSlotId($event)\"\n (click)=\"handleAppointmentEvent($event, appt.appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, appt.appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, appt.appointment)\"\n [title]=\"tooltipTemplate() ? '' : appt.appointment.title\"\n [style.width]=\"appt.layoutWidth\"\n [style.height]=\"appt.layoutHeight\"\n class=\"ax-scheduler-week-appointment\"\n [style.inset-block-start]=\"appt.layoutTop\"\n [style.inset-inline-start]=\"appt.layoutLeft\"\n [class.ax-state-active]=\"isActive(appt.appointment.id)\"\n [class]=\"\n appt.appointment.cssClass ?? 'ax-scheduler-' + (appt.appointment.priority ?? 'primary') + '-priority'\n \"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltipContext]=\"appt.appointment\"\n [axTooltip]=\"tooltipTemplate()\"\n >\n <ax-title>\n <span class=\"ax-scheduler-truncate\">{{ appt.appointment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, appt.appointment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n ></ax-icon>\n }\n </ax-title>\n <ax-subtitle>\n {{\n appt.appointment.originalStartDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async\n }}\n -\n {{ appt.appointment.originalEndDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}\n </ax-subtitle>\n </div>\n }\n\n <!-- Overflow Badges with Popovers -->\n @for (badge of overflowBadgesWithData(); track badge.key) {\n <!-- Wrap badge and popover for targeting -->\n <div\n style=\"position: absolute\"\n class=\"ax-scheduler-badge-wrapper\"\n [style.inset-block-start]=\"badge.badgeTop\"\n [style.inset-inline-start]=\"badge.badgeLeft\"\n >\n <!-- The Badge itself -->\n <div\n #actionButton\n class=\"ax-scheduler-appointment-badge\"\n [class]=\"\n badge.hiddenAppointments[0].cssClass ??\n 'ax-scheduler-' + (badge.hiddenAppointments[0].priority ?? 'primary') + '-priority'\n \"\n >\n +{{ badge.count }}\n </div>\n <!-- The Popover -->\n <ax-popover [target]=\"actionButton\">\n <div class=\"ax-scheduler-popover\" axDropZone>\n @for (appointment of badge.hiddenAppointments; track appointment.id) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragData]=\"appointment\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || appointment.readonly || readonly()\"\n (click)=\"handleAppointmentEvent($event, appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, appointment)\"\n [title]=\"tooltipTemplate() ? '' : appointment.title\"\n class=\"ax-scheduler-popover-appointment\"\n [class.ax-state-active]=\"isActive(appointment.id)\"\n [class]=\"appointment.cssClass ?? 'ax-scheduler-' + (appointment.priority ?? 'primary') + '-priority'\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltipContext]=\"appointment\"\n [axTooltip]=\"tooltipTemplate()\"\n >\n <ax-title>\n <span class=\"ax-scheduler-truncate\">{{ appointment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, appointment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n ></ax-icon>\n }\n </ax-title>\n <ax-subtitle>\n {{\n appointment.originalStartDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async\n }}\n -\n {{\n appointment.originalEndDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async\n }}\n </ax-subtitle>\n </div>\n }\n </div>\n </ax-popover>\n </div>\n }\n </div>\n\n <table aria-hidden=\"true\" [border]=\"1\">\n <tbody>\n @for (time of hoursArray(); track time.date.getTime()) {\n <tr>\n @for (day of daysArray(); track day.date.date.getTime()) {\n <td\n axDropZone\n #zone=\"axDropZone\"\n [class.ax-scheduler-slot-hovered]=\"zone.isHovered()\"\n (onElementDrop)=\"handleSingleDayDrop($event, time, day.date, 0)\"\n (click)=\"handleSingleSlotEvent($event, time, day.date, 0)\"\n (dblclick)=\"handleSingleSlotEvent($event, time, day.date, 0)\"\n (contextmenu)=\"handleSingleSlotEvent($event, time, day.date, 0)\"\n [attr.data-slot-id]=\"day.date.format('YYYYMMDD') + '-' + time.format('HHmm')\"\n ></td>\n }\n </tr>\n <tr>\n @for (day of daysArray(); track day.date.date.getTime()) {\n <td\n axDropZone\n #zone2=\"axDropZone\"\n [class.ax-scheduler-slot-hovered]=\"zone2.isHovered()\"\n (onElementDrop)=\"handleSingleDayDrop($event, time, day.date, 1)\"\n (click)=\"handleSingleSlotEvent($event, time, day.date, 1)\"\n (dblclick)=\"handleSingleSlotEvent($event, time, day.date, 1)\"\n (contextmenu)=\"handleSingleSlotEvent($event, time, day.date, 1)\"\n [attr.data-slot-id]=\"day.date.format('YYYYMMDD') + '-' + time.add('minute', 30).format('HHmm')\"\n ></td>\n }\n </tr>\n }\n </tbody>\n </table>\n </div>\n</div>\n", styles: ["@layer properties;@layer components{ax-scheduler-week-view{--ax-scheduler-week-spanning-row-height: 1.5rem;--ax-scheduler-week-spanning-gap: .125rem;--ax-scheduler-week-spanning-row-gap: .25rem;position:relative;display:block;min-width:var(--ax-comp-scheduler-width);background-color:inherit}ax-scheduler-week-view .ax-scheduler-appointment-badge{display:flex;width:calc(var(--spacing, .25rem) * 6);height:calc(var(--spacing, .25rem) * 6);cursor:pointer;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}ax-scheduler-week-view .ax-scheduler-week-header{position:sticky;top:calc(var(--spacing, .25rem) * 0);z-index:20;width:100%;background-color:var(--ax-comp-scheduler-all-day-bg,inherit)}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days{display:flex;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-table{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 0);z-index:10;width:var(--ax-comp-scheduler-basic-view-blocks-width);flex-shrink:0;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit;text-align:center}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date{display:flex;width:calc(100% - var(--ax-comp-scheduler-basic-view-blocks-width))}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date div{width:100%;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));text-align:center}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date div.ax-scheduler-week-header-date-day{display:grid;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 1);padding-inline:calc(var(--spacing, .25rem) * 2)}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date div.ax-scheduler-week-header-date-day.ax-state-today{background-color:rgba(var(--ax-sys-color-primary-surface));color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date div.ax-scheduler-week-header-date-day.ax-state-today{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 5%,transparent)}}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date div.ax-scheduler-week-header-date-day.ax-state-today .ax-scheduler-week-header-date-day-char{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date div.ax-scheduler-week-header-date-day.ax-state-today .ax-scheduler-week-header-date-day-num{--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700)}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date div.ax-scheduler-week-header-date-day.ax-state-holiday{color:var(--ax-scheduler-holiday-color, rgba(var(--ax-sys-color-danger-surface)))}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date div.ax-scheduler-week-header-date-day.ax-state-holiday.ax-state-today{color:rgba(var(--ax-sys-color-primary-surface))}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date div.ax-scheduler-week-header-date-day .ax-scheduler-week-header-date-day-char{max-width:100%;--tw-font-weight: var(--font-weight-light, 300);font-weight:var(--font-weight-light, 300)}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date div.ax-scheduler-week-header-date-day .ax-scheduler-week-header-date-day-num{font-size:var(--text-xl, 1.25rem);line-height:var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date div:last-child{border-inline-end-style:var(--tw-border-style);border-inline-end-width:0px}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date .ax-scheduler-all-day-slot{display:flex;width:calc(100% / 7);gap:calc(var(--spacing, .25rem) * 1)}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date .ax-scheduler-all-day-slot .ax-scheduler-header-week-appointment{display:block;width:100%;overflow:hidden;border-radius:calc(var(--ax-sys-border-radius) / 2);padding-inline:calc(var(--spacing, .25rem) * 2);text-align:start}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date .ax-scheduler-all-day-slot ax-popover{display:none}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days.ax-scheduler-week-allday-header .ax-scheduler-week-allday-content{position:relative;display:flex;width:calc(100% - var(--ax-comp-scheduler-basic-view-blocks-width));flex-direction:column}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days.ax-scheduler-week-allday-header .ax-scheduler-week-allday-content .ax-scheduler-week-spanning-layer{position:relative;display:grid;align-content:flex-start;padding-block:calc(var(--spacing, .25rem) * 1);grid-template-columns:repeat(7,1fr);row-gap:var(--ax-scheduler-week-spanning-row-gap)}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days.ax-scheduler-week-allday-header .ax-scheduler-week-allday-content .ax-scheduler-week-spanning-layer:before{content:\"\";pointer-events:none;position:absolute;inset:calc(var(--spacing, .25rem) * 0);z-index:0;background:linear-gradient(to right,transparent calc(100% / 7 * 1 - .5px),rgba(var(--ax-sys-color-border-lightest-surface)) calc(100% / 7 * 1 - .5px),rgba(var(--ax-sys-color-border-lightest-surface)) calc(100% / 7 * 1 + .5px),transparent calc(100% / 7 * 1 + .5px),transparent calc(100% / 7 * 2 - .5px),rgba(var(--ax-sys-color-border-lightest-surface)) calc(100% / 7 * 2 - .5px),rgba(var(--ax-sys-color-border-lightest-surface)) calc(100% / 7 * 2 + .5px),transparent calc(100% / 7 * 2 + .5px),transparent calc(100% / 7 * 3 - .5px),rgba(var(--ax-sys-color-border-lightest-surface)) calc(100% / 7 * 3 - .5px),rgba(var(--ax-sys-color-border-lightest-surface)) calc(100% / 7 * 3 + .5px),transparent calc(100% / 7 * 3 + .5px),transparent calc(100% / 7 * 4 - .5px),rgba(var(--ax-sys-color-border-lightest-surface)) calc(100% / 7 * 4 - .5px),rgba(var(--ax-sys-color-border-lightest-surface)) calc(100% / 7 * 4 + .5px),transparent calc(100% / 7 * 4 + .5px),transparent calc(100% / 7 * 5 - .5px),rgba(var(--ax-sys-color-border-lightest-surface)) calc(100% / 7 * 5 - .5px),rgba(var(--ax-sys-color-border-lightest-surface)) calc(100% / 7 * 5 + .5px),transparent calc(100% / 7 * 5 + .5px),transparent calc(100% / 7 * 6 - .5px),rgba(var(--ax-sys-color-border-lightest-surface)) calc(100% / 7 * 6 - .5px),rgba(var(--ax-sys-color-border-lightest-surface)) calc(100% / 7 * 6 + .5px),transparent calc(100% / 7 * 6 + .5px))}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days.ax-scheduler-week-allday-header .ax-scheduler-week-allday-content .ax-scheduler-week-spanning-layer .ax-scheduler-week-spanning-appointment{z-index:1;display:flex;cursor:pointer;align-items:center;overflow:hidden;text-overflow:ellipsis;border-radius:var(--radius-sm, .25rem);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * .5);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));white-space:nowrap;height:var(--ax-scheduler-week-spanning-row-height);margin-inline:.125rem}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days.ax-scheduler-week-allday-header .ax-scheduler-week-allday-content .ax-scheduler-week-spanning-layer .ax-scheduler-week-spanning-appointment .ax-spanning-appointment-title{display:flex;width:100%;align-items:center;justify-content:space-between}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days.ax-scheduler-week-allday-header .ax-scheduler-week-allday-content .ax-scheduler-week-spanning-layer .ax-scheduler-week-spanning-appointment .ax-spanning-appointment-title .ax-scheduler-truncate{min-width:calc(var(--spacing, .25rem) * 0);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days.ax-scheduler-week-allday-header .ax-scheduler-week-allday-content .ax-scheduler-week-spanning-layer .ax-scheduler-week-spanning-appointment .ax-spanning-appointment-title .ax-scheduler-action-icon{margin-inline-start:calc(var(--spacing, .25rem) * 1);width:auto;flex-shrink:0;cursor:pointer}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days.ax-scheduler-week-allday-header .ax-scheduler-week-allday-content .ax-scheduler-week-spanning-layer .ax-scheduler-week-spanning-appointment.ax-spanning-start-clipped{position:relative;border-start-start-radius:0;border-end-start-radius:0;margin-inline-start:0;padding-inline-start:1rem}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days.ax-scheduler-week-allday-header .ax-scheduler-week-allday-content .ax-scheduler-week-spanning-layer .ax-scheduler-week-spanning-appointment.ax-spanning-start-clipped:before{content:\"\\2190 \";position:absolute;top:50%;--tw-translate-y: -50% ;translate:var(--tw-translate-x) var(--tw-translate-y);font-size:.65rem;opacity:70%;inset-inline-start:.25rem}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days.ax-scheduler-week-allday-header .ax-scheduler-week-allday-content .ax-scheduler-week-spanning-layer .ax-scheduler-week-spanning-appointment.ax-spanning-end-clipped{position:relative;border-start-end-radius:0;border-end-end-radius:0;margin-inline-end:0;padding-inline-end:1rem}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days.ax-scheduler-week-allday-header .ax-scheduler-week-allday-content .ax-scheduler-week-spanning-layer .ax-scheduler-week-spanning-appointment.ax-spanning-end-clipped:after{content:\" \\2192\";position:absolute;top:50%;--tw-translate-y: -50% ;translate:var(--tw-translate-x) var(--tw-translate-y);font-size:.65rem;opacity:70%;inset-inline-end:.25rem}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days.ax-scheduler-week-allday-header .ax-scheduler-week-allday-content .ax-scheduler-week-allday-slots{display:flex;height:100%}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days.ax-scheduler-week-allday-header .ax-scheduler-week-allday-content .ax-scheduler-week-allday-slots .ax-scheduler-all-day-slot{display:flex;width:calc(100% / 7);gap:calc(var(--spacing, .25rem) * 1);border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));padding-block:calc(var(--spacing, .25rem) * 1)}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days.ax-scheduler-week-allday-header .ax-scheduler-week-allday-content .ax-scheduler-week-allday-slots .ax-scheduler-all-day-slot:last-child{border-inline-end-style:var(--tw-border-style);border-inline-end-width:0px}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days.ax-scheduler-week-allday-header .ax-scheduler-week-allday-content .ax-scheduler-week-allday-slots .ax-scheduler-all-day-slot .ax-scheduler-header-week-appointment{display:block;width:100%;overflow:hidden;border-radius:calc(var(--ax-sys-border-radius) / 2);padding-inline:calc(var(--spacing, .25rem) * 2);text-align:start}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days.ax-scheduler-week-allday-header .ax-scheduler-week-allday-content .ax-scheduler-week-allday-slots .ax-scheduler-all-day-slot ax-popover{display:none}ax-scheduler-week-view .ax-scheduler-week-time-container{display:flex;width:100%;background-color:inherit}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-time{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 0);z-index:15;background-color:var(--ax-comp-scheduler-all-day-bg,inherit)}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-time div{position:relative;display:block;height:calc(var(--ax-comp-scheduler-basic-view-blocks-height) * 2);width:var(--ax-comp-scheduler-basic-view-blocks-width);border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 2);text-align:center}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-table-container{position:relative;width:100%}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-table-container .ax-scheduler-week-appointment-container{position:absolute;top:calc(var(--spacing, .25rem) * 0);width:100%}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-table-container .ax-scheduler-week-appointment-container .ax-scheduler-week-appointment{position:absolute;inset-inline-start:calc(var(--spacing, .25rem) * 0);display:flex;flex-direction:column;border-radius:calc(var(--ax-sys-border-radius) / 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1)}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-table-container table{width:100%}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-table-container table tr{display:flex;height:var(--ax-comp-scheduler-basic-view-blocks-height);border-top-style:var(--tw-border-style);border-top-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-table-container table tr:first-child{border-top-style:var(--tw-border-style);border-top-width:0px}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-table-container table tr td{width:100%;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));text-align:center}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-table-container table tr td:last-child{border-inline-end-style:var(--tw-border-style);border-inline-end-width:0px}ax-scheduler-week-view:not(.ax-state-readonly) .ax-scheduler-week-appointment,ax-scheduler-week-view:not(.ax-state-readonly) .ax-scheduler-header-week-appointment{cursor:pointer}ax-scheduler-week-view:not(.ax-state-readonly) .ax-scheduler-all-day-slot,ax-scheduler-week-view:not(.ax-state-readonly) .ax-scheduler-week-table-container>table td{cursor:pointer;transition-property:background-color;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));transition-duration:var(--ax-sys-transition-duration);transition-timing-function:var(--ax-sys-transition-timing-function)}:is(ax-scheduler-week-view:not(.ax-state-readonly) .ax-scheduler-all-day-slot,ax-scheduler-week-view:not(.ax-state-readonly) .ax-scheduler-week-table-container>table td):hover{background-color:rgba(var(--ax-comp-scheduler-slot-hover-bg,var(--ax-sys-color-primary-surface),.1))}ax-scheduler-week-view ax-title{display:flex;justify-content:space-between}ax-scheduler-week-view ax-title .ax-scheduler-action-icon{width:auto;cursor:pointer}ax-scheduler-week-view .ax-scheduler-current-time-line{height:calc(var(--spacing, .25rem) * .5)}ax-scheduler-week-view .ax-scheduler-current-time-line:before{content:var(--tw-content);inset-inline-start:-6px}ax-scheduler-week-view .ax-scheduler-current-time-line:before{content:var(--tw-content);top:-5px}ax-scheduler.ax-rtl ax-scheduler-week-view .ax-scheduler-week-spanning-appointment.ax-spanning-start-clipped:before{content:\"\\2192 \"}ax-scheduler.ax-rtl ax-scheduler-week-view .ax-scheduler-week-spanning-appointment.ax-spanning-end-clipped:after{content:\" \\2190\"}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-translate-x{syntax: \"*\"; inherits: false; initial-value: 0;}@property --tw-translate-y{syntax: \"*\"; inherits: false; initial-value: 0;}@property --tw-translate-z{syntax: \"*\"; inherits: false; initial-value: 0;}@property --tw-content{syntax: \"*\"; initial-value: \"\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial;--tw-translate-x: 0;--tw-translate-y: 0;--tw-translate-z: 0;--tw-content: \"\"}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: AXDragDirective, selector: "[axDrag]", inputs: ["axDrag", "dragData", "dragDisabled", "dragTransition", "dragElementClone", "dropZoneGroup", "dragStartDelay", "dragResetOnDblClick", "dragLockAxis", "dragClonedTemplate", "dragCursor", "dragBoundary", "dragTransitionDuration"], outputs: ["dragPositionChanged"] }, { kind: "component", type: AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disablePanelClass", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "closeOnScroll", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "directive", type: AXTooltipDirective, selector: "[axTooltip]", inputs: ["axTooltipDisabled", "axTooltip", "axTooltipContext", "axTooltipPlacement", "axTooltipOffsetX", "axTooltipOffsetY", "axTooltipOpenAfter", "axTooltipCloseAfter"] }, { kind: "directive", type: AXDropZoneDirective, selector: "[axDropZone]", inputs: ["dropZoneGroup"], outputs: ["onElementDrop", "onElementHover"], exportAs: ["axDropZone"] }, { kind: "component", type: AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXFormatPipe, name: "format" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
4703
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXSchedulerWeekViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
4704
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXSchedulerWeekViewComponent, isStandalone: true, selector: "ax-scheduler-week-view", inputs: { readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, draggable: { classPropertyName: "draggable", publicName: "draggable", isSignal: true, isRequired: false, transformFunction: null }, hasActions: { classPropertyName: "hasActions", publicName: "hasActions", isSignal: true, isRequired: false, transformFunction: null }, dragStartDelay: { classPropertyName: "dragStartDelay", publicName: "dragStartDelay", isSignal: true, isRequired: false, transformFunction: null }, calendar: { classPropertyName: "calendar", publicName: "calendar", isSignal: true, isRequired: false, transformFunction: null }, date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: true, transformFunction: null }, endDayHour: { classPropertyName: "endDayHour", publicName: "endDayHour", isSignal: true, isRequired: true, transformFunction: null }, startDayHour: { classPropertyName: "startDayHour", publicName: "startDayHour", isSignal: true, isRequired: true, transformFunction: null }, showCurrentTimeIndicator: { classPropertyName: "showCurrentTimeIndicator", publicName: "showCurrentTimeIndicator", isSignal: true, isRequired: false, transformFunction: null }, scrollToCurrentTimeIndicator: { classPropertyName: "scrollToCurrentTimeIndicator", publicName: "scrollToCurrentTimeIndicator", isSignal: true, isRequired: false, transformFunction: null }, appointments: { classPropertyName: "appointments", publicName: "appointments", isSignal: true, isRequired: false, transformFunction: null }, tooltipTemplate: { classPropertyName: "tooltipTemplate", publicName: "tooltipTemplate", isSignal: true, isRequired: false, transformFunction: null }, selectedAppointmentId: { classPropertyName: "selectedAppointmentId", publicName: "selectedAppointmentId", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { slotClickedInternal: "slotClickedInternal", slotDblClickedInternal: "slotDblClickedInternal", slotRightClickedInternal: "slotRightClickedInternal", appointmentClickedInternal: "appointmentClickedInternal", appointmentDblClickedInternal: "appointmentDblClickedInternal", appointmentRightClickedInternal: "appointmentRightClickedInternal", onActionClickInternal: "onActionClickInternal", onAppointmentDropInternal: "onAppointmentDropInternal" }, host: { properties: { "class.ax-state-readonly": "readonly()" } }, providers: [{ provide: AXComponent, useExisting: AXSchedulerWeekViewComponent }], viewQueries: [{ propertyName: "currentTimeLineElement", first: true, predicate: ["currentTimeLine"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"ax-scheduler-week-header\">\n <div class=\"ax-scheduler-week-header-days\">\n <div class=\"ax-scheduler-week-header-table\"></div>\n <div class=\"ax-scheduler-week-header-date\" aria-hidden=\"true\">\n @for (day of daysArray(); track day.date.date.getTime()) {\n <div\n [class.ax-state-today]=\"isToday(day.date)\"\n class=\"ax-scheduler-week-header-date-day {{\n day.holiday.state !== 'none' ? (day.holiday.holiday?.cssClass ?? 'ax-state-holiday') : ''\n }}\"\n [style.--ax-scheduler-holiday-color]=\"day.holiday.holiday?.color ?? null\"\n >\n <span\n class=\"ax-scheduler-week-header-date-day-char ax-scheduler-truncate\"\n [axTooltip]=\"(day.holiday?.holiday?.description ?? day.holiday?.holiday?.title ?? '') | translate | async\"\n >\n {{ day.date | format: 'date' : { format: 'dddd', calendar: calendar() } | async }}\n @if (day.holiday.state === 'holiday' && day.holiday.holiday.title) {\n ( {{ day.holiday.holiday.title | translate | async }} )\n }\n </span>\n <span class=\"ax-scheduler-week-header-date-day-num\">\n {{ day.date | format: 'date' : { format: 'DD', calendar: calendar() } | async }}\n </span>\n </div>\n }\n </div>\n </div>\n <!-- All-day / Multi-day Spanning Appointments Header -->\n <div class=\"ax-scheduler-week-header-days ax-scheduler-week-allday-header\">\n <div class=\"ax-scheduler-week-header-table\">{{ '@acorex:dateTime.duration.all-day' | translate | async }}</div>\n <div class=\"ax-scheduler-week-allday-content\">\n <!-- Spanning Appointments Layer -->\n @if (spanningAppointments().length > 0) {\n <div class=\"ax-scheduler-week-spanning-layer\">\n @for (spanning of spanningAppointments(); track spanning.appointment.id) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragData]=\"spanning.appointment\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || spanning.appointment.readonly || readonly()\"\n (pointerdown)=\"getSlotId($event)\"\n (click)=\"handleAppointmentEvent($event, spanning.appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, spanning.appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, spanning.appointment)\"\n [title]=\"\n tooltipTemplate()\n ? ''\n : spanning.appointment.title +\n ' (' +\n (spanning.appointment.startDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async) +\n ' - ' +\n (spanning.appointment.endDate\n | format: 'date' : { format: 'MMM d', calendar: calendar() }\n | async) +\n ')'\n \"\n class=\"ax-scheduler-week-spanning-appointment\"\n [class.ax-spanning-start-clipped]=\"spanning.isStartClipped\"\n [class.ax-spanning-end-clipped]=\"spanning.isEndClipped\"\n [class.ax-state-active]=\"isActive(spanning.appointment.id)\"\n [class]=\"\n spanning.appointment.cssClass ??\n 'ax-scheduler-' + (spanning.appointment.priority ?? 'primary') + '-priority'\n \"\n [style.grid-column]=\"spanning.startDayIndex + 1 + ' / span ' + spanning.spanCount\"\n [style.--spanning-row-index]=\"spanning.rowIndex\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltip]=\"tooltipTemplate()\"\n [axTooltipContext]=\"spanning.appointment\"\n >\n <span class=\"ax-spanning-appointment-title\">\n <span class=\"ax-scheduler-truncate\">{{ spanning.appointment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, spanning.appointment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n ></ax-icon>\n }\n </span>\n </div>\n }\n </div>\n }\n <!-- Drop zones for each day -->\n <div class=\"ax-scheduler-week-allday-slots\">\n @for (slotData of allDayAppointmentsPerDay(); track slotData.day.date.getTime()) {\n <div\n axDropZone\n #zone2=\"axDropZone\"\n [class.ax-scheduler-slot-hovered]=\"zone2.isHovered()\"\n (onElementDrop)=\"handleAllDayDrop($event, slotData.day)\"\n class=\"ax-scheduler-all-day-slot\"\n (click)=\"handleAllDaySlotEvent($event, slotData.day)\"\n (dblclick)=\"handleAllDaySlotEvent($event, slotData.day)\"\n (contextmenu)=\"handleAllDaySlotEvent($event, slotData.day)\"\n >\n <!-- Single-day all-day appointments only -->\n @if (slotData.appointments.length > 0) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragData]=\"slotData.appointments[0]\"\n [dragDisabled]=\"!draggable() || slotData.appointments[0].readonly || readonly()\"\n (pointerdown)=\"getSlotId($event)\"\n (click)=\"handleAppointmentEvent($event, slotData.appointments[0])\"\n (dblclick)=\"handleAppointmentEvent($event, slotData.appointments[0])\"\n (contextmenu)=\"handleAppointmentEvent($event, slotData.appointments[0])\"\n [title]=\"tooltipTemplate() ? '' : slotData.appointments[0].title\"\n class=\"ax-scheduler-header-week-appointment\"\n [style.width]=\"slotData.appointments.length > 1 ? 'calc(100% - 2rem)' : '100%'\"\n [class.ax-state-active]=\"isActive(slotData.appointments[0].id)\"\n [class]=\"\n slotData.appointments[0].cssClass ??\n 'ax-scheduler-' + (slotData.appointments[0].priority ?? 'primary') + '-priority'\n \"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltipContext]=\"slotData.appointments[0]\"\n [axTooltip]=\"tooltipTemplate()\"\n >\n <ax-title>\n <span class=\"ax-scheduler-truncate\">{{ slotData.appointments[0].title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, slotData.appointments[0])\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n ></ax-icon>\n }\n </ax-title>\n </div>\n }\n @if (slotData.appointments.length > 1) {\n <div\n #moreAppointments\n class=\"ax-scheduler-appointment-badge\"\n [style.width]=\"'1.5rem'\"\n [style.border]=\"'none'\"\n [class]=\"\n slotData.appointments[1].cssClass ??\n 'ax-scheduler-' + (slotData.appointments[1].priority ?? 'primary') + '-priority'\n \"\n >\n +{{ slotData.appointments.length - 1 }}\n </div>\n <ax-popover [target]=\"moreAppointments\">\n <div class=\"ax-scheduler-popover\" [class.ax-state-readonly]=\"readonly()\" axDropZone>\n @for (appointment of slotData.appointments; track appointment.id; let first = $first) {\n @if (!first) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragData]=\"appointment\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || appointment.readonly || readonly()\"\n (click)=\"handleAppointmentEvent($event, appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, appointment)\"\n [title]=\"tooltipTemplate() ? '' : appointment.title\"\n class=\"ax-scheduler-popover-appointment\"\n [class.ax-state-active]=\"isActive(appointment.id)\"\n [class]=\"\n appointment.cssClass ?? 'ax-scheduler-' + (appointment.priority ?? 'primary') + '-priority'\n \"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltipContext]=\"appointment\"\n [axTooltip]=\"tooltipTemplate()\"\n >\n <ax-title>\n <span class=\"ax-scheduler-truncate\">{{ appointment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, appointment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n ></ax-icon>\n }\n </ax-title>\n </div>\n }\n }\n </div>\n </ax-popover>\n }\n </div>\n }\n </div>\n </div>\n </div>\n</div>\n\n<div class=\"ax-scheduler-week-time-container\">\n <div class=\"ax-scheduler-week-time\" aria-hidden=\"true\">\n @for (time of hoursArray(); track time.date.getTime()) {\n <div>\n {{ time | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}\n </div>\n }\n </div>\n\n <div class=\"ax-scheduler-week-table-container\">\n <!-- Current Time Line Indicator -->\n @if (\n shouldShowCurrentTimeForToday() &&\n getCurrentTimePositionWithOffset() !== null &&\n getCurrentDayColumnPosition() !== null\n ) {\n <div\n #currentTimeLine\n class=\"ax-scheduler-current-time-line\"\n [style.inset-block-start]=\"getCurrentTimePositionWithOffset()\"\n [style.inset-inline-start]=\"getCurrentDayColumnPosition()\"\n [style.width]=\"getCurrentDayColumnWidth()\"\n ></div>\n }\n <div class=\"ax-scheduler-week-appointment-container\">\n @for (appt of visibleAppointmentsLayout(); track appt.appointment.id) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragData]=\"appt.appointment\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || appt.appointment.readonly || readonly()\"\n (pointerdown)=\"getSlotId($event)\"\n (click)=\"handleAppointmentEvent($event, appt.appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, appt.appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, appt.appointment)\"\n [title]=\"tooltipTemplate() ? '' : appt.appointment.title\"\n [style.width]=\"appt.layoutWidth\"\n [style.height]=\"appt.layoutHeight\"\n class=\"ax-scheduler-week-appointment\"\n [style.inset-block-start]=\"appt.layoutTop\"\n [style.inset-inline-start]=\"appt.layoutLeft\"\n [class.ax-state-active]=\"isActive(appt.appointment.id)\"\n [class]=\"\n appt.appointment.cssClass ?? 'ax-scheduler-' + (appt.appointment.priority ?? 'primary') + '-priority'\n \"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltipContext]=\"appt.appointment\"\n [axTooltip]=\"tooltipTemplate()\"\n >\n <ax-title>\n <span class=\"ax-scheduler-truncate\">{{ appt.appointment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, appt.appointment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n ></ax-icon>\n }\n </ax-title>\n <ax-subtitle>\n {{\n appt.appointment.originalStartDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async\n }}\n -\n {{ appt.appointment.originalEndDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}\n </ax-subtitle>\n </div>\n }\n\n <!-- Overflow Badges with Popovers -->\n @for (badge of overflowBadgesWithData(); track badge.key) {\n <!-- Wrap badge and popover for targeting -->\n <div\n style=\"position: absolute\"\n class=\"ax-scheduler-badge-wrapper\"\n [style.inset-block-start]=\"badge.badgeTop\"\n [style.inset-inline-start]=\"badge.badgeLeft\"\n >\n <!-- The Badge itself -->\n <div\n #actionButton\n class=\"ax-scheduler-appointment-badge\"\n [class]=\"\n badge.hiddenAppointments[0].cssClass ??\n 'ax-scheduler-' + (badge.hiddenAppointments[0].priority ?? 'primary') + '-priority'\n \"\n >\n +{{ badge.count }}\n </div>\n <!-- The Popover -->\n <ax-popover [target]=\"actionButton\">\n <div class=\"ax-scheduler-popover\" axDropZone>\n @for (appointment of badge.hiddenAppointments; track appointment.id) {\n <div\n axDrag\n [dragCursor]=\"'grab'\"\n [dragData]=\"appointment\"\n [dragTransition]=\"false\"\n [dragElementClone]=\"true\"\n [dragStartDelay]=\"dragStartDelay()\"\n [dragDisabled]=\"!draggable() || appointment.readonly || readonly()\"\n (click)=\"handleAppointmentEvent($event, appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, appointment)\"\n [title]=\"tooltipTemplate() ? '' : appointment.title\"\n class=\"ax-scheduler-popover-appointment\"\n [class.ax-state-active]=\"isActive(appointment.id)\"\n [class]=\"appointment.cssClass ?? 'ax-scheduler-' + (appointment.priority ?? 'primary') + '-priority'\"\n [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n [axTooltipContext]=\"appointment\"\n [axTooltip]=\"tooltipTemplate()\"\n >\n <ax-title>\n <span class=\"ax-scheduler-truncate\">{{ appointment.title }}</span>\n @if (hasActions()) {\n <ax-icon\n (click)=\"handleActionClick($event, appointment)\"\n class=\"ax-icon ax-icon-more-horizontal ax-scheduler-action-icon\"\n ></ax-icon>\n }\n </ax-title>\n <ax-subtitle>\n {{\n appointment.originalStartDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async\n }}\n -\n {{\n appointment.originalEndDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async\n }}\n </ax-subtitle>\n </div>\n }\n </div>\n </ax-popover>\n </div>\n }\n </div>\n\n <table aria-hidden=\"true\" [border]=\"1\">\n <tbody>\n @for (time of hoursArray(); track time.date.getTime()) {\n <tr>\n @for (day of daysArray(); track day.date.date.getTime()) {\n <td\n axDropZone\n #zone=\"axDropZone\"\n [class.ax-scheduler-slot-hovered]=\"zone.isHovered()\"\n (onElementDrop)=\"handleSingleDayDrop($event, time, day.date, 0)\"\n (click)=\"handleSingleSlotEvent($event, time, day.date, 0)\"\n (dblclick)=\"handleSingleSlotEvent($event, time, day.date, 0)\"\n (contextmenu)=\"handleSingleSlotEvent($event, time, day.date, 0)\"\n [attr.data-slot-id]=\"day.date.format('YYYYMMDD') + '-' + time.format('HHmm')\"\n ></td>\n }\n </tr>\n <tr>\n @for (day of daysArray(); track day.date.date.getTime()) {\n <td\n axDropZone\n #zone2=\"axDropZone\"\n [class.ax-scheduler-slot-hovered]=\"zone2.isHovered()\"\n (onElementDrop)=\"handleSingleDayDrop($event, time, day.date, 1)\"\n (click)=\"handleSingleSlotEvent($event, time, day.date, 1)\"\n (dblclick)=\"handleSingleSlotEvent($event, time, day.date, 1)\"\n (contextmenu)=\"handleSingleSlotEvent($event, time, day.date, 1)\"\n [attr.data-slot-id]=\"day.date.format('YYYYMMDD') + '-' + time.add('minute', 30).format('HHmm')\"\n ></td>\n }\n </tr>\n }\n </tbody>\n </table>\n </div>\n</div>\n", styles: ["@layer properties;@layer components{ax-scheduler-week-view{--ax-scheduler-week-spanning-row-height: 1.5rem;--ax-scheduler-week-spanning-gap: .125rem;--ax-scheduler-week-spanning-row-gap: .25rem;position:relative;display:block;min-width:var(--ax-comp-scheduler-width);background-color:inherit}ax-scheduler-week-view .ax-scheduler-appointment-badge{display:flex;width:calc(var(--spacing, .25rem) * 6);height:calc(var(--spacing, .25rem) * 6);cursor:pointer;align-items:center;justify-content:center;border-radius:calc(infinity * 1px);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}ax-scheduler-week-view .ax-scheduler-week-header{position:sticky;top:calc(var(--spacing, .25rem) * 0);z-index:20;width:100%;background-color:var(--ax-comp-scheduler-all-day-bg,inherit)}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days{display:flex;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-table{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 0);z-index:10;width:var(--ax-comp-scheduler-basic-view-blocks-width);flex-shrink:0;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));background-color:inherit;text-align:center}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date{display:flex;width:calc(100% - var(--ax-comp-scheduler-basic-view-blocks-width))}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date div{width:100%;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));text-align:center}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date div.ax-scheduler-week-header-date-day{display:grid;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 1);padding-inline:calc(var(--spacing, .25rem) * 2)}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date div.ax-scheduler-week-header-date-day.ax-state-today{background-color:rgba(var(--ax-sys-color-primary-surface));color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date div.ax-scheduler-week-header-date-day.ax-state-today{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 5%,transparent)}}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date div.ax-scheduler-week-header-date-day.ax-state-today .ax-scheduler-week-header-date-day-char{--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date div.ax-scheduler-week-header-date-day.ax-state-today .ax-scheduler-week-header-date-day-num{--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700)}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date div.ax-scheduler-week-header-date-day.ax-state-holiday{color:var(--ax-scheduler-holiday-color, rgba(var(--ax-sys-color-danger-surface)))}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date div.ax-scheduler-week-header-date-day.ax-state-holiday.ax-state-today{color:rgba(var(--ax-sys-color-primary-surface))}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date div.ax-scheduler-week-header-date-day .ax-scheduler-week-header-date-day-char{max-width:100%;--tw-font-weight: var(--font-weight-light, 300);font-weight:var(--font-weight-light, 300)}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date div.ax-scheduler-week-header-date-day .ax-scheduler-week-header-date-day-num{font-size:var(--text-xl, 1.25rem);line-height:var(--tw-leading, var(--text-xl--line-height, calc(1.75 / 1.25)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date div:last-child{border-inline-end-style:var(--tw-border-style);border-inline-end-width:0px}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date .ax-scheduler-all-day-slot{display:flex;width:calc(100% / 7);gap:calc(var(--spacing, .25rem) * 1)}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date .ax-scheduler-all-day-slot .ax-scheduler-header-week-appointment{display:block;width:100%;overflow:hidden;border-radius:calc(var(--ax-sys-border-radius) / 2);padding-inline:calc(var(--spacing, .25rem) * 2);text-align:start}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date .ax-scheduler-all-day-slot ax-popover{display:none}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days.ax-scheduler-week-allday-header .ax-scheduler-week-allday-content{position:relative;display:flex;width:calc(100% - var(--ax-comp-scheduler-basic-view-blocks-width));flex-direction:column}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days.ax-scheduler-week-allday-header .ax-scheduler-week-allday-content .ax-scheduler-week-spanning-layer{position:relative;display:grid;align-content:flex-start;padding-block:calc(var(--spacing, .25rem) * 1);grid-template-columns:repeat(7,1fr);row-gap:var(--ax-scheduler-week-spanning-row-gap)}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days.ax-scheduler-week-allday-header .ax-scheduler-week-allday-content .ax-scheduler-week-spanning-layer:before{content:\"\";pointer-events:none;position:absolute;inset:calc(var(--spacing, .25rem) * 0);z-index:0;background:linear-gradient(to right,transparent calc(100% / 7 * 1 - .5px),rgba(var(--ax-sys-color-border-lightest-surface)) calc(100% / 7 * 1 - .5px),rgba(var(--ax-sys-color-border-lightest-surface)) calc(100% / 7 * 1 + .5px),transparent calc(100% / 7 * 1 + .5px),transparent calc(100% / 7 * 2 - .5px),rgba(var(--ax-sys-color-border-lightest-surface)) calc(100% / 7 * 2 - .5px),rgba(var(--ax-sys-color-border-lightest-surface)) calc(100% / 7 * 2 + .5px),transparent calc(100% / 7 * 2 + .5px),transparent calc(100% / 7 * 3 - .5px),rgba(var(--ax-sys-color-border-lightest-surface)) calc(100% / 7 * 3 - .5px),rgba(var(--ax-sys-color-border-lightest-surface)) calc(100% / 7 * 3 + .5px),transparent calc(100% / 7 * 3 + .5px),transparent calc(100% / 7 * 4 - .5px),rgba(var(--ax-sys-color-border-lightest-surface)) calc(100% / 7 * 4 - .5px),rgba(var(--ax-sys-color-border-lightest-surface)) calc(100% / 7 * 4 + .5px),transparent calc(100% / 7 * 4 + .5px),transparent calc(100% / 7 * 5 - .5px),rgba(var(--ax-sys-color-border-lightest-surface)) calc(100% / 7 * 5 - .5px),rgba(var(--ax-sys-color-border-lightest-surface)) calc(100% / 7 * 5 + .5px),transparent calc(100% / 7 * 5 + .5px),transparent calc(100% / 7 * 6 - .5px),rgba(var(--ax-sys-color-border-lightest-surface)) calc(100% / 7 * 6 - .5px),rgba(var(--ax-sys-color-border-lightest-surface)) calc(100% / 7 * 6 + .5px),transparent calc(100% / 7 * 6 + .5px))}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days.ax-scheduler-week-allday-header .ax-scheduler-week-allday-content .ax-scheduler-week-spanning-layer .ax-scheduler-week-spanning-appointment{z-index:1;display:flex;cursor:pointer;align-items:center;overflow:hidden;text-overflow:ellipsis;border-radius:var(--radius-sm, .25rem);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * .5);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));white-space:nowrap;height:var(--ax-scheduler-week-spanning-row-height);margin-inline:.125rem}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days.ax-scheduler-week-allday-header .ax-scheduler-week-allday-content .ax-scheduler-week-spanning-layer .ax-scheduler-week-spanning-appointment .ax-spanning-appointment-title{display:flex;width:100%;align-items:center;justify-content:space-between}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days.ax-scheduler-week-allday-header .ax-scheduler-week-allday-content .ax-scheduler-week-spanning-layer .ax-scheduler-week-spanning-appointment .ax-spanning-appointment-title .ax-scheduler-truncate{min-width:calc(var(--spacing, .25rem) * 0);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days.ax-scheduler-week-allday-header .ax-scheduler-week-allday-content .ax-scheduler-week-spanning-layer .ax-scheduler-week-spanning-appointment .ax-spanning-appointment-title .ax-scheduler-action-icon{margin-inline-start:calc(var(--spacing, .25rem) * 1);width:auto;flex-shrink:0;cursor:pointer}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days.ax-scheduler-week-allday-header .ax-scheduler-week-allday-content .ax-scheduler-week-spanning-layer .ax-scheduler-week-spanning-appointment.ax-spanning-start-clipped{position:relative;border-start-start-radius:0;border-end-start-radius:0;margin-inline-start:0;padding-inline-start:1rem}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days.ax-scheduler-week-allday-header .ax-scheduler-week-allday-content .ax-scheduler-week-spanning-layer .ax-scheduler-week-spanning-appointment.ax-spanning-start-clipped:before{content:\"\\2190 \";position:absolute;top:50%;--tw-translate-y: -50% ;translate:var(--tw-translate-x) var(--tw-translate-y);font-size:.65rem;opacity:70%;inset-inline-start:.25rem}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days.ax-scheduler-week-allday-header .ax-scheduler-week-allday-content .ax-scheduler-week-spanning-layer .ax-scheduler-week-spanning-appointment.ax-spanning-end-clipped{position:relative;border-start-end-radius:0;border-end-end-radius:0;margin-inline-end:0;padding-inline-end:1rem}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days.ax-scheduler-week-allday-header .ax-scheduler-week-allday-content .ax-scheduler-week-spanning-layer .ax-scheduler-week-spanning-appointment.ax-spanning-end-clipped:after{content:\" \\2192\";position:absolute;top:50%;--tw-translate-y: -50% ;translate:var(--tw-translate-x) var(--tw-translate-y);font-size:.65rem;opacity:70%;inset-inline-end:.25rem}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days.ax-scheduler-week-allday-header .ax-scheduler-week-allday-content .ax-scheduler-week-allday-slots{display:flex;height:100%}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days.ax-scheduler-week-allday-header .ax-scheduler-week-allday-content .ax-scheduler-week-allday-slots .ax-scheduler-all-day-slot{display:flex;width:calc(100% / 7);gap:calc(var(--spacing, .25rem) * 1);border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));padding-block:calc(var(--spacing, .25rem) * 1)}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days.ax-scheduler-week-allday-header .ax-scheduler-week-allday-content .ax-scheduler-week-allday-slots .ax-scheduler-all-day-slot:last-child{border-inline-end-style:var(--tw-border-style);border-inline-end-width:0px}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days.ax-scheduler-week-allday-header .ax-scheduler-week-allday-content .ax-scheduler-week-allday-slots .ax-scheduler-all-day-slot .ax-scheduler-header-week-appointment{display:block;width:100%;overflow:hidden;border-radius:calc(var(--ax-sys-border-radius) / 2);padding-inline:calc(var(--spacing, .25rem) * 2);text-align:start}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days.ax-scheduler-week-allday-header .ax-scheduler-week-allday-content .ax-scheduler-week-allday-slots .ax-scheduler-all-day-slot ax-popover{display:none}ax-scheduler-week-view .ax-scheduler-week-time-container{display:flex;width:100%;background-color:inherit}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-time{position:sticky;inset-inline-start:calc(var(--spacing, .25rem) * 0);z-index:15;background-color:var(--ax-comp-scheduler-all-day-bg,inherit)}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-time div{position:relative;display:block;height:calc(var(--ax-comp-scheduler-basic-view-blocks-height) * 2);width:var(--ax-comp-scheduler-basic-view-blocks-width);border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 2);text-align:center}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-table-container{position:relative;width:100%}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-table-container .ax-scheduler-week-appointment-container{position:absolute;top:calc(var(--spacing, .25rem) * 0);width:100%}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-table-container .ax-scheduler-week-appointment-container .ax-scheduler-week-appointment{position:absolute;inset-inline-start:calc(var(--spacing, .25rem) * 0);display:flex;flex-direction:column;border-radius:calc(var(--ax-sys-border-radius) / 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1)}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-table-container table{width:100%}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-table-container table tr{display:flex;height:var(--ax-comp-scheduler-basic-view-blocks-height);border-top-style:var(--tw-border-style);border-top-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-table-container table tr:first-child{border-top-style:var(--tw-border-style);border-top-width:0px}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-table-container table tr td{width:100%;border-inline-end-style:var(--tw-border-style);border-inline-end-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));text-align:center}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-table-container table tr td:last-child{border-inline-end-style:var(--tw-border-style);border-inline-end-width:0px}ax-scheduler-week-view:not(.ax-state-readonly) .ax-scheduler-week-appointment,ax-scheduler-week-view:not(.ax-state-readonly) .ax-scheduler-header-week-appointment{cursor:pointer}ax-scheduler-week-view:not(.ax-state-readonly) .ax-scheduler-all-day-slot,ax-scheduler-week-view:not(.ax-state-readonly) .ax-scheduler-week-table-container>table td{cursor:pointer;transition-property:background-color;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));transition-duration:var(--ax-sys-transition-duration);transition-timing-function:var(--ax-sys-transition-timing-function)}:is(ax-scheduler-week-view:not(.ax-state-readonly) .ax-scheduler-all-day-slot,ax-scheduler-week-view:not(.ax-state-readonly) .ax-scheduler-week-table-container>table td):hover{background-color:rgba(var(--ax-comp-scheduler-slot-hover-bg,var(--ax-sys-color-primary-surface),.1))}ax-scheduler-week-view ax-title{display:flex;justify-content:space-between}ax-scheduler-week-view ax-title .ax-scheduler-action-icon{width:auto;cursor:pointer}ax-scheduler-week-view .ax-scheduler-current-time-line{height:calc(var(--spacing, .25rem) * .5)}ax-scheduler-week-view .ax-scheduler-current-time-line:before{content:var(--tw-content);inset-inline-start:-6px}ax-scheduler-week-view .ax-scheduler-current-time-line:before{content:var(--tw-content);top:-5px}ax-scheduler.ax-rtl ax-scheduler-week-view .ax-scheduler-week-spanning-appointment.ax-spanning-start-clipped:before{content:\"\\2192 \"}ax-scheduler.ax-rtl ax-scheduler-week-view .ax-scheduler-week-spanning-appointment.ax-spanning-end-clipped:after{content:\" \\2190\"}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-translate-x{syntax: \"*\"; inherits: false; initial-value: 0;}@property --tw-translate-y{syntax: \"*\"; inherits: false; initial-value: 0;}@property --tw-translate-z{syntax: \"*\"; inherits: false; initial-value: 0;}@property --tw-content{syntax: \"*\"; initial-value: \"\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial;--tw-translate-x: 0;--tw-translate-y: 0;--tw-translate-z: 0;--tw-content: \"\"}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: AXDragDirective, selector: "[axDrag]", inputs: ["axDrag", "dragData", "dragDisabled", "dragTransition", "dragElementClone", "dropZoneGroup", "dragStartDelay", "dragResetOnDblClick", "dragLockAxis", "dragClonedTemplate", "dragCursor", "dragBoundary", "dragTransitionDuration"], outputs: ["dragPositionChanged"] }, { kind: "component", type: AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disablePanelClass", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "closeOnScroll", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "directive", type: AXTooltipDirective, selector: "[axTooltip]", inputs: ["axTooltipDisabled", "axTooltip", "axTooltipContext", "axTooltipPlacement", "axTooltipOffsetX", "axTooltipOffsetY", "axTooltipOpenAfter", "axTooltipCloseAfter"] }, { kind: "directive", type: AXDropZoneDirective, selector: "[axDropZone]", inputs: ["dropZoneGroup"], outputs: ["onElementDrop", "onElementHover"], exportAs: ["axDropZone"] }, { kind: "component", type: AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXFormatPipe, name: "format" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
4524
4705
|
}
|
|
4525
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
4706
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXSchedulerWeekViewComponent, decorators: [{
|
|
4526
4707
|
type: Component,
|
|
4527
|
-
args: [{ selector: 'ax-scheduler-week-view',
|
|
4708
|
+
args: [{ selector: 'ax-scheduler-week-view', encapsulation: ViewEncapsulation.None, host: {
|
|
4528
4709
|
'[class.ax-state-readonly]': 'readonly()',
|
|
4529
4710
|
}, imports: [
|
|
4530
4711
|
AsyncPipe,
|
|
@@ -4549,12 +4730,18 @@ class AXSchedulerComponent extends NXComponent {
|
|
|
4549
4730
|
this.schedulerService = inject(AXSchedulerService);
|
|
4550
4731
|
this.translationService = inject(AXTranslationService);
|
|
4551
4732
|
this.eventService = inject(AXEventService);
|
|
4552
|
-
this.translationRevision = signal(0,
|
|
4553
|
-
|
|
4554
|
-
this.
|
|
4555
|
-
|
|
4556
|
-
this.
|
|
4557
|
-
|
|
4733
|
+
this.translationRevision = signal(0, /* @ts-ignore */
|
|
4734
|
+
...(ngDevMode ? [{ debugName: "translationRevision" }] : /* istanbul ignore next */ []));
|
|
4735
|
+
this.viewModeSelectbox = viewChild(AXSelectBoxComponent, /* @ts-ignore */
|
|
4736
|
+
...(ngDevMode ? [{ debugName: "viewModeSelectbox" }] : /* istanbul ignore next */ []));
|
|
4737
|
+
this.calendarPopover = viewChild('calendarPopover', /* @ts-ignore */
|
|
4738
|
+
...(ngDevMode ? [{ debugName: "calendarPopover" }] : /* istanbul ignore next */ []));
|
|
4739
|
+
this._calendarDayCellTemplate = viewChild('calendarDayCellTemplate', /* @ts-ignore */
|
|
4740
|
+
...(ngDevMode ? [{ debugName: "_calendarDayCellTemplate" }] : /* istanbul ignore next */ []));
|
|
4741
|
+
this._calendarMonthCellTemplate = viewChild('calendarMonthCellTemplate', /* @ts-ignore */
|
|
4742
|
+
...(ngDevMode ? [{ debugName: "_calendarMonthCellTemplate" }] : /* istanbul ignore next */ []));
|
|
4743
|
+
this._calendarYearCellTemplate = viewChild('calendarYearCellTemplate', /* @ts-ignore */
|
|
4744
|
+
...(ngDevMode ? [{ debugName: "_calendarYearCellTemplate" }] : /* istanbul ignore next */ []));
|
|
4558
4745
|
this.displayViews = {
|
|
4559
4746
|
day: 'daily',
|
|
4560
4747
|
week: 'weekly',
|
|
@@ -4565,9 +4752,12 @@ class AXSchedulerComponent extends NXComponent {
|
|
|
4565
4752
|
'timeline-year': 'yearly-timeline',
|
|
4566
4753
|
agenda: 'agenda',
|
|
4567
4754
|
};
|
|
4568
|
-
this.calendar = input(
|
|
4569
|
-
|
|
4570
|
-
this.
|
|
4755
|
+
this.calendar = input(/* @ts-ignore */
|
|
4756
|
+
...(ngDevMode ? [undefined, { debugName: "calendar" }] : /* istanbul ignore next */ []));
|
|
4757
|
+
this.calendarType = linkedSignal(() => this.localeService.activeProfile().calendar.system, /* @ts-ignore */
|
|
4758
|
+
...(ngDevMode ? [{ debugName: "calendarType" }] : /* istanbul ignore next */ []));
|
|
4759
|
+
this.startingDate = input(new Date(), /* @ts-ignore */
|
|
4760
|
+
...(ngDevMode ? [{ debugName: "startingDate" }] : /* istanbul ignore next */ []));
|
|
4571
4761
|
this.currentDate = linkedSignal({ ...(ngDevMode ? { debugName: "currentDate" } : /* istanbul ignore next */ {}), source: () => ({
|
|
4572
4762
|
startingDate: this.startingDate(),
|
|
4573
4763
|
calendarType: this.calendarType(),
|
|
@@ -4578,34 +4768,59 @@ class AXSchedulerComponent extends NXComponent {
|
|
|
4578
4768
|
}
|
|
4579
4769
|
return this.calendarService.create(source.startingDate, source.calendarType).startOf('day');
|
|
4580
4770
|
} });
|
|
4581
|
-
this._appointments = signal([],
|
|
4771
|
+
this._appointments = signal([], /* @ts-ignore */
|
|
4772
|
+
...(ngDevMode ? [{ debugName: "_appointments" }] : /* istanbul ignore next */ []));
|
|
4582
4773
|
this.appointments = this._appointments.asReadonly();
|
|
4583
4774
|
this.rtl = this.localeService.isRtl;
|
|
4584
|
-
this.isFullScreen = signal(false,
|
|
4585
|
-
|
|
4586
|
-
this.
|
|
4775
|
+
this.isFullScreen = signal(false, /* @ts-ignore */
|
|
4776
|
+
...(ngDevMode ? [{ debugName: "isFullScreen" }] : /* istanbul ignore next */ []));
|
|
4777
|
+
this.viewsDataSource = signal([], /* @ts-ignore */
|
|
4778
|
+
...(ngDevMode ? [{ debugName: "viewsDataSource" }] : /* istanbul ignore next */ []));
|
|
4779
|
+
this.prevDate = signal(this.calendarService.create(new Date(), this.calendarType()), /* @ts-ignore */
|
|
4780
|
+
...(ngDevMode ? [{ debugName: "prevDate" }] : /* istanbul ignore next */ []));
|
|
4587
4781
|
// Track the currently selected/active appointment
|
|
4588
|
-
this.selectedAppointmentId = signal(null,
|
|
4589
|
-
|
|
4590
|
-
this.
|
|
4591
|
-
|
|
4592
|
-
this.
|
|
4593
|
-
|
|
4594
|
-
this.
|
|
4595
|
-
|
|
4596
|
-
this.
|
|
4597
|
-
|
|
4598
|
-
this.
|
|
4599
|
-
|
|
4600
|
-
this.
|
|
4601
|
-
|
|
4602
|
-
this.
|
|
4603
|
-
|
|
4604
|
-
this.
|
|
4605
|
-
|
|
4606
|
-
this.
|
|
4607
|
-
|
|
4608
|
-
this.
|
|
4782
|
+
this.selectedAppointmentId = signal(null, /* @ts-ignore */
|
|
4783
|
+
...(ngDevMode ? [{ debugName: "selectedAppointmentId" }] : /* istanbul ignore next */ []));
|
|
4784
|
+
this.endDayHour = input(24, /* @ts-ignore */
|
|
4785
|
+
...(ngDevMode ? [{ debugName: "endDayHour" }] : /* istanbul ignore next */ []));
|
|
4786
|
+
this.startDayHour = input(8, /* @ts-ignore */
|
|
4787
|
+
...(ngDevMode ? [{ debugName: "startDayHour" }] : /* istanbul ignore next */ []));
|
|
4788
|
+
this.hasHeader = input(true, /* @ts-ignore */
|
|
4789
|
+
...(ngDevMode ? [{ debugName: "hasHeader" }] : /* istanbul ignore next */ []));
|
|
4790
|
+
this.readonly = input(false, /* @ts-ignore */
|
|
4791
|
+
...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
|
|
4792
|
+
this.draggable = input(true, /* @ts-ignore */
|
|
4793
|
+
...(ngDevMode ? [{ debugName: "draggable" }] : /* istanbul ignore next */ []));
|
|
4794
|
+
this.hasActions = input(false, /* @ts-ignore */
|
|
4795
|
+
...(ngDevMode ? [{ debugName: "hasActions" }] : /* istanbul ignore next */ []));
|
|
4796
|
+
this.dragStartDelay = input(0, /* @ts-ignore */
|
|
4797
|
+
...(ngDevMode ? [{ debugName: "dragStartDelay" }] : /* istanbul ignore next */ []));
|
|
4798
|
+
this.weekend = input([], /* @ts-ignore */
|
|
4799
|
+
...(ngDevMode ? [{ debugName: "weekend" }] : /* istanbul ignore next */ []));
|
|
4800
|
+
this.allowFullScreen = input(true, /* @ts-ignore */
|
|
4801
|
+
...(ngDevMode ? [{ debugName: "allowFullScreen" }] : /* istanbul ignore next */ []));
|
|
4802
|
+
this.multiDayViewDaysCount = input(7, /* @ts-ignore */
|
|
4803
|
+
...(ngDevMode ? [{ debugName: "multiDayViewDaysCount" }] : /* istanbul ignore next */ []));
|
|
4804
|
+
this.showResourceHeaders = input(true, /* @ts-ignore */
|
|
4805
|
+
...(ngDevMode ? [{ debugName: "showResourceHeaders" }] : /* istanbul ignore next */ []));
|
|
4806
|
+
this.showCurrentTimeIndicator = input(true, /* @ts-ignore */
|
|
4807
|
+
...(ngDevMode ? [{ debugName: "showCurrentTimeIndicator" }] : /* istanbul ignore next */ []));
|
|
4808
|
+
this.scrollToCurrentTimeIndicator = input(false, /* @ts-ignore */
|
|
4809
|
+
...(ngDevMode ? [{ debugName: "scrollToCurrentTimeIndicator" }] : /* istanbul ignore next */ []));
|
|
4810
|
+
this.showUnassignedAppointments = input(true, /* @ts-ignore */
|
|
4811
|
+
...(ngDevMode ? [{ debugName: "showUnassignedAppointments" }] : /* istanbul ignore next */ []));
|
|
4812
|
+
this.resources = input([], /* @ts-ignore */
|
|
4813
|
+
...(ngDevMode ? [{ debugName: "resources" }] : /* istanbul ignore next */ []));
|
|
4814
|
+
this.resourceTemplate = input(/* @ts-ignore */
|
|
4815
|
+
...(ngDevMode ? [undefined, { debugName: "resourceTemplate" }] : /* istanbul ignore next */ []));
|
|
4816
|
+
this.firstDayOfWeek = input(/* @ts-ignore */
|
|
4817
|
+
...(ngDevMode ? [undefined, { debugName: "firstDayOfWeek" }] : /* istanbul ignore next */ []));
|
|
4818
|
+
this.tooltipTemplate = input(/* @ts-ignore */
|
|
4819
|
+
...(ngDevMode ? [undefined, { debugName: "tooltipTemplate" }] : /* istanbul ignore next */ []));
|
|
4820
|
+
this.dataSource = input([], /* @ts-ignore */
|
|
4821
|
+
...(ngDevMode ? [{ debugName: "dataSource" }] : /* istanbul ignore next */ []));
|
|
4822
|
+
this.holidays = input(/* @ts-ignore */
|
|
4823
|
+
...(ngDevMode ? [undefined, { debugName: "holidays" }] : /* istanbul ignore next */ []));
|
|
4609
4824
|
this.views = input([
|
|
4610
4825
|
'day',
|
|
4611
4826
|
'week',
|
|
@@ -4615,9 +4830,12 @@ class AXSchedulerComponent extends NXComponent {
|
|
|
4615
4830
|
'timeline-month',
|
|
4616
4831
|
'timeline-year',
|
|
4617
4832
|
'agenda',
|
|
4618
|
-
],
|
|
4619
|
-
|
|
4620
|
-
this.
|
|
4833
|
+
], /* @ts-ignore */
|
|
4834
|
+
...(ngDevMode ? [{ debugName: "views" }] : /* istanbul ignore next */ []));
|
|
4835
|
+
this.selectedView = model(this.views()[0], /* @ts-ignore */
|
|
4836
|
+
...(ngDevMode ? [{ debugName: "selectedView" }] : /* istanbul ignore next */ []));
|
|
4837
|
+
this.prevView = signal(this.selectedView(), /* @ts-ignore */
|
|
4838
|
+
...(ngDevMode ? [{ debugName: "prevView" }] : /* istanbul ignore next */ []));
|
|
4621
4839
|
// --- Public Outputs ---
|
|
4622
4840
|
this.onDataLoaded = output();
|
|
4623
4841
|
this.onRangeChanged = output();
|
|
@@ -4636,7 +4854,8 @@ class AXSchedulerComponent extends NXComponent {
|
|
|
4636
4854
|
if (override != null && override !== profileSystem) {
|
|
4637
4855
|
untracked(() => this.calendarType.set(override));
|
|
4638
4856
|
}
|
|
4639
|
-
},
|
|
4857
|
+
}, /* @ts-ignore */
|
|
4858
|
+
...(ngDevMode ? [{ debugName: "#calendarOverrideEffect" }] : /* istanbul ignore next */ []));
|
|
4640
4859
|
this.#appointmentEffect = effect(() => {
|
|
4641
4860
|
const dataSource = this.dataSource();
|
|
4642
4861
|
const range = {
|
|
@@ -4662,7 +4881,8 @@ class AXSchedulerComponent extends NXComponent {
|
|
|
4662
4881
|
this._appointments.set(list);
|
|
4663
4882
|
this.onDataLoaded.emit();
|
|
4664
4883
|
}
|
|
4665
|
-
},
|
|
4884
|
+
}, /* @ts-ignore */
|
|
4885
|
+
...(ngDevMode ? [{ debugName: "#appointmentEffect" }] : /* istanbul ignore next */ []));
|
|
4666
4886
|
this.#holidayEffect = effect(() => {
|
|
4667
4887
|
const func = this.holidays();
|
|
4668
4888
|
if (!func)
|
|
@@ -4680,11 +4900,13 @@ class AXSchedulerComponent extends NXComponent {
|
|
|
4680
4900
|
else {
|
|
4681
4901
|
this.schedulerService.internalHoliday.set(result);
|
|
4682
4902
|
}
|
|
4683
|
-
},
|
|
4903
|
+
}, /* @ts-ignore */
|
|
4904
|
+
...(ngDevMode ? [{ debugName: "#holidayEffect" }] : /* istanbul ignore next */ []));
|
|
4684
4905
|
this.#weekendEffect = effect(() => {
|
|
4685
4906
|
const weekend = this.weekend();
|
|
4686
4907
|
this.schedulerService.internalWeekend.set(weekend);
|
|
4687
|
-
},
|
|
4908
|
+
}, /* @ts-ignore */
|
|
4909
|
+
...(ngDevMode ? [{ debugName: "#weekendEffect" }] : /* istanbul ignore next */ []));
|
|
4688
4910
|
this.currentDateText = computed(() => {
|
|
4689
4911
|
this.translationRevision();
|
|
4690
4912
|
this.localeService.activeProfile();
|
|
@@ -4730,7 +4952,8 @@ class AXSchedulerComponent extends NXComponent {
|
|
|
4730
4952
|
calendar: this.calendarType(),
|
|
4731
4953
|
});
|
|
4732
4954
|
}
|
|
4733
|
-
},
|
|
4955
|
+
}, /* @ts-ignore */
|
|
4956
|
+
...(ngDevMode ? [{ debugName: "currentDateText" }] : /* istanbul ignore next */ []));
|
|
4734
4957
|
this.calendarDepth = computed(() => {
|
|
4735
4958
|
switch (this.selectedView()) {
|
|
4736
4959
|
case 'day':
|
|
@@ -4745,7 +4968,8 @@ class AXSchedulerComponent extends NXComponent {
|
|
|
4745
4968
|
case 'timeline-year':
|
|
4746
4969
|
return 'year';
|
|
4747
4970
|
}
|
|
4748
|
-
},
|
|
4971
|
+
}, /* @ts-ignore */
|
|
4972
|
+
...(ngDevMode ? [{ debugName: "calendarDepth" }] : /* istanbul ignore next */ []));
|
|
4749
4973
|
this.mappedAppointments = computed(() => {
|
|
4750
4974
|
const items = this._appointments();
|
|
4751
4975
|
return items
|
|
@@ -4765,7 +4989,8 @@ class AXSchedulerComponent extends NXComponent {
|
|
|
4765
4989
|
return item;
|
|
4766
4990
|
})
|
|
4767
4991
|
.filter((appt) => appt !== null); // Filter out nulls from invalid dates
|
|
4768
|
-
},
|
|
4992
|
+
}, /* @ts-ignore */
|
|
4993
|
+
...(ngDevMode ? [{ debugName: "mappedAppointments" }] : /* istanbul ignore next */ []));
|
|
4769
4994
|
this.range = computed(() => {
|
|
4770
4995
|
const view = this.selectedView();
|
|
4771
4996
|
const current = this.currentDate().startOf('day');
|
|
@@ -4800,16 +5025,19 @@ class AXSchedulerComponent extends NXComponent {
|
|
|
4800
5025
|
return range;
|
|
4801
5026
|
}
|
|
4802
5027
|
}
|
|
4803
|
-
},
|
|
5028
|
+
}, /* @ts-ignore */
|
|
5029
|
+
...(ngDevMode ? [{ debugName: "range" }] : /* istanbul ignore next */ []));
|
|
4804
5030
|
this.#rangeChangedEffect = effect(() => {
|
|
4805
5031
|
this.onRangeChanged.emit(this.range());
|
|
4806
|
-
},
|
|
5032
|
+
}, /* @ts-ignore */
|
|
5033
|
+
...(ngDevMode ? [{ debugName: "#rangeChangedEffect" }] : /* istanbul ignore next */ []));
|
|
4807
5034
|
this.#viewChangedEffect = effect(() => {
|
|
4808
5035
|
const view = this.selectedView();
|
|
4809
5036
|
untracked(() => {
|
|
4810
5037
|
this.handleViewChanged(this.prevView(), view);
|
|
4811
5038
|
});
|
|
4812
|
-
},
|
|
5039
|
+
}, /* @ts-ignore */
|
|
5040
|
+
...(ngDevMode ? [{ debugName: "#viewChangedEffect" }] : /* istanbul ignore next */ []));
|
|
4813
5041
|
this.viewAppointments = computed(() => {
|
|
4814
5042
|
const current = this.currentDate();
|
|
4815
5043
|
const mapped = this.mappedAppointments();
|
|
@@ -4819,7 +5047,8 @@ class AXSchedulerComponent extends NXComponent {
|
|
|
4819
5047
|
return [];
|
|
4820
5048
|
return mapped.filter((appt) => this.calendarService.create(appt.startDate, this.calendarType()).compare(rangeEnd, 'second') <= 0 &&
|
|
4821
5049
|
this.calendarService.create(appt.endDate, this.calendarType()).compare(rangeStart, 'second') >= 0);
|
|
4822
|
-
},
|
|
5050
|
+
}, /* @ts-ignore */
|
|
5051
|
+
...(ngDevMode ? [{ debugName: "viewAppointments" }] : /* istanbul ignore next */ []));
|
|
4823
5052
|
}
|
|
4824
5053
|
/** Expose template refs for calendar bindings (signals are not callable in template type-check) */
|
|
4825
5054
|
get calendarDayCellTemplateRef() {
|
|
@@ -5117,12 +5346,12 @@ class AXSchedulerComponent extends NXComponent {
|
|
|
5117
5346
|
this._appointments.set(list);
|
|
5118
5347
|
this.onDataLoaded.emit();
|
|
5119
5348
|
}
|
|
5120
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
5121
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXSchedulerComponent, isStandalone: true, selector: "ax-scheduler", inputs: { calendar: { classPropertyName: "calendar", publicName: "calendar", isSignal: true, isRequired: false, transformFunction: null }, startingDate: { classPropertyName: "startingDate", publicName: "startingDate", isSignal: true, isRequired: false, transformFunction: null }, endDayHour: { classPropertyName: "endDayHour", publicName: "endDayHour", isSignal: true, isRequired: false, transformFunction: null }, startDayHour: { classPropertyName: "startDayHour", publicName: "startDayHour", isSignal: true, isRequired: false, transformFunction: null }, hasHeader: { classPropertyName: "hasHeader", publicName: "hasHeader", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, draggable: { classPropertyName: "draggable", publicName: "draggable", isSignal: true, isRequired: false, transformFunction: null }, hasActions: { classPropertyName: "hasActions", publicName: "hasActions", isSignal: true, isRequired: false, transformFunction: null }, dragStartDelay: { classPropertyName: "dragStartDelay", publicName: "dragStartDelay", isSignal: true, isRequired: false, transformFunction: null }, weekend: { classPropertyName: "weekend", publicName: "weekend", isSignal: true, isRequired: false, transformFunction: null }, allowFullScreen: { classPropertyName: "allowFullScreen", publicName: "allowFullScreen", isSignal: true, isRequired: false, transformFunction: null }, multiDayViewDaysCount: { classPropertyName: "multiDayViewDaysCount", publicName: "multiDayViewDaysCount", isSignal: true, isRequired: false, transformFunction: null }, showResourceHeaders: { classPropertyName: "showResourceHeaders", publicName: "showResourceHeaders", isSignal: true, isRequired: false, transformFunction: null }, showCurrentTimeIndicator: { classPropertyName: "showCurrentTimeIndicator", publicName: "showCurrentTimeIndicator", isSignal: true, isRequired: false, transformFunction: null }, scrollToCurrentTimeIndicator: { classPropertyName: "scrollToCurrentTimeIndicator", publicName: "scrollToCurrentTimeIndicator", isSignal: true, isRequired: false, transformFunction: null }, showUnassignedAppointments: { classPropertyName: "showUnassignedAppointments", publicName: "showUnassignedAppointments", isSignal: true, isRequired: false, transformFunction: null }, resources: { classPropertyName: "resources", publicName: "resources", isSignal: true, isRequired: false, transformFunction: null }, resourceTemplate: { classPropertyName: "resourceTemplate", publicName: "resourceTemplate", isSignal: true, isRequired: false, transformFunction: null }, firstDayOfWeek: { classPropertyName: "firstDayOfWeek", publicName: "firstDayOfWeek", isSignal: true, isRequired: false, transformFunction: null }, tooltipTemplate: { classPropertyName: "tooltipTemplate", publicName: "tooltipTemplate", isSignal: true, isRequired: false, transformFunction: null }, dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: false, transformFunction: null }, holidays: { classPropertyName: "holidays", publicName: "holidays", isSignal: true, isRequired: false, transformFunction: null }, views: { classPropertyName: "views", publicName: "views", isSignal: true, isRequired: false, transformFunction: null }, selectedView: { classPropertyName: "selectedView", publicName: "selectedView", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedView: "selectedViewChange", onDataLoaded: "onDataLoaded", onRangeChanged: "onRangeChanged", onSlotClicked: "onSlotClicked", onSlotDblClicked: "onSlotDblClicked", onSlotRightClick: "onSlotRightClick", onAppointmentDrop: "onAppointmentDrop", onActionClick: "onActionClick", onAppointmentClicked: "onAppointmentClicked", onAppointmentDblClicked: "onAppointmentDblClicked", onAppointmentRightClick: "onAppointmentRightClick" }, host: { properties: { "class.ax-rtl": "rtl()" } }, providers: [AXUnsubscriber, { provide: AXComponent, useExisting: AXSchedulerComponent }], viewQueries: [{ propertyName: "viewModeSelectbox", first: true, predicate: AXSelectBoxComponent, descendants: true, isSignal: true }, { propertyName: "calendarPopover", first: true, predicate: ["calendarPopover"], descendants: true, isSignal: true }, { propertyName: "_calendarDayCellTemplate", first: true, predicate: ["calendarDayCellTemplate"], descendants: true, isSignal: true }, { propertyName: "_calendarMonthCellTemplate", first: true, predicate: ["calendarMonthCellTemplate"], descendants: true, isSignal: true }, { propertyName: "_calendarYearCellTemplate", first: true, predicate: ["calendarYearCellTemplate"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"ax-scheduler-container\">\n @if (hasHeader()) {\n <div class=\"ax-scheduler-header\">\n <div class=\"ax-scheduler-date\">\n <ax-button look=\"blank\" (onClick)=\"prevClick()\">\n <ax-icon\n class=\"ax-icon text-xl\"\n [class.ax-icon-chevron-left]=\"!rtl()\"\n [class.ax-icon-chevron-right]=\"rtl()\"\n ></ax-icon>\n </ax-button>\n <ax-button look=\"blank\" [text]=\"currentDateText()\" #date></ax-button>\n <ax-button look=\"blank\" (onClick)=\"nextClick()\">\n <ax-icon\n class=\"ax-icon text-xl\"\n [class.ax-icon-chevron-right]=\"!rtl()\"\n [class.ax-icon-chevron-left]=\"rtl()\"\n ></ax-icon>\n </ax-button>\n <ax-popover [target]=\"date\" #calendarPopover>\n <ax-calendar\n [type]=\"calendarType()\"\n [depth]=\"calendarDepth()\"\n [ngModel]=\"currentDate()\"\n [dayCellTemplate]=\"calendarDayCellTemplateRef\"\n [monthCellTemplate]=\"calendarMonthCellTemplateRef\"\n [yearCellTemplate]=\"calendarYearCellTemplateRef\"\n (onValueChanged)=\"calendarDateChanged($event)\"\n ></ax-calendar>\n </ax-popover>\n </div>\n <div class=\"ax-scheduler-actions\">\n <ax-select-box\n [dropdownWidth]=\"'200px'\"\n [ngModel]=\"selectedView()\"\n [dataSource]=\"viewsDataSource()\"\n (onValueChanged)=\"viewChanged($event)\"\n ></ax-select-box>\n\n @if (allowFullScreen()) {\n <ax-button look=\"blank\" (onClick)=\"handleFullScreen()\">\n <ax-icon>\n <i class=\"fa-solid\" [class.fa-compress]=\"isFullScreen()\" [class.fa-expand]=\"!isFullScreen()\"></i>\n </ax-icon>\n </ax-button>\n }\n </div>\n </div>\n }\n <div class=\"ax-scheduler-views-container\">\n @switch (selectedView()) {\n @case ('day') {\n <ax-scheduler-day-view\n [rtl]=\"rtl()\"\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [draggable]=\"draggable()\"\n [hasActions]=\"hasActions()\"\n [calendar]=\"calendarType()\"\n [endDayHour]=\"endDayHour()\"\n [startDayHour]=\"startDayHour()\"\n [showCurrentTimeIndicator]=\"showCurrentTimeIndicator()\"\n [scrollToCurrentTimeIndicator]=\"scrollToCurrentTimeIndicator()\"\n [appointments]=\"viewAppointments()\"\n [dragStartDelay]=\"dragStartDelay()\"\n [tooltipTemplate]=\"tooltipTemplate()\"\n [selectedAppointmentId]=\"selectedAppointmentId()\"\n (onActionClickInternal)=\"onActionClick.emit($event)\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($event)\"\n (onAppointmentDropInternal)=\"handleAppointmentDropInternal($event)\"\n (appointmentClickedInternal)=\"handleAppointmentClickInternal($event)\"\n (appointmentDblClickedInternal)=\"handleAppointmentDblClickInternal($event)\"\n (appointmentRightClickedInternal)=\"handleAppointmentRightClickInternal($event)\"\n ></ax-scheduler-day-view>\n }\n @case ('week') {\n <ax-scheduler-week-view\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [draggable]=\"draggable()\"\n [calendar]=\"calendarType()\"\n [endDayHour]=\"endDayHour()\"\n [hasActions]=\"hasActions()\"\n [startDayHour]=\"startDayHour()\"\n [showCurrentTimeIndicator]=\"showCurrentTimeIndicator()\"\n [scrollToCurrentTimeIndicator]=\"scrollToCurrentTimeIndicator()\"\n [appointments]=\"viewAppointments()\"\n [dragStartDelay]=\"dragStartDelay()\"\n [tooltipTemplate]=\"tooltipTemplate()\"\n [selectedAppointmentId]=\"selectedAppointmentId()\"\n (onActionClickInternal)=\"onActionClick.emit($event)\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($event)\"\n (onAppointmentDropInternal)=\"handleAppointmentDropInternal($event)\"\n (appointmentClickedInternal)=\"handleAppointmentClickInternal($event)\"\n (appointmentDblClickedInternal)=\"handleAppointmentDblClickInternal($event)\"\n (appointmentRightClickedInternal)=\"handleAppointmentRightClickInternal($event)\"\n ></ax-scheduler-week-view>\n }\n @case ('month') {\n <ax-scheduler-month-view\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [draggable]=\"draggable()\"\n [calendar]=\"calendarType()\"\n [hasActions]=\"hasActions()\"\n [appointments]=\"viewAppointments()\"\n [firstDayOfWeek]=\"firstDayOfWeek()\"\n [dragStartDelay]=\"dragStartDelay()\"\n [tooltipTemplate]=\"tooltipTemplate()\"\n [selectedAppointmentId]=\"selectedAppointmentId()\"\n (onActionClickInternal)=\"onActionClick.emit($event)\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($event)\"\n (onAppointmentDropInternal)=\"handleAppointmentDropInternal($event)\"\n (appointmentClickedInternal)=\"handleAppointmentClickInternal($event)\"\n (appointmentDblClickedInternal)=\"handleAppointmentDblClickInternal($event)\"\n (appointmentRightClickedInternal)=\"handleAppointmentRightClickInternal($event)\"\n ></ax-scheduler-month-view>\n }\n @case ('timeline-day') {\n <ax-scheduler-timeline-day-view\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [resources]=\"resources()\"\n [draggable]=\"draggable()\"\n [hasActions]=\"hasActions()\"\n [calendar]=\"calendarType()\"\n [endDayHour]=\"endDayHour()\"\n [startDayHour]=\"startDayHour()\"\n [appointments]=\"viewAppointments()\"\n [dragStartDelay]=\"dragStartDelay()\"\n [tooltipTemplate]=\"tooltipTemplate()\"\n [resourceTemplate]=\"resourceTemplate()\"\n [showResourceHeaders]=\"showResourceHeaders()\"\n [showCurrentTimeIndicator]=\"showCurrentTimeIndicator()\"\n [scrollToCurrentTimeIndicator]=\"scrollToCurrentTimeIndicator()\"\n [showUnassignedAppointments]=\"showUnassignedAppointments()\"\n [selectedAppointmentId]=\"selectedAppointmentId()\"\n (onActionClickInternal)=\"onActionClick.emit($event)\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($event)\"\n (onAppointmentDropInternal)=\"handleAppointmentDropInternal($event)\"\n (appointmentClickedInternal)=\"handleAppointmentClickInternal($event)\"\n (appointmentDblClickedInternal)=\"handleAppointmentDblClickInternal($event)\"\n (appointmentRightClickedInternal)=\"handleAppointmentRightClickInternal($event)\"\n >\n </ax-scheduler-timeline-day-view>\n }\n @case ('timeline-weekly') {\n <ax-scheduler-timeline-weekly-view\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [resources]=\"resources()\"\n [draggable]=\"draggable()\"\n [calendar]=\"calendarType()\"\n [endDayHour]=\"endDayHour()\"\n [hasActions]=\"hasActions()\"\n [startDayHour]=\"startDayHour()\"\n [appointments]=\"viewAppointments()\"\n [dragStartDelay]=\"dragStartDelay()\"\n [daysCount]=\"multiDayViewDaysCount()\"\n [tooltipTemplate]=\"tooltipTemplate()\"\n [resourceTemplate]=\"resourceTemplate()\"\n [showResourceHeaders]=\"showResourceHeaders()\"\n [showCurrentTimeIndicator]=\"showCurrentTimeIndicator()\"\n [scrollToCurrentTimeIndicator]=\"scrollToCurrentTimeIndicator()\"\n [showUnassignedAppointments]=\"showUnassignedAppointments()\"\n [selectedAppointmentId]=\"selectedAppointmentId()\"\n (onActionClickInternal)=\"onActionClick.emit($event)\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($event)\"\n (onAppointmentDropInternal)=\"handleAppointmentDropInternal($event)\"\n (appointmentClickedInternal)=\"handleAppointmentClickInternal($event)\"\n (appointmentDblClickedInternal)=\"handleAppointmentDblClickInternal($event)\"\n (appointmentRightClickedInternal)=\"handleAppointmentRightClickInternal($event)\"\n >\n </ax-scheduler-timeline-weekly-view>\n }\n @case ('timeline-month') {\n <ax-scheduler-timeline-month-view\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [resources]=\"resources()\"\n [draggable]=\"draggable()\"\n [calendar]=\"calendarType()\"\n [hasActions]=\"hasActions()\"\n [appointments]=\"viewAppointments()\"\n [dragStartDelay]=\"dragStartDelay()\"\n [tooltipTemplate]=\"tooltipTemplate()\"\n [resourceTemplate]=\"resourceTemplate()\"\n [showResourceHeaders]=\"showResourceHeaders()\"\n [showCurrentTimeIndicator]=\"showCurrentTimeIndicator()\"\n [scrollToCurrentTimeIndicator]=\"scrollToCurrentTimeIndicator()\"\n [showUnassignedAppointments]=\"showUnassignedAppointments()\"\n [selectedAppointmentId]=\"selectedAppointmentId()\"\n (onActionClickInternal)=\"onActionClick.emit($event)\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($event)\"\n (onAppointmentDropInternal)=\"handleAppointmentDropInternal($event)\"\n (appointmentClickedInternal)=\"handleAppointmentClickInternal($event)\"\n (appointmentDblClickedInternal)=\"handleAppointmentDblClickInternal($event)\"\n (appointmentRightClickedInternal)=\"handleAppointmentRightClickInternal($event)\"\n >\n </ax-scheduler-timeline-month-view>\n }\n @case ('timeline-year') {\n <ax-scheduler-timeline-year-view\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [resources]=\"resources()\"\n [draggable]=\"draggable()\"\n [calendar]=\"calendarType()\"\n [hasActions]=\"hasActions()\"\n [appointments]=\"viewAppointments()\"\n [dragStartDelay]=\"dragStartDelay()\"\n [tooltipTemplate]=\"tooltipTemplate()\"\n [resourceTemplate]=\"resourceTemplate()\"\n [showResourceHeaders]=\"showResourceHeaders()\"\n [showCurrentTimeIndicator]=\"showCurrentTimeIndicator()\"\n [scrollToCurrentTimeIndicator]=\"scrollToCurrentTimeIndicator()\"\n [showUnassignedAppointments]=\"showUnassignedAppointments()\"\n [selectedAppointmentId]=\"selectedAppointmentId()\"\n (onActionClickInternal)=\"onActionClick.emit($event)\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($event)\"\n (onAppointmentDropInternal)=\"handleAppointmentDropInternal($event)\"\n (appointmentClickedInternal)=\"handleAppointmentClickInternal($event)\"\n (appointmentDblClickedInternal)=\"handleAppointmentDblClickInternal($event)\"\n (appointmentRightClickedInternal)=\"handleAppointmentRightClickInternal($event)\"\n >\n </ax-scheduler-timeline-year-view>\n }\n @case ('agenda') {\n <ax-scheduler-agenda-view\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [draggable]=\"draggable()\"\n [calendar]=\"calendarType()\"\n [hasActions]=\"hasActions()\"\n [appointments]=\"viewAppointments()\"\n [dragStartDelay]=\"dragStartDelay()\"\n [daysCount]=\"multiDayViewDaysCount()\"\n [tooltipTemplate]=\"tooltipTemplate()\"\n [selectedAppointmentId]=\"selectedAppointmentId()\"\n (onActionClickInternal)=\"onActionClick.emit($event)\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($event)\"\n (onAppointmentDropInternal)=\"handleAppointmentDropInternal($event)\"\n (appointmentClickedInternal)=\"handleAppointmentClickInternal($event)\"\n (appointmentDblClickedInternal)=\"handleAppointmentDblClickInternal($event)\"\n (appointmentRightClickedInternal)=\"handleAppointmentRightClickInternal($event)\"\n >\n </ax-scheduler-agenda-view>\n }\n }\n </div>\n</div>\n<ng-template #calendarDayCellTemplate let-data>\n @let slot = data.slot;\n <div class=\"flex flex-col items-center justify-between gap-1\">\n <span>{{ slot.text }}</span>\n @if (hasAppointmentsOnDate(slot.date?.date)) {\n <ax-badge color=\"primary\"></ax-badge>\n }\n </div>\n</ng-template>\n<ng-template #calendarMonthCellTemplate let-data>\n @let slot = data.slot;\n <div class=\"flex flex-col items-center justify-between gap-1\">\n <span>{{ slot.text }}</span>\n @if (hasAppointmentsInMonth(slot.date?.date)) {\n <ax-badge color=\"primary\"></ax-badge>\n }\n </div>\n</ng-template>\n<ng-template #calendarYearCellTemplate let-data>\n @let slot = data.slot;\n <div class=\"flex flex-col items-center justify-between gap-1\">\n <span>{{ slot.text }}</span>\n @if (hasAppointmentsInYear(slot.date?.date)) {\n <ax-badge color=\"primary\"></ax-badge>\n }\n </div>\n</ng-template>\n", styles: ["@layer properties;@layer base{:root{--ax-comp-scheduler-width: 57.5rem;--ax-comp-scheduler-basic-view-blocks-height: 3rem;--ax-comp-scheduler-basic-view-blocks-width: 3.5rem;--ax-comp-scheduler-timeline-view-blocks-width: 20rem;--ax-comp-scheduler-timeline-view-blocks-height: 3rem;--ax-comp-scheduler-primary-bg-color: var(--ax-sys-color-primary-lighter-surface);--ax-comp-scheduler-primary-text-color: var(--ax-sys-color-on-primary-lighter-surface);--ax-comp-scheduler-primary-active-border-color: var(--ax-sys-color-primary-500);--ax-comp-scheduler-highest-priority-bg-color: var(--ax-sys-color-danger-surface);--ax-comp-scheduler-highest-priority-text-color: var(--ax-sys-color-on-danger-surface);--ax-comp-scheduler-highest-priority-active-border-color: var(--ax-sys-color-danger-700);--ax-comp-scheduler-high-priority-bg-color: var(--ax-sys-color-danger-lighter-surface);--ax-comp-scheduler-high-priority-text-color: var(--ax-sys-color-on-danger-lighter-surface);--ax-comp-scheduler-high-priority-active-border-color: var(--ax-sys-color-danger-500);--ax-comp-scheduler-medium-priority-bg-color: var(--ax-sys-color-warning-lighter-surface);--ax-comp-scheduler-medium-priority-text-color: var(--ax-sys-color-on-warning-lighter-surface);--ax-comp-scheduler-medium-priority-active-border-color: var(--ax-sys-color-warning-600);--ax-comp-scheduler-low-priority-bg-color: var(--ax-sys-color-success-lighter-surface);--ax-comp-scheduler-low-priority-text-color: var(--ax-sys-color-on-success-lighter-surface);--ax-comp-scheduler-low-priority-active-border-color: var(--ax-sys-color-success-500);--ax-comp-scheduler-lowest-priority-bg-color: var(--ax-sys-color-success-lightest-surface);--ax-comp-scheduler-lowest-priority-text-color: var(--ax-sys-color-on-success-lightest-surface);--ax-comp-scheduler-lowest-priority-active-border-color: var(--ax-sys-color-success-400)}}@layer components{ax-scheduler{display:block;height:100%;width:100%;background-color:inherit;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));-webkit-user-select:none;user-select:none}ax-scheduler .ax-scheduler-primary-priority{color:rgba(var(--ax-comp-scheduler-primary-text-color));background-color:rgba(var(--ax-comp-scheduler-primary-bg-color));border:2px solid transparent}ax-scheduler .ax-scheduler-primary-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-primary-active-border-color));z-index:10}ax-scheduler .ax-scheduler-highest-priority{color:rgba(var(--ax-comp-scheduler-highest-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-highest-priority-bg-color));border:2px solid transparent}ax-scheduler .ax-scheduler-highest-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-highest-priority-active-border-color));z-index:10}ax-scheduler .ax-scheduler-high-priority{color:rgba(var(--ax-comp-scheduler-high-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-high-priority-bg-color));border:2px solid transparent}ax-scheduler .ax-scheduler-high-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-high-priority-active-border-color));z-index:10}ax-scheduler .ax-scheduler-medium-priority{color:rgba(var(--ax-comp-scheduler-medium-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-medium-priority-bg-color));border:2px solid transparent}ax-scheduler .ax-scheduler-medium-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-medium-priority-active-border-color));z-index:10}ax-scheduler .ax-scheduler-low-priority{color:rgba(var(--ax-comp-scheduler-low-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-low-priority-bg-color));border:2px solid transparent}ax-scheduler .ax-scheduler-low-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-low-priority-active-border-color));z-index:10}ax-scheduler .ax-scheduler-lowest-priority{color:rgba(var(--ax-comp-scheduler-lowest-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-lowest-priority-bg-color));border:2px solid transparent}ax-scheduler .ax-scheduler-lowest-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-lowest-priority-active-border-color));z-index:10}ax-scheduler.ax-full-screen-container{position:fixed;inset-inline-start:calc(var(--spacing, .25rem) * 0);top:calc(var(--spacing, .25rem) * 0);z-index:61;height:100vh;width:100vw}ax-scheduler .ax-scheduler-container{display:flex;height:100%;flex-direction:column;overflow:hidden;border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;background-color:inherit}ax-scheduler .ax-scheduler-container .ax-scheduler-header{display:flex;align-items:center;justify-content:space-between;overflow-x:auto;overflow-y:hidden;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;padding:calc(var(--spacing, .25rem) * 4)}ax-scheduler .ax-scheduler-container .ax-scheduler-header .ax-scheduler-date{display:flex;min-width:calc(var(--spacing, .25rem) * 82);align-items:center;justify-content:space-between}ax-scheduler .ax-scheduler-container .ax-scheduler-header .ax-scheduler-date p{margin:calc(var(--spacing, .25rem) * 0);min-width:calc(var(--spacing, .25rem) * 40);text-align:center;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler .ax-scheduler-container .ax-scheduler-actions{display:flex;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 3)}ax-scheduler .ax-scheduler-container .ax-scheduler-truncate{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ax-scheduler .ax-scheduler-container ax-subtitle{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}ax-scheduler .ax-scheduler-container .ax-scheduler-views-container{height:100%;overflow:auto;background-color:inherit}.ax-scheduler-popover{display:grid;max-height:calc(var(--spacing, .25rem) * 40);gap:calc(var(--spacing, .25rem) * 1);overflow:auto;border-radius:var(--radius-lg, .5rem);padding:calc(var(--spacing, .25rem) * 1);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)))}.ax-scheduler-popover .ax-scheduler-primary-priority{color:rgba(var(--ax-comp-scheduler-primary-text-color));background-color:rgba(var(--ax-comp-scheduler-primary-bg-color));border:2px solid transparent}.ax-scheduler-popover .ax-scheduler-primary-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-primary-active-border-color));z-index:10}.ax-scheduler-popover .ax-scheduler-highest-priority{color:rgba(var(--ax-comp-scheduler-highest-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-highest-priority-bg-color));border:2px solid transparent}.ax-scheduler-popover .ax-scheduler-highest-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-highest-priority-active-border-color));z-index:10}.ax-scheduler-popover .ax-scheduler-high-priority{color:rgba(var(--ax-comp-scheduler-high-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-high-priority-bg-color));border:2px solid transparent}.ax-scheduler-popover .ax-scheduler-high-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-high-priority-active-border-color));z-index:10}.ax-scheduler-popover .ax-scheduler-medium-priority{color:rgba(var(--ax-comp-scheduler-medium-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-medium-priority-bg-color));border:2px solid transparent}.ax-scheduler-popover .ax-scheduler-medium-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-medium-priority-active-border-color));z-index:10}.ax-scheduler-popover .ax-scheduler-low-priority{color:rgba(var(--ax-comp-scheduler-low-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-low-priority-bg-color));border:2px solid transparent}.ax-scheduler-popover .ax-scheduler-low-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-low-priority-active-border-color));z-index:10}.ax-scheduler-popover .ax-scheduler-lowest-priority{color:rgba(var(--ax-comp-scheduler-lowest-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-lowest-priority-bg-color));border:2px solid transparent}.ax-scheduler-popover .ax-scheduler-lowest-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-lowest-priority-active-border-color));z-index:10}.ax-scheduler-popover.ax-scheduler-month-popover-appointment,.ax-scheduler-popover.ax-scheduler-timeline-year-popover-appointment{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}.ax-scheduler-popover.ax-scheduler-timeline-year-popover-appointment .ax-scheduler-popover-appointment .ax-appointment-chip-title{margin-bottom:calc(var(--spacing, .25rem) * .5);font-size:.8rem;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.ax-scheduler-popover:not(.ax-state-readonly) .ax-scheduler-popover-appointment{cursor:pointer}.ax-scheduler-popover .ax-scheduler-popover-appointment{display:flex;flex-direction:column;overflow:hidden;border-radius:calc(var(--ax-sys-border-radius) / 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1);-webkit-user-select:none;user-select:none;color:rgba(var(--ax-comp-scheduler-primary-text-color));background-color:rgba(var(--ax-comp-scheduler-primary-bg-color))}.ax-scheduler-popover .ax-scheduler-popover-appointment ax-subtitle{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}.ax-scheduler-popover .ax-scheduler-popover-appointment .ax-scheduler-truncate{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ax-scheduler-popover ax-title,.ax-scheduler-popover .ax-appointment-chip-title{display:flex;justify-content:space-between}:is(.ax-scheduler-popover ax-title,.ax-scheduler-popover .ax-appointment-chip-title) .ax-scheduler-action-icon{width:auto;cursor:pointer}.ax-scheduler-current-time-line{pointer-events:none;position:absolute;z-index:7;background-color:#ef4444;--tw-shadow: 0 0 6px var(--tw-shadow-color, rgba(239,68,68,.8));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ax-scheduler-current-time-line:before{position:absolute;width:calc(var(--spacing, .25rem) * 3);height:calc(var(--spacing, .25rem) * 3);border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:2px;border-color:rgba(var(--ax-sys-color-surface));background-color:#ef4444;--tw-shadow: 0 0 8px var(--tw-shadow-color, rgba(239,68,68,.9));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);--tw-content: \"\";content:var(--tw-content)}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-content{syntax: \"*\"; inherits: false; initial-value: \"\";}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-content: \"\"}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: AXBadgeComponent, selector: "ax-badge", inputs: ["color", "look", "text"] }, { kind: "component", type: AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "component", type: AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disablePanelClass", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "closeOnScroll", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "component", type: AXCalendarComponent, selector: "ax-calendar", inputs: ["rtl", "readonly", "value", "name", "disabled", "depth", "activeView", "minValue", "maxValue", "disabledDates", "holidayDates", "type", "dayCellTemplate", "monthCellTemplate", "yearCellTemplate", "cellClass", "showNavigation", "count", "id", "weekend", "weekdays", "look", "yearRange", "holidays"], outputs: ["onOptionChanged", "valueChange", "onValueChanged", "minValueChange", "maxValueChange", "onBlur", "onFocus", "depthChange", "typeChange", "activeViewChange", "disabledDatesChange", "holidayDatesChange", "onNavigate", "onSlotClick", "countChange"] }, { kind: "component", type: AXSelectBoxComponent, selector: "ax-select-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "multiple", "valueField", "textField", "disabledField", "textTemplate", "selectedItems", "isItemTruncated", "showItemTooltip", "itemHeight", "maxVisibleItems", "dataSource", "minRecordsForSearch", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "dropdownWidth", "searchBoxAutoFocus"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed", "onItemSelected", "onItemClick"] }, { kind: "component", type: AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: AXSchedulerDayViewComponent, selector: "ax-scheduler-day-view", inputs: ["rtl", "readonly", "draggable", "hasActions", "dragStartDelay", "calendar", "date", "endDayHour", "startDayHour", "showCurrentTimeIndicator", "scrollToCurrentTimeIndicator", "appointments", "tooltipTemplate", "selectedAppointmentId"], outputs: ["slotClickedInternal", "slotDblClickedInternal", "slotRightClickedInternal", "appointmentClickedInternal", "appointmentDblClickedInternal", "appointmentRightClickedInternal", "onActionClickInternal", "onAppointmentDropInternal"] }, { kind: "component", type: AXSchedulerWeekViewComponent, selector: "ax-scheduler-week-view", inputs: ["readonly", "draggable", "hasActions", "dragStartDelay", "calendar", "date", "endDayHour", "startDayHour", "showCurrentTimeIndicator", "scrollToCurrentTimeIndicator", "appointments", "tooltipTemplate", "selectedAppointmentId"], outputs: ["slotClickedInternal", "slotDblClickedInternal", "slotRightClickedInternal", "appointmentClickedInternal", "appointmentDblClickedInternal", "appointmentRightClickedInternal", "onActionClickInternal", "onAppointmentDropInternal"] }, { kind: "component", type: AXSchedulerMonthViewComponent, selector: "ax-scheduler-month-view", inputs: ["readonly", "draggable", "hasActions", "dragStartDelay", "calendar", "date", "appointments", "firstDayOfWeek", "selectedAppointmentId", "tooltipTemplate"], outputs: ["slotClickedInternal", "slotDblClickedInternal", "slotRightClickedInternal", "appointmentClickedInternal", "appointmentDblClickedInternal", "appointmentRightClickedInternal", "onActionClickInternal", "onAppointmentDropInternal"] }, { kind: "component", type: AXSchedulerAgendaViewComponent, selector: "ax-scheduler-agenda-view", inputs: ["daysCount", "readonly", "draggable", "hasActions", "dragStartDelay", "calendar", "date", "appointments", "tooltipTemplate", "selectedAppointmentId"], outputs: ["slotClickedInternal", "slotDblClickedInternal", "slotRightClickedInternal", "appointmentClickedInternal", "appointmentDblClickedInternal", "appointmentRightClickedInternal", "onActionClickInternal", "onAppointmentDropInternal"] }, { kind: "component", type: AXSchedulerTimelineDayViewComponent, selector: "ax-scheduler-timeline-day-view", inputs: ["readonly", "draggable", "hasActions", "dragStartDelay", "calendar", "showResourceHeaders", "date", "endDayHour", "selectedAppointmentId", "startDayHour", "showUnassignedAppointments", "resources", "showCurrentTimeIndicator", "scrollToCurrentTimeIndicator", "resourceTemplate", "appointments", "tooltipTemplate"], outputs: ["slotClickedInternal", "slotDblClickedInternal", "slotRightClickedInternal", "appointmentClickedInternal", "appointmentDblClickedInternal", "appointmentRightClickedInternal", "onActionClickInternal", "onAppointmentDropInternal"] }, { kind: "component", type: AXSchedulerTimelineMonthViewComponent, selector: "ax-scheduler-timeline-month-view", inputs: ["readonly", "draggable", "hasActions", "dragStartDelay", "calendar", "showResourceHeaders", "date", "showUnassignedAppointments", "selectedAppointmentId", "resources", "showCurrentTimeIndicator", "scrollToCurrentTimeIndicator", "resourceTemplate", "appointments", "tooltipTemplate"], outputs: ["slotClickedInternal", "slotDblClickedInternal", "slotRightClickedInternal", "appointmentClickedInternal", "appointmentDblClickedInternal", "appointmentRightClickedInternal", "onActionClickInternal", "onAppointmentDropInternal"] }, { kind: "component", type: AXSchedulerTimelineWeeklyViewComponent, selector: "ax-scheduler-timeline-weekly-view", inputs: ["daysCount", "readonly", "draggable", "hasActions", "dragStartDelay", "calendar", "showResourceHeaders", "date", "endDayHour", "selectedAppointmentId", "showCurrentTimeIndicator", "scrollToCurrentTimeIndicator", "startDayHour", "showUnassignedAppointments", "resources", "resourceTemplate", "appointments", "tooltipTemplate"], outputs: ["slotClickedInternal", "slotDblClickedInternal", "slotRightClickedInternal", "appointmentClickedInternal", "appointmentDblClickedInternal", "appointmentRightClickedInternal", "onActionClickInternal", "onAppointmentDropInternal"] }, { kind: "component", type: AXSchedulerTimelineYearViewComponent, selector: "ax-scheduler-timeline-year-view", inputs: ["readonly", "draggable", "hasActions", "dragStartDelay", "calendar", "showResourceHeaders", "date", "showUnassignedAppointments", "selectedAppointmentId", "resources", "showCurrentTimeIndicator", "scrollToCurrentTimeIndicator", "resourceTemplate", "appointments", "tooltipTemplate"], outputs: ["slotClickedInternal", "slotDblClickedInternal", "slotRightClickedInternal", "appointmentClickedInternal", "appointmentDblClickedInternal", "appointmentRightClickedInternal", "onActionClickInternal", "onAppointmentDropInternal"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
5349
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXSchedulerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
5350
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXSchedulerComponent, isStandalone: true, selector: "ax-scheduler", inputs: { calendar: { classPropertyName: "calendar", publicName: "calendar", isSignal: true, isRequired: false, transformFunction: null }, startingDate: { classPropertyName: "startingDate", publicName: "startingDate", isSignal: true, isRequired: false, transformFunction: null }, endDayHour: { classPropertyName: "endDayHour", publicName: "endDayHour", isSignal: true, isRequired: false, transformFunction: null }, startDayHour: { classPropertyName: "startDayHour", publicName: "startDayHour", isSignal: true, isRequired: false, transformFunction: null }, hasHeader: { classPropertyName: "hasHeader", publicName: "hasHeader", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, draggable: { classPropertyName: "draggable", publicName: "draggable", isSignal: true, isRequired: false, transformFunction: null }, hasActions: { classPropertyName: "hasActions", publicName: "hasActions", isSignal: true, isRequired: false, transformFunction: null }, dragStartDelay: { classPropertyName: "dragStartDelay", publicName: "dragStartDelay", isSignal: true, isRequired: false, transformFunction: null }, weekend: { classPropertyName: "weekend", publicName: "weekend", isSignal: true, isRequired: false, transformFunction: null }, allowFullScreen: { classPropertyName: "allowFullScreen", publicName: "allowFullScreen", isSignal: true, isRequired: false, transformFunction: null }, multiDayViewDaysCount: { classPropertyName: "multiDayViewDaysCount", publicName: "multiDayViewDaysCount", isSignal: true, isRequired: false, transformFunction: null }, showResourceHeaders: { classPropertyName: "showResourceHeaders", publicName: "showResourceHeaders", isSignal: true, isRequired: false, transformFunction: null }, showCurrentTimeIndicator: { classPropertyName: "showCurrentTimeIndicator", publicName: "showCurrentTimeIndicator", isSignal: true, isRequired: false, transformFunction: null }, scrollToCurrentTimeIndicator: { classPropertyName: "scrollToCurrentTimeIndicator", publicName: "scrollToCurrentTimeIndicator", isSignal: true, isRequired: false, transformFunction: null }, showUnassignedAppointments: { classPropertyName: "showUnassignedAppointments", publicName: "showUnassignedAppointments", isSignal: true, isRequired: false, transformFunction: null }, resources: { classPropertyName: "resources", publicName: "resources", isSignal: true, isRequired: false, transformFunction: null }, resourceTemplate: { classPropertyName: "resourceTemplate", publicName: "resourceTemplate", isSignal: true, isRequired: false, transformFunction: null }, firstDayOfWeek: { classPropertyName: "firstDayOfWeek", publicName: "firstDayOfWeek", isSignal: true, isRequired: false, transformFunction: null }, tooltipTemplate: { classPropertyName: "tooltipTemplate", publicName: "tooltipTemplate", isSignal: true, isRequired: false, transformFunction: null }, dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: false, transformFunction: null }, holidays: { classPropertyName: "holidays", publicName: "holidays", isSignal: true, isRequired: false, transformFunction: null }, views: { classPropertyName: "views", publicName: "views", isSignal: true, isRequired: false, transformFunction: null }, selectedView: { classPropertyName: "selectedView", publicName: "selectedView", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedView: "selectedViewChange", onDataLoaded: "onDataLoaded", onRangeChanged: "onRangeChanged", onSlotClicked: "onSlotClicked", onSlotDblClicked: "onSlotDblClicked", onSlotRightClick: "onSlotRightClick", onAppointmentDrop: "onAppointmentDrop", onActionClick: "onActionClick", onAppointmentClicked: "onAppointmentClicked", onAppointmentDblClicked: "onAppointmentDblClicked", onAppointmentRightClick: "onAppointmentRightClick" }, host: { properties: { "class.ax-rtl": "rtl()" } }, providers: [AXUnsubscriber, { provide: AXComponent, useExisting: AXSchedulerComponent }], viewQueries: [{ propertyName: "viewModeSelectbox", first: true, predicate: AXSelectBoxComponent, descendants: true, isSignal: true }, { propertyName: "calendarPopover", first: true, predicate: ["calendarPopover"], descendants: true, isSignal: true }, { propertyName: "_calendarDayCellTemplate", first: true, predicate: ["calendarDayCellTemplate"], descendants: true, isSignal: true }, { propertyName: "_calendarMonthCellTemplate", first: true, predicate: ["calendarMonthCellTemplate"], descendants: true, isSignal: true }, { propertyName: "_calendarYearCellTemplate", first: true, predicate: ["calendarYearCellTemplate"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"ax-scheduler-container\">\n @if (hasHeader()) {\n <div class=\"ax-scheduler-header\">\n <div class=\"ax-scheduler-date\">\n <ax-button look=\"blank\" (onClick)=\"prevClick()\">\n <ax-icon\n class=\"ax-icon text-xl\"\n [class.ax-icon-chevron-left]=\"!rtl()\"\n [class.ax-icon-chevron-right]=\"rtl()\"\n ></ax-icon>\n </ax-button>\n <ax-button look=\"blank\" [text]=\"currentDateText()\" #date></ax-button>\n <ax-button look=\"blank\" (onClick)=\"nextClick()\">\n <ax-icon\n class=\"ax-icon text-xl\"\n [class.ax-icon-chevron-right]=\"!rtl()\"\n [class.ax-icon-chevron-left]=\"rtl()\"\n ></ax-icon>\n </ax-button>\n <ax-popover [target]=\"date\" #calendarPopover>\n <ax-calendar\n [type]=\"calendarType()\"\n [depth]=\"calendarDepth()\"\n [ngModel]=\"currentDate()\"\n [dayCellTemplate]=\"calendarDayCellTemplateRef\"\n [monthCellTemplate]=\"calendarMonthCellTemplateRef\"\n [yearCellTemplate]=\"calendarYearCellTemplateRef\"\n (onValueChanged)=\"calendarDateChanged($event)\"\n ></ax-calendar>\n </ax-popover>\n </div>\n <div class=\"ax-scheduler-actions\">\n <ax-select-box\n [dropdownWidth]=\"'200px'\"\n [ngModel]=\"selectedView()\"\n [dataSource]=\"viewsDataSource()\"\n (onValueChanged)=\"viewChanged($event)\"\n ></ax-select-box>\n\n @if (allowFullScreen()) {\n <ax-button look=\"blank\" (onClick)=\"handleFullScreen()\">\n <ax-icon>\n <i class=\"fa-solid\" [class.fa-compress]=\"isFullScreen()\" [class.fa-expand]=\"!isFullScreen()\"></i>\n </ax-icon>\n </ax-button>\n }\n </div>\n </div>\n }\n <div class=\"ax-scheduler-views-container\">\n @switch (selectedView()) {\n @case ('day') {\n <ax-scheduler-day-view\n [rtl]=\"rtl()\"\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [draggable]=\"draggable()\"\n [hasActions]=\"hasActions()\"\n [calendar]=\"calendarType()\"\n [endDayHour]=\"endDayHour()\"\n [startDayHour]=\"startDayHour()\"\n [showCurrentTimeIndicator]=\"showCurrentTimeIndicator()\"\n [scrollToCurrentTimeIndicator]=\"scrollToCurrentTimeIndicator()\"\n [appointments]=\"viewAppointments()\"\n [dragStartDelay]=\"dragStartDelay()\"\n [tooltipTemplate]=\"tooltipTemplate()\"\n [selectedAppointmentId]=\"selectedAppointmentId()\"\n (onActionClickInternal)=\"onActionClick.emit($event)\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($event)\"\n (onAppointmentDropInternal)=\"handleAppointmentDropInternal($event)\"\n (appointmentClickedInternal)=\"handleAppointmentClickInternal($event)\"\n (appointmentDblClickedInternal)=\"handleAppointmentDblClickInternal($event)\"\n (appointmentRightClickedInternal)=\"handleAppointmentRightClickInternal($event)\"\n ></ax-scheduler-day-view>\n }\n @case ('week') {\n <ax-scheduler-week-view\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [draggable]=\"draggable()\"\n [calendar]=\"calendarType()\"\n [endDayHour]=\"endDayHour()\"\n [hasActions]=\"hasActions()\"\n [startDayHour]=\"startDayHour()\"\n [showCurrentTimeIndicator]=\"showCurrentTimeIndicator()\"\n [scrollToCurrentTimeIndicator]=\"scrollToCurrentTimeIndicator()\"\n [appointments]=\"viewAppointments()\"\n [dragStartDelay]=\"dragStartDelay()\"\n [tooltipTemplate]=\"tooltipTemplate()\"\n [selectedAppointmentId]=\"selectedAppointmentId()\"\n (onActionClickInternal)=\"onActionClick.emit($event)\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($event)\"\n (onAppointmentDropInternal)=\"handleAppointmentDropInternal($event)\"\n (appointmentClickedInternal)=\"handleAppointmentClickInternal($event)\"\n (appointmentDblClickedInternal)=\"handleAppointmentDblClickInternal($event)\"\n (appointmentRightClickedInternal)=\"handleAppointmentRightClickInternal($event)\"\n ></ax-scheduler-week-view>\n }\n @case ('month') {\n <ax-scheduler-month-view\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [draggable]=\"draggable()\"\n [calendar]=\"calendarType()\"\n [hasActions]=\"hasActions()\"\n [appointments]=\"viewAppointments()\"\n [firstDayOfWeek]=\"firstDayOfWeek()\"\n [dragStartDelay]=\"dragStartDelay()\"\n [tooltipTemplate]=\"tooltipTemplate()\"\n [selectedAppointmentId]=\"selectedAppointmentId()\"\n (onActionClickInternal)=\"onActionClick.emit($event)\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($event)\"\n (onAppointmentDropInternal)=\"handleAppointmentDropInternal($event)\"\n (appointmentClickedInternal)=\"handleAppointmentClickInternal($event)\"\n (appointmentDblClickedInternal)=\"handleAppointmentDblClickInternal($event)\"\n (appointmentRightClickedInternal)=\"handleAppointmentRightClickInternal($event)\"\n ></ax-scheduler-month-view>\n }\n @case ('timeline-day') {\n <ax-scheduler-timeline-day-view\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [resources]=\"resources()\"\n [draggable]=\"draggable()\"\n [hasActions]=\"hasActions()\"\n [calendar]=\"calendarType()\"\n [endDayHour]=\"endDayHour()\"\n [startDayHour]=\"startDayHour()\"\n [appointments]=\"viewAppointments()\"\n [dragStartDelay]=\"dragStartDelay()\"\n [tooltipTemplate]=\"tooltipTemplate()\"\n [resourceTemplate]=\"resourceTemplate()\"\n [showResourceHeaders]=\"showResourceHeaders()\"\n [showCurrentTimeIndicator]=\"showCurrentTimeIndicator()\"\n [scrollToCurrentTimeIndicator]=\"scrollToCurrentTimeIndicator()\"\n [showUnassignedAppointments]=\"showUnassignedAppointments()\"\n [selectedAppointmentId]=\"selectedAppointmentId()\"\n (onActionClickInternal)=\"onActionClick.emit($event)\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($event)\"\n (onAppointmentDropInternal)=\"handleAppointmentDropInternal($event)\"\n (appointmentClickedInternal)=\"handleAppointmentClickInternal($event)\"\n (appointmentDblClickedInternal)=\"handleAppointmentDblClickInternal($event)\"\n (appointmentRightClickedInternal)=\"handleAppointmentRightClickInternal($event)\"\n >\n </ax-scheduler-timeline-day-view>\n }\n @case ('timeline-weekly') {\n <ax-scheduler-timeline-weekly-view\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [resources]=\"resources()\"\n [draggable]=\"draggable()\"\n [calendar]=\"calendarType()\"\n [endDayHour]=\"endDayHour()\"\n [hasActions]=\"hasActions()\"\n [startDayHour]=\"startDayHour()\"\n [appointments]=\"viewAppointments()\"\n [dragStartDelay]=\"dragStartDelay()\"\n [daysCount]=\"multiDayViewDaysCount()\"\n [tooltipTemplate]=\"tooltipTemplate()\"\n [resourceTemplate]=\"resourceTemplate()\"\n [showResourceHeaders]=\"showResourceHeaders()\"\n [showCurrentTimeIndicator]=\"showCurrentTimeIndicator()\"\n [scrollToCurrentTimeIndicator]=\"scrollToCurrentTimeIndicator()\"\n [showUnassignedAppointments]=\"showUnassignedAppointments()\"\n [selectedAppointmentId]=\"selectedAppointmentId()\"\n (onActionClickInternal)=\"onActionClick.emit($event)\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($event)\"\n (onAppointmentDropInternal)=\"handleAppointmentDropInternal($event)\"\n (appointmentClickedInternal)=\"handleAppointmentClickInternal($event)\"\n (appointmentDblClickedInternal)=\"handleAppointmentDblClickInternal($event)\"\n (appointmentRightClickedInternal)=\"handleAppointmentRightClickInternal($event)\"\n >\n </ax-scheduler-timeline-weekly-view>\n }\n @case ('timeline-month') {\n <ax-scheduler-timeline-month-view\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [resources]=\"resources()\"\n [draggable]=\"draggable()\"\n [calendar]=\"calendarType()\"\n [hasActions]=\"hasActions()\"\n [appointments]=\"viewAppointments()\"\n [dragStartDelay]=\"dragStartDelay()\"\n [tooltipTemplate]=\"tooltipTemplate()\"\n [resourceTemplate]=\"resourceTemplate()\"\n [showResourceHeaders]=\"showResourceHeaders()\"\n [showCurrentTimeIndicator]=\"showCurrentTimeIndicator()\"\n [scrollToCurrentTimeIndicator]=\"scrollToCurrentTimeIndicator()\"\n [showUnassignedAppointments]=\"showUnassignedAppointments()\"\n [selectedAppointmentId]=\"selectedAppointmentId()\"\n (onActionClickInternal)=\"onActionClick.emit($event)\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($event)\"\n (onAppointmentDropInternal)=\"handleAppointmentDropInternal($event)\"\n (appointmentClickedInternal)=\"handleAppointmentClickInternal($event)\"\n (appointmentDblClickedInternal)=\"handleAppointmentDblClickInternal($event)\"\n (appointmentRightClickedInternal)=\"handleAppointmentRightClickInternal($event)\"\n >\n </ax-scheduler-timeline-month-view>\n }\n @case ('timeline-year') {\n <ax-scheduler-timeline-year-view\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [resources]=\"resources()\"\n [draggable]=\"draggable()\"\n [calendar]=\"calendarType()\"\n [hasActions]=\"hasActions()\"\n [appointments]=\"viewAppointments()\"\n [dragStartDelay]=\"dragStartDelay()\"\n [tooltipTemplate]=\"tooltipTemplate()\"\n [resourceTemplate]=\"resourceTemplate()\"\n [showResourceHeaders]=\"showResourceHeaders()\"\n [showCurrentTimeIndicator]=\"showCurrentTimeIndicator()\"\n [scrollToCurrentTimeIndicator]=\"scrollToCurrentTimeIndicator()\"\n [showUnassignedAppointments]=\"showUnassignedAppointments()\"\n [selectedAppointmentId]=\"selectedAppointmentId()\"\n (onActionClickInternal)=\"onActionClick.emit($event)\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($event)\"\n (onAppointmentDropInternal)=\"handleAppointmentDropInternal($event)\"\n (appointmentClickedInternal)=\"handleAppointmentClickInternal($event)\"\n (appointmentDblClickedInternal)=\"handleAppointmentDblClickInternal($event)\"\n (appointmentRightClickedInternal)=\"handleAppointmentRightClickInternal($event)\"\n >\n </ax-scheduler-timeline-year-view>\n }\n @case ('agenda') {\n <ax-scheduler-agenda-view\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [draggable]=\"draggable()\"\n [calendar]=\"calendarType()\"\n [hasActions]=\"hasActions()\"\n [appointments]=\"viewAppointments()\"\n [dragStartDelay]=\"dragStartDelay()\"\n [daysCount]=\"multiDayViewDaysCount()\"\n [tooltipTemplate]=\"tooltipTemplate()\"\n [selectedAppointmentId]=\"selectedAppointmentId()\"\n (onActionClickInternal)=\"onActionClick.emit($event)\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($event)\"\n (onAppointmentDropInternal)=\"handleAppointmentDropInternal($event)\"\n (appointmentClickedInternal)=\"handleAppointmentClickInternal($event)\"\n (appointmentDblClickedInternal)=\"handleAppointmentDblClickInternal($event)\"\n (appointmentRightClickedInternal)=\"handleAppointmentRightClickInternal($event)\"\n >\n </ax-scheduler-agenda-view>\n }\n }\n </div>\n</div>\n<ng-template #calendarDayCellTemplate let-data>\n @let slot = data.slot;\n <div class=\"flex flex-col items-center justify-between gap-1\">\n <span>{{ slot.text }}</span>\n @if (hasAppointmentsOnDate($safeNavigationMigration(slot.date?.date))) {\n <ax-badge color=\"primary\"></ax-badge>\n }\n </div>\n</ng-template>\n<ng-template #calendarMonthCellTemplate let-data>\n @let slot = data.slot;\n <div class=\"flex flex-col items-center justify-between gap-1\">\n <span>{{ slot.text }}</span>\n @if (hasAppointmentsInMonth($safeNavigationMigration(slot.date?.date))) {\n <ax-badge color=\"primary\"></ax-badge>\n }\n </div>\n</ng-template>\n<ng-template #calendarYearCellTemplate let-data>\n @let slot = data.slot;\n <div class=\"flex flex-col items-center justify-between gap-1\">\n <span>{{ slot.text }}</span>\n @if (hasAppointmentsInYear($safeNavigationMigration(slot.date?.date))) {\n <ax-badge color=\"primary\"></ax-badge>\n }\n </div>\n</ng-template>\n", styles: ["@layer properties;@layer base{:root{--ax-comp-scheduler-width: 57.5rem;--ax-comp-scheduler-basic-view-blocks-height: 3rem;--ax-comp-scheduler-basic-view-blocks-width: 3.5rem;--ax-comp-scheduler-timeline-view-blocks-width: 20rem;--ax-comp-scheduler-timeline-view-blocks-height: 3rem;--ax-comp-scheduler-primary-bg-color: var(--ax-sys-color-primary-lighter-surface);--ax-comp-scheduler-primary-text-color: var(--ax-sys-color-on-primary-lighter-surface);--ax-comp-scheduler-primary-active-border-color: var(--ax-sys-color-primary-500);--ax-comp-scheduler-highest-priority-bg-color: var(--ax-sys-color-danger-surface);--ax-comp-scheduler-highest-priority-text-color: var(--ax-sys-color-on-danger-surface);--ax-comp-scheduler-highest-priority-active-border-color: var(--ax-sys-color-danger-700);--ax-comp-scheduler-high-priority-bg-color: var(--ax-sys-color-danger-lighter-surface);--ax-comp-scheduler-high-priority-text-color: var(--ax-sys-color-on-danger-lighter-surface);--ax-comp-scheduler-high-priority-active-border-color: var(--ax-sys-color-danger-500);--ax-comp-scheduler-medium-priority-bg-color: var(--ax-sys-color-warning-lighter-surface);--ax-comp-scheduler-medium-priority-text-color: var(--ax-sys-color-on-warning-lighter-surface);--ax-comp-scheduler-medium-priority-active-border-color: var(--ax-sys-color-warning-600);--ax-comp-scheduler-low-priority-bg-color: var(--ax-sys-color-success-lighter-surface);--ax-comp-scheduler-low-priority-text-color: var(--ax-sys-color-on-success-lighter-surface);--ax-comp-scheduler-low-priority-active-border-color: var(--ax-sys-color-success-500);--ax-comp-scheduler-lowest-priority-bg-color: var(--ax-sys-color-success-lightest-surface);--ax-comp-scheduler-lowest-priority-text-color: var(--ax-sys-color-on-success-lightest-surface);--ax-comp-scheduler-lowest-priority-active-border-color: var(--ax-sys-color-success-400)}}@layer components{ax-scheduler{display:block;height:100%;width:100%;background-color:inherit;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));-webkit-user-select:none;user-select:none}ax-scheduler .ax-scheduler-primary-priority{color:rgba(var(--ax-comp-scheduler-primary-text-color));background-color:rgba(var(--ax-comp-scheduler-primary-bg-color));border:2px solid transparent}ax-scheduler .ax-scheduler-primary-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-primary-active-border-color));z-index:10}ax-scheduler .ax-scheduler-highest-priority{color:rgba(var(--ax-comp-scheduler-highest-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-highest-priority-bg-color));border:2px solid transparent}ax-scheduler .ax-scheduler-highest-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-highest-priority-active-border-color));z-index:10}ax-scheduler .ax-scheduler-high-priority{color:rgba(var(--ax-comp-scheduler-high-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-high-priority-bg-color));border:2px solid transparent}ax-scheduler .ax-scheduler-high-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-high-priority-active-border-color));z-index:10}ax-scheduler .ax-scheduler-medium-priority{color:rgba(var(--ax-comp-scheduler-medium-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-medium-priority-bg-color));border:2px solid transparent}ax-scheduler .ax-scheduler-medium-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-medium-priority-active-border-color));z-index:10}ax-scheduler .ax-scheduler-low-priority{color:rgba(var(--ax-comp-scheduler-low-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-low-priority-bg-color));border:2px solid transparent}ax-scheduler .ax-scheduler-low-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-low-priority-active-border-color));z-index:10}ax-scheduler .ax-scheduler-lowest-priority{color:rgba(var(--ax-comp-scheduler-lowest-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-lowest-priority-bg-color));border:2px solid transparent}ax-scheduler .ax-scheduler-lowest-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-lowest-priority-active-border-color));z-index:10}ax-scheduler.ax-full-screen-container{position:fixed;inset-inline-start:calc(var(--spacing, .25rem) * 0);top:calc(var(--spacing, .25rem) * 0);z-index:61;height:100vh;width:100vw}ax-scheduler .ax-scheduler-container{display:flex;height:100%;flex-direction:column;overflow:hidden;border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;background-color:inherit}ax-scheduler .ax-scheduler-container .ax-scheduler-header{display:flex;align-items:center;justify-content:space-between;overflow-x:auto;overflow-y:hidden;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;padding:calc(var(--spacing, .25rem) * 4)}ax-scheduler .ax-scheduler-container .ax-scheduler-header .ax-scheduler-date{display:flex;min-width:calc(var(--spacing, .25rem) * 82);align-items:center;justify-content:space-between}ax-scheduler .ax-scheduler-container .ax-scheduler-header .ax-scheduler-date p{margin:calc(var(--spacing, .25rem) * 0);min-width:calc(var(--spacing, .25rem) * 40);text-align:center;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler .ax-scheduler-container .ax-scheduler-actions{display:flex;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 3)}ax-scheduler .ax-scheduler-container .ax-scheduler-truncate{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ax-scheduler .ax-scheduler-container ax-subtitle{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}ax-scheduler .ax-scheduler-container .ax-scheduler-views-container{height:100%;overflow:auto;background-color:inherit}.ax-scheduler-popover{display:grid;max-height:calc(var(--spacing, .25rem) * 40);gap:calc(var(--spacing, .25rem) * 1);overflow:auto;border-radius:var(--radius-lg, .5rem);padding:calc(var(--spacing, .25rem) * 1);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)))}.ax-scheduler-popover .ax-scheduler-primary-priority{color:rgba(var(--ax-comp-scheduler-primary-text-color));background-color:rgba(var(--ax-comp-scheduler-primary-bg-color));border:2px solid transparent}.ax-scheduler-popover .ax-scheduler-primary-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-primary-active-border-color));z-index:10}.ax-scheduler-popover .ax-scheduler-highest-priority{color:rgba(var(--ax-comp-scheduler-highest-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-highest-priority-bg-color));border:2px solid transparent}.ax-scheduler-popover .ax-scheduler-highest-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-highest-priority-active-border-color));z-index:10}.ax-scheduler-popover .ax-scheduler-high-priority{color:rgba(var(--ax-comp-scheduler-high-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-high-priority-bg-color));border:2px solid transparent}.ax-scheduler-popover .ax-scheduler-high-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-high-priority-active-border-color));z-index:10}.ax-scheduler-popover .ax-scheduler-medium-priority{color:rgba(var(--ax-comp-scheduler-medium-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-medium-priority-bg-color));border:2px solid transparent}.ax-scheduler-popover .ax-scheduler-medium-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-medium-priority-active-border-color));z-index:10}.ax-scheduler-popover .ax-scheduler-low-priority{color:rgba(var(--ax-comp-scheduler-low-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-low-priority-bg-color));border:2px solid transparent}.ax-scheduler-popover .ax-scheduler-low-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-low-priority-active-border-color));z-index:10}.ax-scheduler-popover .ax-scheduler-lowest-priority{color:rgba(var(--ax-comp-scheduler-lowest-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-lowest-priority-bg-color));border:2px solid transparent}.ax-scheduler-popover .ax-scheduler-lowest-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-lowest-priority-active-border-color));z-index:10}.ax-scheduler-popover.ax-scheduler-month-popover-appointment,.ax-scheduler-popover.ax-scheduler-timeline-year-popover-appointment{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}.ax-scheduler-popover.ax-scheduler-timeline-year-popover-appointment .ax-scheduler-popover-appointment .ax-appointment-chip-title{margin-bottom:calc(var(--spacing, .25rem) * .5);font-size:.8rem;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.ax-scheduler-popover:not(.ax-state-readonly) .ax-scheduler-popover-appointment{cursor:pointer}.ax-scheduler-popover .ax-scheduler-popover-appointment{display:flex;flex-direction:column;overflow:hidden;border-radius:calc(var(--ax-sys-border-radius) / 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1);-webkit-user-select:none;user-select:none;color:rgba(var(--ax-comp-scheduler-primary-text-color));background-color:rgba(var(--ax-comp-scheduler-primary-bg-color))}.ax-scheduler-popover .ax-scheduler-popover-appointment ax-subtitle{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}.ax-scheduler-popover .ax-scheduler-popover-appointment .ax-scheduler-truncate{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ax-scheduler-popover ax-title,.ax-scheduler-popover .ax-appointment-chip-title{display:flex;justify-content:space-between}:is(.ax-scheduler-popover ax-title,.ax-scheduler-popover .ax-appointment-chip-title) .ax-scheduler-action-icon{width:auto;cursor:pointer}.ax-scheduler-current-time-line{pointer-events:none;position:absolute;z-index:7;background-color:#ef4444;--tw-shadow: 0 0 6px var(--tw-shadow-color, rgba(239,68,68,.8));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ax-scheduler-current-time-line:before{position:absolute;width:calc(var(--spacing, .25rem) * 3);height:calc(var(--spacing, .25rem) * 3);border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:2px;border-color:rgba(var(--ax-sys-color-surface));background-color:#ef4444;--tw-shadow: 0 0 8px var(--tw-shadow-color, rgba(239,68,68,.9));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);--tw-content: \"\";content:var(--tw-content)}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-content{syntax: \"*\"; inherits: false; initial-value: \"\";}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-content: \"\"}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: AXBadgeComponent, selector: "ax-badge", inputs: ["color", "look", "text"] }, { kind: "component", type: AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "component", type: AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disablePanelClass", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "closeOnScroll", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "component", type: AXCalendarComponent, selector: "ax-calendar", inputs: ["rtl", "readonly", "value", "name", "disabled", "depth", "activeView", "minValue", "maxValue", "disabledDates", "holidayDates", "type", "dayCellTemplate", "monthCellTemplate", "yearCellTemplate", "cellClass", "showNavigation", "count", "id", "weekend", "weekdays", "look", "yearRange", "holidays"], outputs: ["onOptionChanged", "valueChange", "onValueChanged", "minValueChange", "maxValueChange", "onBlur", "onFocus", "depthChange", "typeChange", "activeViewChange", "disabledDatesChange", "holidayDatesChange", "onNavigate", "onSlotClick", "countChange"] }, { kind: "component", type: AXSelectBoxComponent, selector: "ax-select-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "multiple", "valueField", "textField", "disabledField", "textTemplate", "selectedItems", "isItemTruncated", "showItemTooltip", "itemHeight", "maxVisibleItems", "dataSource", "minRecordsForSearch", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "dropdownWidth", "searchBoxAutoFocus"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed", "onItemSelected", "onItemClick"] }, { kind: "component", type: AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: AXSchedulerDayViewComponent, selector: "ax-scheduler-day-view", inputs: ["rtl", "readonly", "draggable", "hasActions", "dragStartDelay", "calendar", "date", "endDayHour", "startDayHour", "showCurrentTimeIndicator", "scrollToCurrentTimeIndicator", "appointments", "tooltipTemplate", "selectedAppointmentId"], outputs: ["slotClickedInternal", "slotDblClickedInternal", "slotRightClickedInternal", "appointmentClickedInternal", "appointmentDblClickedInternal", "appointmentRightClickedInternal", "onActionClickInternal", "onAppointmentDropInternal"] }, { kind: "component", type: AXSchedulerWeekViewComponent, selector: "ax-scheduler-week-view", inputs: ["readonly", "draggable", "hasActions", "dragStartDelay", "calendar", "date", "endDayHour", "startDayHour", "showCurrentTimeIndicator", "scrollToCurrentTimeIndicator", "appointments", "tooltipTemplate", "selectedAppointmentId"], outputs: ["slotClickedInternal", "slotDblClickedInternal", "slotRightClickedInternal", "appointmentClickedInternal", "appointmentDblClickedInternal", "appointmentRightClickedInternal", "onActionClickInternal", "onAppointmentDropInternal"] }, { kind: "component", type: AXSchedulerMonthViewComponent, selector: "ax-scheduler-month-view", inputs: ["readonly", "draggable", "hasActions", "dragStartDelay", "calendar", "date", "appointments", "firstDayOfWeek", "selectedAppointmentId", "tooltipTemplate"], outputs: ["slotClickedInternal", "slotDblClickedInternal", "slotRightClickedInternal", "appointmentClickedInternal", "appointmentDblClickedInternal", "appointmentRightClickedInternal", "onActionClickInternal", "onAppointmentDropInternal"] }, { kind: "component", type: AXSchedulerAgendaViewComponent, selector: "ax-scheduler-agenda-view", inputs: ["daysCount", "readonly", "draggable", "hasActions", "dragStartDelay", "calendar", "date", "appointments", "tooltipTemplate", "selectedAppointmentId"], outputs: ["slotClickedInternal", "slotDblClickedInternal", "slotRightClickedInternal", "appointmentClickedInternal", "appointmentDblClickedInternal", "appointmentRightClickedInternal", "onActionClickInternal", "onAppointmentDropInternal"] }, { kind: "component", type: AXSchedulerTimelineDayViewComponent, selector: "ax-scheduler-timeline-day-view", inputs: ["readonly", "draggable", "hasActions", "dragStartDelay", "calendar", "showResourceHeaders", "date", "endDayHour", "selectedAppointmentId", "startDayHour", "showUnassignedAppointments", "resources", "showCurrentTimeIndicator", "scrollToCurrentTimeIndicator", "resourceTemplate", "appointments", "tooltipTemplate"], outputs: ["slotClickedInternal", "slotDblClickedInternal", "slotRightClickedInternal", "appointmentClickedInternal", "appointmentDblClickedInternal", "appointmentRightClickedInternal", "onActionClickInternal", "onAppointmentDropInternal"] }, { kind: "component", type: AXSchedulerTimelineMonthViewComponent, selector: "ax-scheduler-timeline-month-view", inputs: ["readonly", "draggable", "hasActions", "dragStartDelay", "calendar", "showResourceHeaders", "date", "showUnassignedAppointments", "selectedAppointmentId", "resources", "showCurrentTimeIndicator", "scrollToCurrentTimeIndicator", "resourceTemplate", "appointments", "tooltipTemplate"], outputs: ["slotClickedInternal", "slotDblClickedInternal", "slotRightClickedInternal", "appointmentClickedInternal", "appointmentDblClickedInternal", "appointmentRightClickedInternal", "onActionClickInternal", "onAppointmentDropInternal"] }, { kind: "component", type: AXSchedulerTimelineWeeklyViewComponent, selector: "ax-scheduler-timeline-weekly-view", inputs: ["daysCount", "readonly", "draggable", "hasActions", "dragStartDelay", "calendar", "showResourceHeaders", "date", "endDayHour", "selectedAppointmentId", "showCurrentTimeIndicator", "scrollToCurrentTimeIndicator", "startDayHour", "showUnassignedAppointments", "resources", "resourceTemplate", "appointments", "tooltipTemplate"], outputs: ["slotClickedInternal", "slotDblClickedInternal", "slotRightClickedInternal", "appointmentClickedInternal", "appointmentDblClickedInternal", "appointmentRightClickedInternal", "onActionClickInternal", "onAppointmentDropInternal"] }, { kind: "component", type: AXSchedulerTimelineYearViewComponent, selector: "ax-scheduler-timeline-year-view", inputs: ["readonly", "draggable", "hasActions", "dragStartDelay", "calendar", "showResourceHeaders", "date", "showUnassignedAppointments", "selectedAppointmentId", "resources", "showCurrentTimeIndicator", "scrollToCurrentTimeIndicator", "resourceTemplate", "appointments", "tooltipTemplate"], outputs: ["slotClickedInternal", "slotDblClickedInternal", "slotRightClickedInternal", "appointmentClickedInternal", "appointmentDblClickedInternal", "appointmentRightClickedInternal", "onActionClickInternal", "onAppointmentDropInternal"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
5122
5351
|
}
|
|
5123
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
5352
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXSchedulerComponent, decorators: [{
|
|
5124
5353
|
type: Component,
|
|
5125
|
-
args: [{ selector: 'ax-scheduler',
|
|
5354
|
+
args: [{ selector: 'ax-scheduler', encapsulation: ViewEncapsulation.None, host: {
|
|
5126
5355
|
'[class.ax-rtl]': 'rtl()',
|
|
5127
5356
|
}, imports: [
|
|
5128
5357
|
FormsModule,
|
|
@@ -5140,7 +5369,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
|
|
|
5140
5369
|
AXSchedulerTimelineMonthViewComponent,
|
|
5141
5370
|
AXSchedulerTimelineWeeklyViewComponent,
|
|
5142
5371
|
AXSchedulerTimelineYearViewComponent,
|
|
5143
|
-
], providers: [AXUnsubscriber, { provide: AXComponent, useExisting: AXSchedulerComponent }], template: "<div class=\"ax-scheduler-container\">\n @if (hasHeader()) {\n <div class=\"ax-scheduler-header\">\n <div class=\"ax-scheduler-date\">\n <ax-button look=\"blank\" (onClick)=\"prevClick()\">\n <ax-icon\n class=\"ax-icon text-xl\"\n [class.ax-icon-chevron-left]=\"!rtl()\"\n [class.ax-icon-chevron-right]=\"rtl()\"\n ></ax-icon>\n </ax-button>\n <ax-button look=\"blank\" [text]=\"currentDateText()\" #date></ax-button>\n <ax-button look=\"blank\" (onClick)=\"nextClick()\">\n <ax-icon\n class=\"ax-icon text-xl\"\n [class.ax-icon-chevron-right]=\"!rtl()\"\n [class.ax-icon-chevron-left]=\"rtl()\"\n ></ax-icon>\n </ax-button>\n <ax-popover [target]=\"date\" #calendarPopover>\n <ax-calendar\n [type]=\"calendarType()\"\n [depth]=\"calendarDepth()\"\n [ngModel]=\"currentDate()\"\n [dayCellTemplate]=\"calendarDayCellTemplateRef\"\n [monthCellTemplate]=\"calendarMonthCellTemplateRef\"\n [yearCellTemplate]=\"calendarYearCellTemplateRef\"\n (onValueChanged)=\"calendarDateChanged($event)\"\n ></ax-calendar>\n </ax-popover>\n </div>\n <div class=\"ax-scheduler-actions\">\n <ax-select-box\n [dropdownWidth]=\"'200px'\"\n [ngModel]=\"selectedView()\"\n [dataSource]=\"viewsDataSource()\"\n (onValueChanged)=\"viewChanged($event)\"\n ></ax-select-box>\n\n @if (allowFullScreen()) {\n <ax-button look=\"blank\" (onClick)=\"handleFullScreen()\">\n <ax-icon>\n <i class=\"fa-solid\" [class.fa-compress]=\"isFullScreen()\" [class.fa-expand]=\"!isFullScreen()\"></i>\n </ax-icon>\n </ax-button>\n }\n </div>\n </div>\n }\n <div class=\"ax-scheduler-views-container\">\n @switch (selectedView()) {\n @case ('day') {\n <ax-scheduler-day-view\n [rtl]=\"rtl()\"\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [draggable]=\"draggable()\"\n [hasActions]=\"hasActions()\"\n [calendar]=\"calendarType()\"\n [endDayHour]=\"endDayHour()\"\n [startDayHour]=\"startDayHour()\"\n [showCurrentTimeIndicator]=\"showCurrentTimeIndicator()\"\n [scrollToCurrentTimeIndicator]=\"scrollToCurrentTimeIndicator()\"\n [appointments]=\"viewAppointments()\"\n [dragStartDelay]=\"dragStartDelay()\"\n [tooltipTemplate]=\"tooltipTemplate()\"\n [selectedAppointmentId]=\"selectedAppointmentId()\"\n (onActionClickInternal)=\"onActionClick.emit($event)\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($event)\"\n (onAppointmentDropInternal)=\"handleAppointmentDropInternal($event)\"\n (appointmentClickedInternal)=\"handleAppointmentClickInternal($event)\"\n (appointmentDblClickedInternal)=\"handleAppointmentDblClickInternal($event)\"\n (appointmentRightClickedInternal)=\"handleAppointmentRightClickInternal($event)\"\n ></ax-scheduler-day-view>\n }\n @case ('week') {\n <ax-scheduler-week-view\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [draggable]=\"draggable()\"\n [calendar]=\"calendarType()\"\n [endDayHour]=\"endDayHour()\"\n [hasActions]=\"hasActions()\"\n [startDayHour]=\"startDayHour()\"\n [showCurrentTimeIndicator]=\"showCurrentTimeIndicator()\"\n [scrollToCurrentTimeIndicator]=\"scrollToCurrentTimeIndicator()\"\n [appointments]=\"viewAppointments()\"\n [dragStartDelay]=\"dragStartDelay()\"\n [tooltipTemplate]=\"tooltipTemplate()\"\n [selectedAppointmentId]=\"selectedAppointmentId()\"\n (onActionClickInternal)=\"onActionClick.emit($event)\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($event)\"\n (onAppointmentDropInternal)=\"handleAppointmentDropInternal($event)\"\n (appointmentClickedInternal)=\"handleAppointmentClickInternal($event)\"\n (appointmentDblClickedInternal)=\"handleAppointmentDblClickInternal($event)\"\n (appointmentRightClickedInternal)=\"handleAppointmentRightClickInternal($event)\"\n ></ax-scheduler-week-view>\n }\n @case ('month') {\n <ax-scheduler-month-view\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [draggable]=\"draggable()\"\n [calendar]=\"calendarType()\"\n [hasActions]=\"hasActions()\"\n [appointments]=\"viewAppointments()\"\n [firstDayOfWeek]=\"firstDayOfWeek()\"\n [dragStartDelay]=\"dragStartDelay()\"\n [tooltipTemplate]=\"tooltipTemplate()\"\n [selectedAppointmentId]=\"selectedAppointmentId()\"\n (onActionClickInternal)=\"onActionClick.emit($event)\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($event)\"\n (onAppointmentDropInternal)=\"handleAppointmentDropInternal($event)\"\n (appointmentClickedInternal)=\"handleAppointmentClickInternal($event)\"\n (appointmentDblClickedInternal)=\"handleAppointmentDblClickInternal($event)\"\n (appointmentRightClickedInternal)=\"handleAppointmentRightClickInternal($event)\"\n ></ax-scheduler-month-view>\n }\n @case ('timeline-day') {\n <ax-scheduler-timeline-day-view\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [resources]=\"resources()\"\n [draggable]=\"draggable()\"\n [hasActions]=\"hasActions()\"\n [calendar]=\"calendarType()\"\n [endDayHour]=\"endDayHour()\"\n [startDayHour]=\"startDayHour()\"\n [appointments]=\"viewAppointments()\"\n [dragStartDelay]=\"dragStartDelay()\"\n [tooltipTemplate]=\"tooltipTemplate()\"\n [resourceTemplate]=\"resourceTemplate()\"\n [showResourceHeaders]=\"showResourceHeaders()\"\n [showCurrentTimeIndicator]=\"showCurrentTimeIndicator()\"\n [scrollToCurrentTimeIndicator]=\"scrollToCurrentTimeIndicator()\"\n [showUnassignedAppointments]=\"showUnassignedAppointments()\"\n [selectedAppointmentId]=\"selectedAppointmentId()\"\n (onActionClickInternal)=\"onActionClick.emit($event)\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($event)\"\n (onAppointmentDropInternal)=\"handleAppointmentDropInternal($event)\"\n (appointmentClickedInternal)=\"handleAppointmentClickInternal($event)\"\n (appointmentDblClickedInternal)=\"handleAppointmentDblClickInternal($event)\"\n (appointmentRightClickedInternal)=\"handleAppointmentRightClickInternal($event)\"\n >\n </ax-scheduler-timeline-day-view>\n }\n @case ('timeline-weekly') {\n <ax-scheduler-timeline-weekly-view\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [resources]=\"resources()\"\n [draggable]=\"draggable()\"\n [calendar]=\"calendarType()\"\n [endDayHour]=\"endDayHour()\"\n [hasActions]=\"hasActions()\"\n [startDayHour]=\"startDayHour()\"\n [appointments]=\"viewAppointments()\"\n [dragStartDelay]=\"dragStartDelay()\"\n [daysCount]=\"multiDayViewDaysCount()\"\n [tooltipTemplate]=\"tooltipTemplate()\"\n [resourceTemplate]=\"resourceTemplate()\"\n [showResourceHeaders]=\"showResourceHeaders()\"\n [showCurrentTimeIndicator]=\"showCurrentTimeIndicator()\"\n [scrollToCurrentTimeIndicator]=\"scrollToCurrentTimeIndicator()\"\n [showUnassignedAppointments]=\"showUnassignedAppointments()\"\n [selectedAppointmentId]=\"selectedAppointmentId()\"\n (onActionClickInternal)=\"onActionClick.emit($event)\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($event)\"\n (onAppointmentDropInternal)=\"handleAppointmentDropInternal($event)\"\n (appointmentClickedInternal)=\"handleAppointmentClickInternal($event)\"\n (appointmentDblClickedInternal)=\"handleAppointmentDblClickInternal($event)\"\n (appointmentRightClickedInternal)=\"handleAppointmentRightClickInternal($event)\"\n >\n </ax-scheduler-timeline-weekly-view>\n }\n @case ('timeline-month') {\n <ax-scheduler-timeline-month-view\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [resources]=\"resources()\"\n [draggable]=\"draggable()\"\n [calendar]=\"calendarType()\"\n [hasActions]=\"hasActions()\"\n [appointments]=\"viewAppointments()\"\n [dragStartDelay]=\"dragStartDelay()\"\n [tooltipTemplate]=\"tooltipTemplate()\"\n [resourceTemplate]=\"resourceTemplate()\"\n [showResourceHeaders]=\"showResourceHeaders()\"\n [showCurrentTimeIndicator]=\"showCurrentTimeIndicator()\"\n [scrollToCurrentTimeIndicator]=\"scrollToCurrentTimeIndicator()\"\n [showUnassignedAppointments]=\"showUnassignedAppointments()\"\n [selectedAppointmentId]=\"selectedAppointmentId()\"\n (onActionClickInternal)=\"onActionClick.emit($event)\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($event)\"\n (onAppointmentDropInternal)=\"handleAppointmentDropInternal($event)\"\n (appointmentClickedInternal)=\"handleAppointmentClickInternal($event)\"\n (appointmentDblClickedInternal)=\"handleAppointmentDblClickInternal($event)\"\n (appointmentRightClickedInternal)=\"handleAppointmentRightClickInternal($event)\"\n >\n </ax-scheduler-timeline-month-view>\n }\n @case ('timeline-year') {\n <ax-scheduler-timeline-year-view\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [resources]=\"resources()\"\n [draggable]=\"draggable()\"\n [calendar]=\"calendarType()\"\n [hasActions]=\"hasActions()\"\n [appointments]=\"viewAppointments()\"\n [dragStartDelay]=\"dragStartDelay()\"\n [tooltipTemplate]=\"tooltipTemplate()\"\n [resourceTemplate]=\"resourceTemplate()\"\n [showResourceHeaders]=\"showResourceHeaders()\"\n [showCurrentTimeIndicator]=\"showCurrentTimeIndicator()\"\n [scrollToCurrentTimeIndicator]=\"scrollToCurrentTimeIndicator()\"\n [showUnassignedAppointments]=\"showUnassignedAppointments()\"\n [selectedAppointmentId]=\"selectedAppointmentId()\"\n (onActionClickInternal)=\"onActionClick.emit($event)\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($event)\"\n (onAppointmentDropInternal)=\"handleAppointmentDropInternal($event)\"\n (appointmentClickedInternal)=\"handleAppointmentClickInternal($event)\"\n (appointmentDblClickedInternal)=\"handleAppointmentDblClickInternal($event)\"\n (appointmentRightClickedInternal)=\"handleAppointmentRightClickInternal($event)\"\n >\n </ax-scheduler-timeline-year-view>\n }\n @case ('agenda') {\n <ax-scheduler-agenda-view\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [draggable]=\"draggable()\"\n [calendar]=\"calendarType()\"\n [hasActions]=\"hasActions()\"\n [appointments]=\"viewAppointments()\"\n [dragStartDelay]=\"dragStartDelay()\"\n [daysCount]=\"multiDayViewDaysCount()\"\n [tooltipTemplate]=\"tooltipTemplate()\"\n [selectedAppointmentId]=\"selectedAppointmentId()\"\n (onActionClickInternal)=\"onActionClick.emit($event)\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($event)\"\n (onAppointmentDropInternal)=\"handleAppointmentDropInternal($event)\"\n (appointmentClickedInternal)=\"handleAppointmentClickInternal($event)\"\n (appointmentDblClickedInternal)=\"handleAppointmentDblClickInternal($event)\"\n (appointmentRightClickedInternal)=\"handleAppointmentRightClickInternal($event)\"\n >\n </ax-scheduler-agenda-view>\n }\n }\n </div>\n</div>\n<ng-template #calendarDayCellTemplate let-data>\n @let slot = data.slot;\n <div class=\"flex flex-col items-center justify-between gap-1\">\n <span>{{ slot.text }}</span>\n @if (hasAppointmentsOnDate(slot.date?.date)) {\n <ax-badge color=\"primary\"></ax-badge>\n }\n </div>\n</ng-template>\n<ng-template #calendarMonthCellTemplate let-data>\n @let slot = data.slot;\n <div class=\"flex flex-col items-center justify-between gap-1\">\n <span>{{ slot.text }}</span>\n @if (hasAppointmentsInMonth(slot.date?.date)) {\n <ax-badge color=\"primary\"></ax-badge>\n }\n </div>\n</ng-template>\n<ng-template #calendarYearCellTemplate let-data>\n @let slot = data.slot;\n <div class=\"flex flex-col items-center justify-between gap-1\">\n <span>{{ slot.text }}</span>\n @if (hasAppointmentsInYear(slot.date?.date)) {\n <ax-badge color=\"primary\"></ax-badge>\n }\n </div>\n</ng-template>\n", styles: ["@layer properties;@layer base{:root{--ax-comp-scheduler-width: 57.5rem;--ax-comp-scheduler-basic-view-blocks-height: 3rem;--ax-comp-scheduler-basic-view-blocks-width: 3.5rem;--ax-comp-scheduler-timeline-view-blocks-width: 20rem;--ax-comp-scheduler-timeline-view-blocks-height: 3rem;--ax-comp-scheduler-primary-bg-color: var(--ax-sys-color-primary-lighter-surface);--ax-comp-scheduler-primary-text-color: var(--ax-sys-color-on-primary-lighter-surface);--ax-comp-scheduler-primary-active-border-color: var(--ax-sys-color-primary-500);--ax-comp-scheduler-highest-priority-bg-color: var(--ax-sys-color-danger-surface);--ax-comp-scheduler-highest-priority-text-color: var(--ax-sys-color-on-danger-surface);--ax-comp-scheduler-highest-priority-active-border-color: var(--ax-sys-color-danger-700);--ax-comp-scheduler-high-priority-bg-color: var(--ax-sys-color-danger-lighter-surface);--ax-comp-scheduler-high-priority-text-color: var(--ax-sys-color-on-danger-lighter-surface);--ax-comp-scheduler-high-priority-active-border-color: var(--ax-sys-color-danger-500);--ax-comp-scheduler-medium-priority-bg-color: var(--ax-sys-color-warning-lighter-surface);--ax-comp-scheduler-medium-priority-text-color: var(--ax-sys-color-on-warning-lighter-surface);--ax-comp-scheduler-medium-priority-active-border-color: var(--ax-sys-color-warning-600);--ax-comp-scheduler-low-priority-bg-color: var(--ax-sys-color-success-lighter-surface);--ax-comp-scheduler-low-priority-text-color: var(--ax-sys-color-on-success-lighter-surface);--ax-comp-scheduler-low-priority-active-border-color: var(--ax-sys-color-success-500);--ax-comp-scheduler-lowest-priority-bg-color: var(--ax-sys-color-success-lightest-surface);--ax-comp-scheduler-lowest-priority-text-color: var(--ax-sys-color-on-success-lightest-surface);--ax-comp-scheduler-lowest-priority-active-border-color: var(--ax-sys-color-success-400)}}@layer components{ax-scheduler{display:block;height:100%;width:100%;background-color:inherit;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));-webkit-user-select:none;user-select:none}ax-scheduler .ax-scheduler-primary-priority{color:rgba(var(--ax-comp-scheduler-primary-text-color));background-color:rgba(var(--ax-comp-scheduler-primary-bg-color));border:2px solid transparent}ax-scheduler .ax-scheduler-primary-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-primary-active-border-color));z-index:10}ax-scheduler .ax-scheduler-highest-priority{color:rgba(var(--ax-comp-scheduler-highest-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-highest-priority-bg-color));border:2px solid transparent}ax-scheduler .ax-scheduler-highest-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-highest-priority-active-border-color));z-index:10}ax-scheduler .ax-scheduler-high-priority{color:rgba(var(--ax-comp-scheduler-high-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-high-priority-bg-color));border:2px solid transparent}ax-scheduler .ax-scheduler-high-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-high-priority-active-border-color));z-index:10}ax-scheduler .ax-scheduler-medium-priority{color:rgba(var(--ax-comp-scheduler-medium-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-medium-priority-bg-color));border:2px solid transparent}ax-scheduler .ax-scheduler-medium-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-medium-priority-active-border-color));z-index:10}ax-scheduler .ax-scheduler-low-priority{color:rgba(var(--ax-comp-scheduler-low-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-low-priority-bg-color));border:2px solid transparent}ax-scheduler .ax-scheduler-low-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-low-priority-active-border-color));z-index:10}ax-scheduler .ax-scheduler-lowest-priority{color:rgba(var(--ax-comp-scheduler-lowest-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-lowest-priority-bg-color));border:2px solid transparent}ax-scheduler .ax-scheduler-lowest-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-lowest-priority-active-border-color));z-index:10}ax-scheduler.ax-full-screen-container{position:fixed;inset-inline-start:calc(var(--spacing, .25rem) * 0);top:calc(var(--spacing, .25rem) * 0);z-index:61;height:100vh;width:100vw}ax-scheduler .ax-scheduler-container{display:flex;height:100%;flex-direction:column;overflow:hidden;border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;background-color:inherit}ax-scheduler .ax-scheduler-container .ax-scheduler-header{display:flex;align-items:center;justify-content:space-between;overflow-x:auto;overflow-y:hidden;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;padding:calc(var(--spacing, .25rem) * 4)}ax-scheduler .ax-scheduler-container .ax-scheduler-header .ax-scheduler-date{display:flex;min-width:calc(var(--spacing, .25rem) * 82);align-items:center;justify-content:space-between}ax-scheduler .ax-scheduler-container .ax-scheduler-header .ax-scheduler-date p{margin:calc(var(--spacing, .25rem) * 0);min-width:calc(var(--spacing, .25rem) * 40);text-align:center;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler .ax-scheduler-container .ax-scheduler-actions{display:flex;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 3)}ax-scheduler .ax-scheduler-container .ax-scheduler-truncate{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ax-scheduler .ax-scheduler-container ax-subtitle{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}ax-scheduler .ax-scheduler-container .ax-scheduler-views-container{height:100%;overflow:auto;background-color:inherit}.ax-scheduler-popover{display:grid;max-height:calc(var(--spacing, .25rem) * 40);gap:calc(var(--spacing, .25rem) * 1);overflow:auto;border-radius:var(--radius-lg, .5rem);padding:calc(var(--spacing, .25rem) * 1);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)))}.ax-scheduler-popover .ax-scheduler-primary-priority{color:rgba(var(--ax-comp-scheduler-primary-text-color));background-color:rgba(var(--ax-comp-scheduler-primary-bg-color));border:2px solid transparent}.ax-scheduler-popover .ax-scheduler-primary-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-primary-active-border-color));z-index:10}.ax-scheduler-popover .ax-scheduler-highest-priority{color:rgba(var(--ax-comp-scheduler-highest-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-highest-priority-bg-color));border:2px solid transparent}.ax-scheduler-popover .ax-scheduler-highest-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-highest-priority-active-border-color));z-index:10}.ax-scheduler-popover .ax-scheduler-high-priority{color:rgba(var(--ax-comp-scheduler-high-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-high-priority-bg-color));border:2px solid transparent}.ax-scheduler-popover .ax-scheduler-high-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-high-priority-active-border-color));z-index:10}.ax-scheduler-popover .ax-scheduler-medium-priority{color:rgba(var(--ax-comp-scheduler-medium-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-medium-priority-bg-color));border:2px solid transparent}.ax-scheduler-popover .ax-scheduler-medium-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-medium-priority-active-border-color));z-index:10}.ax-scheduler-popover .ax-scheduler-low-priority{color:rgba(var(--ax-comp-scheduler-low-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-low-priority-bg-color));border:2px solid transparent}.ax-scheduler-popover .ax-scheduler-low-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-low-priority-active-border-color));z-index:10}.ax-scheduler-popover .ax-scheduler-lowest-priority{color:rgba(var(--ax-comp-scheduler-lowest-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-lowest-priority-bg-color));border:2px solid transparent}.ax-scheduler-popover .ax-scheduler-lowest-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-lowest-priority-active-border-color));z-index:10}.ax-scheduler-popover.ax-scheduler-month-popover-appointment,.ax-scheduler-popover.ax-scheduler-timeline-year-popover-appointment{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}.ax-scheduler-popover.ax-scheduler-timeline-year-popover-appointment .ax-scheduler-popover-appointment .ax-appointment-chip-title{margin-bottom:calc(var(--spacing, .25rem) * .5);font-size:.8rem;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.ax-scheduler-popover:not(.ax-state-readonly) .ax-scheduler-popover-appointment{cursor:pointer}.ax-scheduler-popover .ax-scheduler-popover-appointment{display:flex;flex-direction:column;overflow:hidden;border-radius:calc(var(--ax-sys-border-radius) / 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1);-webkit-user-select:none;user-select:none;color:rgba(var(--ax-comp-scheduler-primary-text-color));background-color:rgba(var(--ax-comp-scheduler-primary-bg-color))}.ax-scheduler-popover .ax-scheduler-popover-appointment ax-subtitle{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}.ax-scheduler-popover .ax-scheduler-popover-appointment .ax-scheduler-truncate{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ax-scheduler-popover ax-title,.ax-scheduler-popover .ax-appointment-chip-title{display:flex;justify-content:space-between}:is(.ax-scheduler-popover ax-title,.ax-scheduler-popover .ax-appointment-chip-title) .ax-scheduler-action-icon{width:auto;cursor:pointer}.ax-scheduler-current-time-line{pointer-events:none;position:absolute;z-index:7;background-color:#ef4444;--tw-shadow: 0 0 6px var(--tw-shadow-color, rgba(239,68,68,.8));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ax-scheduler-current-time-line:before{position:absolute;width:calc(var(--spacing, .25rem) * 3);height:calc(var(--spacing, .25rem) * 3);border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:2px;border-color:rgba(var(--ax-sys-color-surface));background-color:#ef4444;--tw-shadow: 0 0 8px var(--tw-shadow-color, rgba(239,68,68,.9));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);--tw-content: \"\";content:var(--tw-content)}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-content{syntax: \"*\"; inherits: false; initial-value: \"\";}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-content: \"\"}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"] }]
|
|
5372
|
+
], providers: [AXUnsubscriber, { provide: AXComponent, useExisting: AXSchedulerComponent }], template: "<div class=\"ax-scheduler-container\">\n @if (hasHeader()) {\n <div class=\"ax-scheduler-header\">\n <div class=\"ax-scheduler-date\">\n <ax-button look=\"blank\" (onClick)=\"prevClick()\">\n <ax-icon\n class=\"ax-icon text-xl\"\n [class.ax-icon-chevron-left]=\"!rtl()\"\n [class.ax-icon-chevron-right]=\"rtl()\"\n ></ax-icon>\n </ax-button>\n <ax-button look=\"blank\" [text]=\"currentDateText()\" #date></ax-button>\n <ax-button look=\"blank\" (onClick)=\"nextClick()\">\n <ax-icon\n class=\"ax-icon text-xl\"\n [class.ax-icon-chevron-right]=\"!rtl()\"\n [class.ax-icon-chevron-left]=\"rtl()\"\n ></ax-icon>\n </ax-button>\n <ax-popover [target]=\"date\" #calendarPopover>\n <ax-calendar\n [type]=\"calendarType()\"\n [depth]=\"calendarDepth()\"\n [ngModel]=\"currentDate()\"\n [dayCellTemplate]=\"calendarDayCellTemplateRef\"\n [monthCellTemplate]=\"calendarMonthCellTemplateRef\"\n [yearCellTemplate]=\"calendarYearCellTemplateRef\"\n (onValueChanged)=\"calendarDateChanged($event)\"\n ></ax-calendar>\n </ax-popover>\n </div>\n <div class=\"ax-scheduler-actions\">\n <ax-select-box\n [dropdownWidth]=\"'200px'\"\n [ngModel]=\"selectedView()\"\n [dataSource]=\"viewsDataSource()\"\n (onValueChanged)=\"viewChanged($event)\"\n ></ax-select-box>\n\n @if (allowFullScreen()) {\n <ax-button look=\"blank\" (onClick)=\"handleFullScreen()\">\n <ax-icon>\n <i class=\"fa-solid\" [class.fa-compress]=\"isFullScreen()\" [class.fa-expand]=\"!isFullScreen()\"></i>\n </ax-icon>\n </ax-button>\n }\n </div>\n </div>\n }\n <div class=\"ax-scheduler-views-container\">\n @switch (selectedView()) {\n @case ('day') {\n <ax-scheduler-day-view\n [rtl]=\"rtl()\"\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [draggable]=\"draggable()\"\n [hasActions]=\"hasActions()\"\n [calendar]=\"calendarType()\"\n [endDayHour]=\"endDayHour()\"\n [startDayHour]=\"startDayHour()\"\n [showCurrentTimeIndicator]=\"showCurrentTimeIndicator()\"\n [scrollToCurrentTimeIndicator]=\"scrollToCurrentTimeIndicator()\"\n [appointments]=\"viewAppointments()\"\n [dragStartDelay]=\"dragStartDelay()\"\n [tooltipTemplate]=\"tooltipTemplate()\"\n [selectedAppointmentId]=\"selectedAppointmentId()\"\n (onActionClickInternal)=\"onActionClick.emit($event)\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($event)\"\n (onAppointmentDropInternal)=\"handleAppointmentDropInternal($event)\"\n (appointmentClickedInternal)=\"handleAppointmentClickInternal($event)\"\n (appointmentDblClickedInternal)=\"handleAppointmentDblClickInternal($event)\"\n (appointmentRightClickedInternal)=\"handleAppointmentRightClickInternal($event)\"\n ></ax-scheduler-day-view>\n }\n @case ('week') {\n <ax-scheduler-week-view\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [draggable]=\"draggable()\"\n [calendar]=\"calendarType()\"\n [endDayHour]=\"endDayHour()\"\n [hasActions]=\"hasActions()\"\n [startDayHour]=\"startDayHour()\"\n [showCurrentTimeIndicator]=\"showCurrentTimeIndicator()\"\n [scrollToCurrentTimeIndicator]=\"scrollToCurrentTimeIndicator()\"\n [appointments]=\"viewAppointments()\"\n [dragStartDelay]=\"dragStartDelay()\"\n [tooltipTemplate]=\"tooltipTemplate()\"\n [selectedAppointmentId]=\"selectedAppointmentId()\"\n (onActionClickInternal)=\"onActionClick.emit($event)\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($event)\"\n (onAppointmentDropInternal)=\"handleAppointmentDropInternal($event)\"\n (appointmentClickedInternal)=\"handleAppointmentClickInternal($event)\"\n (appointmentDblClickedInternal)=\"handleAppointmentDblClickInternal($event)\"\n (appointmentRightClickedInternal)=\"handleAppointmentRightClickInternal($event)\"\n ></ax-scheduler-week-view>\n }\n @case ('month') {\n <ax-scheduler-month-view\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [draggable]=\"draggable()\"\n [calendar]=\"calendarType()\"\n [hasActions]=\"hasActions()\"\n [appointments]=\"viewAppointments()\"\n [firstDayOfWeek]=\"firstDayOfWeek()\"\n [dragStartDelay]=\"dragStartDelay()\"\n [tooltipTemplate]=\"tooltipTemplate()\"\n [selectedAppointmentId]=\"selectedAppointmentId()\"\n (onActionClickInternal)=\"onActionClick.emit($event)\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($event)\"\n (onAppointmentDropInternal)=\"handleAppointmentDropInternal($event)\"\n (appointmentClickedInternal)=\"handleAppointmentClickInternal($event)\"\n (appointmentDblClickedInternal)=\"handleAppointmentDblClickInternal($event)\"\n (appointmentRightClickedInternal)=\"handleAppointmentRightClickInternal($event)\"\n ></ax-scheduler-month-view>\n }\n @case ('timeline-day') {\n <ax-scheduler-timeline-day-view\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [resources]=\"resources()\"\n [draggable]=\"draggable()\"\n [hasActions]=\"hasActions()\"\n [calendar]=\"calendarType()\"\n [endDayHour]=\"endDayHour()\"\n [startDayHour]=\"startDayHour()\"\n [appointments]=\"viewAppointments()\"\n [dragStartDelay]=\"dragStartDelay()\"\n [tooltipTemplate]=\"tooltipTemplate()\"\n [resourceTemplate]=\"resourceTemplate()\"\n [showResourceHeaders]=\"showResourceHeaders()\"\n [showCurrentTimeIndicator]=\"showCurrentTimeIndicator()\"\n [scrollToCurrentTimeIndicator]=\"scrollToCurrentTimeIndicator()\"\n [showUnassignedAppointments]=\"showUnassignedAppointments()\"\n [selectedAppointmentId]=\"selectedAppointmentId()\"\n (onActionClickInternal)=\"onActionClick.emit($event)\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($event)\"\n (onAppointmentDropInternal)=\"handleAppointmentDropInternal($event)\"\n (appointmentClickedInternal)=\"handleAppointmentClickInternal($event)\"\n (appointmentDblClickedInternal)=\"handleAppointmentDblClickInternal($event)\"\n (appointmentRightClickedInternal)=\"handleAppointmentRightClickInternal($event)\"\n >\n </ax-scheduler-timeline-day-view>\n }\n @case ('timeline-weekly') {\n <ax-scheduler-timeline-weekly-view\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [resources]=\"resources()\"\n [draggable]=\"draggable()\"\n [calendar]=\"calendarType()\"\n [endDayHour]=\"endDayHour()\"\n [hasActions]=\"hasActions()\"\n [startDayHour]=\"startDayHour()\"\n [appointments]=\"viewAppointments()\"\n [dragStartDelay]=\"dragStartDelay()\"\n [daysCount]=\"multiDayViewDaysCount()\"\n [tooltipTemplate]=\"tooltipTemplate()\"\n [resourceTemplate]=\"resourceTemplate()\"\n [showResourceHeaders]=\"showResourceHeaders()\"\n [showCurrentTimeIndicator]=\"showCurrentTimeIndicator()\"\n [scrollToCurrentTimeIndicator]=\"scrollToCurrentTimeIndicator()\"\n [showUnassignedAppointments]=\"showUnassignedAppointments()\"\n [selectedAppointmentId]=\"selectedAppointmentId()\"\n (onActionClickInternal)=\"onActionClick.emit($event)\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($event)\"\n (onAppointmentDropInternal)=\"handleAppointmentDropInternal($event)\"\n (appointmentClickedInternal)=\"handleAppointmentClickInternal($event)\"\n (appointmentDblClickedInternal)=\"handleAppointmentDblClickInternal($event)\"\n (appointmentRightClickedInternal)=\"handleAppointmentRightClickInternal($event)\"\n >\n </ax-scheduler-timeline-weekly-view>\n }\n @case ('timeline-month') {\n <ax-scheduler-timeline-month-view\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [resources]=\"resources()\"\n [draggable]=\"draggable()\"\n [calendar]=\"calendarType()\"\n [hasActions]=\"hasActions()\"\n [appointments]=\"viewAppointments()\"\n [dragStartDelay]=\"dragStartDelay()\"\n [tooltipTemplate]=\"tooltipTemplate()\"\n [resourceTemplate]=\"resourceTemplate()\"\n [showResourceHeaders]=\"showResourceHeaders()\"\n [showCurrentTimeIndicator]=\"showCurrentTimeIndicator()\"\n [scrollToCurrentTimeIndicator]=\"scrollToCurrentTimeIndicator()\"\n [showUnassignedAppointments]=\"showUnassignedAppointments()\"\n [selectedAppointmentId]=\"selectedAppointmentId()\"\n (onActionClickInternal)=\"onActionClick.emit($event)\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($event)\"\n (onAppointmentDropInternal)=\"handleAppointmentDropInternal($event)\"\n (appointmentClickedInternal)=\"handleAppointmentClickInternal($event)\"\n (appointmentDblClickedInternal)=\"handleAppointmentDblClickInternal($event)\"\n (appointmentRightClickedInternal)=\"handleAppointmentRightClickInternal($event)\"\n >\n </ax-scheduler-timeline-month-view>\n }\n @case ('timeline-year') {\n <ax-scheduler-timeline-year-view\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [resources]=\"resources()\"\n [draggable]=\"draggable()\"\n [calendar]=\"calendarType()\"\n [hasActions]=\"hasActions()\"\n [appointments]=\"viewAppointments()\"\n [dragStartDelay]=\"dragStartDelay()\"\n [tooltipTemplate]=\"tooltipTemplate()\"\n [resourceTemplate]=\"resourceTemplate()\"\n [showResourceHeaders]=\"showResourceHeaders()\"\n [showCurrentTimeIndicator]=\"showCurrentTimeIndicator()\"\n [scrollToCurrentTimeIndicator]=\"scrollToCurrentTimeIndicator()\"\n [showUnassignedAppointments]=\"showUnassignedAppointments()\"\n [selectedAppointmentId]=\"selectedAppointmentId()\"\n (onActionClickInternal)=\"onActionClick.emit($event)\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($event)\"\n (onAppointmentDropInternal)=\"handleAppointmentDropInternal($event)\"\n (appointmentClickedInternal)=\"handleAppointmentClickInternal($event)\"\n (appointmentDblClickedInternal)=\"handleAppointmentDblClickInternal($event)\"\n (appointmentRightClickedInternal)=\"handleAppointmentRightClickInternal($event)\"\n >\n </ax-scheduler-timeline-year-view>\n }\n @case ('agenda') {\n <ax-scheduler-agenda-view\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [draggable]=\"draggable()\"\n [calendar]=\"calendarType()\"\n [hasActions]=\"hasActions()\"\n [appointments]=\"viewAppointments()\"\n [dragStartDelay]=\"dragStartDelay()\"\n [daysCount]=\"multiDayViewDaysCount()\"\n [tooltipTemplate]=\"tooltipTemplate()\"\n [selectedAppointmentId]=\"selectedAppointmentId()\"\n (onActionClickInternal)=\"onActionClick.emit($event)\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($event)\"\n (onAppointmentDropInternal)=\"handleAppointmentDropInternal($event)\"\n (appointmentClickedInternal)=\"handleAppointmentClickInternal($event)\"\n (appointmentDblClickedInternal)=\"handleAppointmentDblClickInternal($event)\"\n (appointmentRightClickedInternal)=\"handleAppointmentRightClickInternal($event)\"\n >\n </ax-scheduler-agenda-view>\n }\n }\n </div>\n</div>\n<ng-template #calendarDayCellTemplate let-data>\n @let slot = data.slot;\n <div class=\"flex flex-col items-center justify-between gap-1\">\n <span>{{ slot.text }}</span>\n @if (hasAppointmentsOnDate($safeNavigationMigration(slot.date?.date))) {\n <ax-badge color=\"primary\"></ax-badge>\n }\n </div>\n</ng-template>\n<ng-template #calendarMonthCellTemplate let-data>\n @let slot = data.slot;\n <div class=\"flex flex-col items-center justify-between gap-1\">\n <span>{{ slot.text }}</span>\n @if (hasAppointmentsInMonth($safeNavigationMigration(slot.date?.date))) {\n <ax-badge color=\"primary\"></ax-badge>\n }\n </div>\n</ng-template>\n<ng-template #calendarYearCellTemplate let-data>\n @let slot = data.slot;\n <div class=\"flex flex-col items-center justify-between gap-1\">\n <span>{{ slot.text }}</span>\n @if (hasAppointmentsInYear($safeNavigationMigration(slot.date?.date))) {\n <ax-badge color=\"primary\"></ax-badge>\n }\n </div>\n</ng-template>\n", styles: ["@layer properties;@layer base{:root{--ax-comp-scheduler-width: 57.5rem;--ax-comp-scheduler-basic-view-blocks-height: 3rem;--ax-comp-scheduler-basic-view-blocks-width: 3.5rem;--ax-comp-scheduler-timeline-view-blocks-width: 20rem;--ax-comp-scheduler-timeline-view-blocks-height: 3rem;--ax-comp-scheduler-primary-bg-color: var(--ax-sys-color-primary-lighter-surface);--ax-comp-scheduler-primary-text-color: var(--ax-sys-color-on-primary-lighter-surface);--ax-comp-scheduler-primary-active-border-color: var(--ax-sys-color-primary-500);--ax-comp-scheduler-highest-priority-bg-color: var(--ax-sys-color-danger-surface);--ax-comp-scheduler-highest-priority-text-color: var(--ax-sys-color-on-danger-surface);--ax-comp-scheduler-highest-priority-active-border-color: var(--ax-sys-color-danger-700);--ax-comp-scheduler-high-priority-bg-color: var(--ax-sys-color-danger-lighter-surface);--ax-comp-scheduler-high-priority-text-color: var(--ax-sys-color-on-danger-lighter-surface);--ax-comp-scheduler-high-priority-active-border-color: var(--ax-sys-color-danger-500);--ax-comp-scheduler-medium-priority-bg-color: var(--ax-sys-color-warning-lighter-surface);--ax-comp-scheduler-medium-priority-text-color: var(--ax-sys-color-on-warning-lighter-surface);--ax-comp-scheduler-medium-priority-active-border-color: var(--ax-sys-color-warning-600);--ax-comp-scheduler-low-priority-bg-color: var(--ax-sys-color-success-lighter-surface);--ax-comp-scheduler-low-priority-text-color: var(--ax-sys-color-on-success-lighter-surface);--ax-comp-scheduler-low-priority-active-border-color: var(--ax-sys-color-success-500);--ax-comp-scheduler-lowest-priority-bg-color: var(--ax-sys-color-success-lightest-surface);--ax-comp-scheduler-lowest-priority-text-color: var(--ax-sys-color-on-success-lightest-surface);--ax-comp-scheduler-lowest-priority-active-border-color: var(--ax-sys-color-success-400)}}@layer components{ax-scheduler{display:block;height:100%;width:100%;background-color:inherit;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));-webkit-user-select:none;user-select:none}ax-scheduler .ax-scheduler-primary-priority{color:rgba(var(--ax-comp-scheduler-primary-text-color));background-color:rgba(var(--ax-comp-scheduler-primary-bg-color));border:2px solid transparent}ax-scheduler .ax-scheduler-primary-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-primary-active-border-color));z-index:10}ax-scheduler .ax-scheduler-highest-priority{color:rgba(var(--ax-comp-scheduler-highest-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-highest-priority-bg-color));border:2px solid transparent}ax-scheduler .ax-scheduler-highest-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-highest-priority-active-border-color));z-index:10}ax-scheduler .ax-scheduler-high-priority{color:rgba(var(--ax-comp-scheduler-high-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-high-priority-bg-color));border:2px solid transparent}ax-scheduler .ax-scheduler-high-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-high-priority-active-border-color));z-index:10}ax-scheduler .ax-scheduler-medium-priority{color:rgba(var(--ax-comp-scheduler-medium-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-medium-priority-bg-color));border:2px solid transparent}ax-scheduler .ax-scheduler-medium-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-medium-priority-active-border-color));z-index:10}ax-scheduler .ax-scheduler-low-priority{color:rgba(var(--ax-comp-scheduler-low-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-low-priority-bg-color));border:2px solid transparent}ax-scheduler .ax-scheduler-low-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-low-priority-active-border-color));z-index:10}ax-scheduler .ax-scheduler-lowest-priority{color:rgba(var(--ax-comp-scheduler-lowest-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-lowest-priority-bg-color));border:2px solid transparent}ax-scheduler .ax-scheduler-lowest-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-lowest-priority-active-border-color));z-index:10}ax-scheduler.ax-full-screen-container{position:fixed;inset-inline-start:calc(var(--spacing, .25rem) * 0);top:calc(var(--spacing, .25rem) * 0);z-index:61;height:100vh;width:100vw}ax-scheduler .ax-scheduler-container{display:flex;height:100%;flex-direction:column;overflow:hidden;border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;background-color:inherit}ax-scheduler .ax-scheduler-container .ax-scheduler-header{display:flex;align-items:center;justify-content:space-between;overflow-x:auto;overflow-y:hidden;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;padding:calc(var(--spacing, .25rem) * 4)}ax-scheduler .ax-scheduler-container .ax-scheduler-header .ax-scheduler-date{display:flex;min-width:calc(var(--spacing, .25rem) * 82);align-items:center;justify-content:space-between}ax-scheduler .ax-scheduler-container .ax-scheduler-header .ax-scheduler-date p{margin:calc(var(--spacing, .25rem) * 0);min-width:calc(var(--spacing, .25rem) * 40);text-align:center;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}ax-scheduler .ax-scheduler-container .ax-scheduler-actions{display:flex;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 3)}ax-scheduler .ax-scheduler-container .ax-scheduler-truncate{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ax-scheduler .ax-scheduler-container ax-subtitle{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}ax-scheduler .ax-scheduler-container .ax-scheduler-views-container{height:100%;overflow:auto;background-color:inherit}.ax-scheduler-popover{display:grid;max-height:calc(var(--spacing, .25rem) * 40);gap:calc(var(--spacing, .25rem) * 1);overflow:auto;border-radius:var(--radius-lg, .5rem);padding:calc(var(--spacing, .25rem) * 1);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)))}.ax-scheduler-popover .ax-scheduler-primary-priority{color:rgba(var(--ax-comp-scheduler-primary-text-color));background-color:rgba(var(--ax-comp-scheduler-primary-bg-color));border:2px solid transparent}.ax-scheduler-popover .ax-scheduler-primary-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-primary-active-border-color));z-index:10}.ax-scheduler-popover .ax-scheduler-highest-priority{color:rgba(var(--ax-comp-scheduler-highest-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-highest-priority-bg-color));border:2px solid transparent}.ax-scheduler-popover .ax-scheduler-highest-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-highest-priority-active-border-color));z-index:10}.ax-scheduler-popover .ax-scheduler-high-priority{color:rgba(var(--ax-comp-scheduler-high-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-high-priority-bg-color));border:2px solid transparent}.ax-scheduler-popover .ax-scheduler-high-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-high-priority-active-border-color));z-index:10}.ax-scheduler-popover .ax-scheduler-medium-priority{color:rgba(var(--ax-comp-scheduler-medium-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-medium-priority-bg-color));border:2px solid transparent}.ax-scheduler-popover .ax-scheduler-medium-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-medium-priority-active-border-color));z-index:10}.ax-scheduler-popover .ax-scheduler-low-priority{color:rgba(var(--ax-comp-scheduler-low-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-low-priority-bg-color));border:2px solid transparent}.ax-scheduler-popover .ax-scheduler-low-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-low-priority-active-border-color));z-index:10}.ax-scheduler-popover .ax-scheduler-lowest-priority{color:rgba(var(--ax-comp-scheduler-lowest-priority-text-color));background-color:rgba(var(--ax-comp-scheduler-lowest-priority-bg-color));border:2px solid transparent}.ax-scheduler-popover .ax-scheduler-lowest-priority.ax-state-active{border:2px solid rgba(var(--ax-comp-scheduler-lowest-priority-active-border-color));z-index:10}.ax-scheduler-popover.ax-scheduler-month-popover-appointment,.ax-scheduler-popover.ax-scheduler-timeline-year-popover-appointment{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}.ax-scheduler-popover.ax-scheduler-timeline-year-popover-appointment .ax-scheduler-popover-appointment .ax-appointment-chip-title{margin-bottom:calc(var(--spacing, .25rem) * .5);font-size:.8rem;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.ax-scheduler-popover:not(.ax-state-readonly) .ax-scheduler-popover-appointment{cursor:pointer}.ax-scheduler-popover .ax-scheduler-popover-appointment{display:flex;flex-direction:column;overflow:hidden;border-radius:calc(var(--ax-sys-border-radius) / 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 1);-webkit-user-select:none;user-select:none;color:rgba(var(--ax-comp-scheduler-primary-text-color));background-color:rgba(var(--ax-comp-scheduler-primary-bg-color))}.ax-scheduler-popover .ax-scheduler-popover-appointment ax-subtitle{font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)))}.ax-scheduler-popover .ax-scheduler-popover-appointment .ax-scheduler-truncate{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ax-scheduler-popover ax-title,.ax-scheduler-popover .ax-appointment-chip-title{display:flex;justify-content:space-between}:is(.ax-scheduler-popover ax-title,.ax-scheduler-popover .ax-appointment-chip-title) .ax-scheduler-action-icon{width:auto;cursor:pointer}.ax-scheduler-current-time-line{pointer-events:none;position:absolute;z-index:7;background-color:#ef4444;--tw-shadow: 0 0 6px var(--tw-shadow-color, rgba(239,68,68,.8));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ax-scheduler-current-time-line:before{position:absolute;width:calc(var(--spacing, .25rem) * 3);height:calc(var(--spacing, .25rem) * 3);border-radius:calc(infinity * 1px);border-style:var(--tw-border-style);border-width:2px;border-color:rgba(var(--ax-sys-color-surface));background-color:#ef4444;--tw-shadow: 0 0 8px var(--tw-shadow-color, rgba(239,68,68,.9));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);--tw-content: \"\";content:var(--tw-content)}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-content{syntax: \"*\"; inherits: false; initial-value: \"\";}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-font-weight: initial;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-content: \"\"}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"] }]
|
|
5144
5373
|
}], propDecorators: { viewModeSelectbox: [{ type: i0.ViewChild, args: [i0.forwardRef(() => AXSelectBoxComponent), { isSignal: true }] }], calendarPopover: [{ type: i0.ViewChild, args: ['calendarPopover', { isSignal: true }] }], _calendarDayCellTemplate: [{ type: i0.ViewChild, args: ['calendarDayCellTemplate', { isSignal: true }] }], _calendarMonthCellTemplate: [{ type: i0.ViewChild, args: ['calendarMonthCellTemplate', { isSignal: true }] }], _calendarYearCellTemplate: [{ type: i0.ViewChild, args: ['calendarYearCellTemplate', { isSignal: true }] }], calendar: [{ type: i0.Input, args: [{ isSignal: true, alias: "calendar", required: false }] }], startingDate: [{ type: i0.Input, args: [{ isSignal: true, alias: "startingDate", required: false }] }], endDayHour: [{ type: i0.Input, args: [{ isSignal: true, alias: "endDayHour", required: false }] }], startDayHour: [{ type: i0.Input, args: [{ isSignal: true, alias: "startDayHour", required: false }] }], hasHeader: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasHeader", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], draggable: [{ type: i0.Input, args: [{ isSignal: true, alias: "draggable", required: false }] }], hasActions: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasActions", required: false }] }], dragStartDelay: [{ type: i0.Input, args: [{ isSignal: true, alias: "dragStartDelay", required: false }] }], weekend: [{ type: i0.Input, args: [{ isSignal: true, alias: "weekend", required: false }] }], allowFullScreen: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowFullScreen", required: false }] }], multiDayViewDaysCount: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiDayViewDaysCount", required: false }] }], showResourceHeaders: [{ type: i0.Input, args: [{ isSignal: true, alias: "showResourceHeaders", required: false }] }], showCurrentTimeIndicator: [{ type: i0.Input, args: [{ isSignal: true, alias: "showCurrentTimeIndicator", required: false }] }], scrollToCurrentTimeIndicator: [{ type: i0.Input, args: [{ isSignal: true, alias: "scrollToCurrentTimeIndicator", required: false }] }], showUnassignedAppointments: [{ type: i0.Input, args: [{ isSignal: true, alias: "showUnassignedAppointments", required: false }] }], resources: [{ type: i0.Input, args: [{ isSignal: true, alias: "resources", required: false }] }], resourceTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "resourceTemplate", required: false }] }], firstDayOfWeek: [{ type: i0.Input, args: [{ isSignal: true, alias: "firstDayOfWeek", required: false }] }], tooltipTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "tooltipTemplate", required: false }] }], dataSource: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataSource", required: false }] }], holidays: [{ type: i0.Input, args: [{ isSignal: true, alias: "holidays", required: false }] }], views: [{ type: i0.Input, args: [{ isSignal: true, alias: "views", required: false }] }], selectedView: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedView", required: false }] }, { type: i0.Output, args: ["selectedViewChange"] }], onDataLoaded: [{ type: i0.Output, args: ["onDataLoaded"] }], onRangeChanged: [{ type: i0.Output, args: ["onRangeChanged"] }], onSlotClicked: [{ type: i0.Output, args: ["onSlotClicked"] }], onSlotDblClicked: [{ type: i0.Output, args: ["onSlotDblClicked"] }], onSlotRightClick: [{ type: i0.Output, args: ["onSlotRightClick"] }], onAppointmentDrop: [{ type: i0.Output, args: ["onAppointmentDrop"] }], onActionClick: [{ type: i0.Output, args: ["onActionClick"] }], onAppointmentClicked: [{ type: i0.Output, args: ["onAppointmentClicked"] }], onAppointmentDblClicked: [{ type: i0.Output, args: ["onAppointmentDblClicked"] }], onAppointmentRightClick: [{ type: i0.Output, args: ["onAppointmentRightClick"] }] } });
|
|
5145
5374
|
|
|
5146
5375
|
const COMPONENT = [
|
|
@@ -5155,8 +5384,8 @@ const COMPONENT = [
|
|
|
5155
5384
|
AXSchedulerTimelineYearViewComponent,
|
|
5156
5385
|
];
|
|
5157
5386
|
class AXSchedulerModule {
|
|
5158
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
5159
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
5387
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXSchedulerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
5388
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.0.8", ngImport: i0, type: AXSchedulerModule, imports: [AXSchedulerComponent,
|
|
5160
5389
|
AXSchedulerDayViewComponent,
|
|
5161
5390
|
AXSchedulerWeekViewComponent,
|
|
5162
5391
|
AXSchedulerMonthViewComponent,
|
|
@@ -5173,9 +5402,9 @@ class AXSchedulerModule {
|
|
|
5173
5402
|
AXSchedulerTimelineMonthViewComponent,
|
|
5174
5403
|
AXSchedulerTimelineWeeklyViewComponent,
|
|
5175
5404
|
AXSchedulerTimelineYearViewComponent] }); }
|
|
5176
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
5405
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXSchedulerModule, imports: [COMPONENT] }); }
|
|
5177
5406
|
}
|
|
5178
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
5407
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXSchedulerModule, decorators: [{
|
|
5179
5408
|
type: NgModule,
|
|
5180
5409
|
args: [{
|
|
5181
5410
|
imports: [...COMPONENT],
|