@acorex/components 20.1.33 → 20.1.35

package/fesm2022/acorex-components-scheduler.mjs

@@ -1,7 +1,7 @@
 import { NXComponent, AXComponent } from '@acorex/cdk/common';
 import { AXButtonComponent } from '@acorex/components/button';
 import { AXCalendarComponent } from '@acorex/components/calendar';
-import { AXDecoratorGenericComponent, AXDecoratorIconComponent } from '@acorex/components/decorators';
+import { AXDecoratorIconComponent, AXDecoratorGenericComponent } from '@acorex/components/decorators';
 import { AXPopoverComponent } from '@acorex/components/popover';
 import { AXSelectBoxComponent } from '@acorex/components/select-box';
 import { AXCalendarService } from '@acorex/core/date-time';
@@ -571,6 +571,74 @@ class AXSchedulerService {
         }
         return this.internalWeekend().includes(date.dayOfWeek - 1);
     }
+    /**
+     * Filters appointments by resources and unassigned appointments.
+     *
+     * @param appointments - Array of appointments to filter.
+     * @param resources - Array of resources.
+     * @param showUnassignedAppointments - Whether to show appointments without resources.
+     * @returns Map<string, AXSchedulerAppointment[]> - Appointments grouped by resource ID.
+     */
+    filterAppointmentsByResources(appointments, resources, showUnassignedAppointments = true) {
+        const result = new Map();
+        if (!resources || resources.length === 0) {
+            // If no resources, return all appointments under a default key
+            result.set('default', appointments);
+            return result;
+        }
+        // Initialize result map with empty arrays for each resource
+        resources.forEach((resource) => {
+            result.set(resource.id.toString(), []);
+        });
+        // Add unassigned appointments key if needed
+        if (showUnassignedAppointments) {
+            result.set('unassigned', []);
+        }
+        // Group appointments by resource
+        appointments.forEach((appointment) => {
+            if (appointment.resourceId !== undefined && appointment.resourceId !== null) {
+                const resourceId = appointment.resourceId.toString();
+                if (result.has(resourceId)) {
+                    result.get(resourceId).push(appointment);
+                }
+                else if (showUnassignedAppointments) {
+                    // If resource doesn't exist in the resources array, treat as unassigned
+                    result.get('unassigned').push(appointment);
+                }
+            }
+            else if (showUnassignedAppointments) {
+                result.get('unassigned').push(appointment);
+            }
+        });
+        return result;
+    }
+    /**
+     * Gets appointments for a specific resource.
+     *
+     * @param appointments - Array of appointments.
+     * @param resourceId - The resource ID to filter by.
+     * @returns AXSchedulerAppointment[] - Filtered appointments.
+     */
+    getAppointmentsForResource(appointments, resourceId) {
+        if (resourceId === 'unassigned') {
+            return appointments.filter((appointment) => appointment.resourceId === undefined || appointment.resourceId === null);
+        }
+        return appointments.filter((appointment) => appointment.resourceId === resourceId);
+    }
+    /**
+     * Gets all resource IDs including unassigned if applicable.
+     *
+     * @param resources - Array of resources.
+     * @param showUnassignedAppointments - Whether to include unassigned appointments.
+     * @returns string[] - Array of resource IDs.
+     */
+    getAllResourceIds(resources, showUnassignedAppointments = true) {
+        const resourceIds = resources.map((resource) => resource.id.toString());
+        if (showUnassignedAppointments) {
+            resourceIds.push('unassigned');
+        }
+        return resourceIds;
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.4", ngImport: i0, type: AXSchedulerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.2.4", ngImport: i0, type: AXSchedulerService, providedIn: 'root' }); }
 }
@@ -723,7 +791,7 @@ class AXSchedulerAgendaViewComponent extends NXComponent {
         return this.readonly();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.4", ngImport: i0, type: AXSchedulerAgendaViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.4", 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 } }, outputs: { slotClickedInternal: "slotClickedInternal", slotDblClickedInternal: "slotDblClickedInternal", slotRightClickedInternal: "slotRightClickedInternal", appointmentClickedInternal: "appointmentClickedInternal", appointmentDblClickedInternal: "appointmentDblClickedInternal", appointmentRightClickedInternal: "appointmentRightClickedInternal", onActionClickInternal: "onActionClickInternal", onAppointmentDropInternal: "onAppointmentDropInternal" }, host: { properties: { "class.ax-state-readonly": "this.isReadonly" } }, 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      (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?.title ?? ''\"\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 }} )\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            [ngClass]=\"segment.cssClass ?? `ax-scheduler-${segment.priority ?? 'primary'}-periority`\"\n            [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n            [axTooltip]=\"tooltipTemplate()\"\n            [axTooltipContext]=\"segment\"\n          >\n            <div class=\"ax-scheduler-agenda-appointment-time\">\n              @if (segment.allDay) {\n                <span>{{ '@acorex:dateTime.duration.all-day' | translate | async }}</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            </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: ["ax-scheduler-agenda-view .ax-scheduler-agenda-container{height:100%;display:flex;flex-direction:column}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-view-container{gap:1rem;display:flex;position:relative;padding-inline:1rem;padding-block:.25rem;border-block-end:1px solid rgba(var(--ax-sys-color-border-lightest-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),.05)}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{font-weight: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{font-weight:700}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-view-container.ax-state-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-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{gap:.25rem;display:flex;height:3.5rem;min-width:6rem;max-width:6rem;position:sticky;align-items:start;flex-direction:column;inset-block-start:1rem;justify-content:center}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%;font-weight: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-weight:500;font-size:1.25rem}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-appointment-container{gap:.25rem;display:flex;align-items:center;flex-direction:column;justify-content:center;width:calc(100% - 7rem)}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-appointment-container .ax-scheduler-agenda-appointment{gap:.5rem;width:100%;display:flex;overflow:hidden;align-items:center;flex-direction:row;padding-block:.25rem;padding-inline:.5rem;justify-content:space-between;border-radius:calc(var(--ax-sys-border-radius) / 2)}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{font-weight:500}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-appointment-container .ax-scheduler-agenda-appointment .ax-scheduler-agenda-appointment-time{flex-shrink:0;min-width:5rem;font-size:.9em;opacity:.9}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-appointment-container .ax-scheduler-agenda-appointment .ax-scheduler-agenda-appointment-title{width:100%}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;font-style:italic;color:rgba(var(--ax-sys-color-on-surface),.6)}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-duration:var(--ax-sys-transition-duration);transition-timing-function:var(--ax-sys-transition-timing-function)}ax-scheduler-agenda-view:not(.ax-state-readonly) .ax-scheduler-agenda-view-container:hover{background-color:rgba(var(--ax-comp-scheduler-slot-hover-bg, var(--ax-sys-color-primary-surface), .1))}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: "directive", type: AXDragDirective, selector: "[axDrag]", inputs: ["dragData", "dragDisabled", "dragTransition", "dragElementClone", "dropZoneGroup", "dragStartDelay", "dragResetOnDblClick", "dragLockAxis", "dragClonedTemplate", "dragCursor", "dragBoundary", "dragTransitionDuration"], outputs: ["dragPositionChanged"] }, { kind: "directive", type: AXDropZoneDirective, selector: "[axDropZone]", inputs: ["dropZoneGroup"], outputs: ["onElementDrop", "onElementHover"], exportAs: ["axDropZone"] }, { 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: "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 }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.4", 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 } }, outputs: { slotClickedInternal: "slotClickedInternal", slotDblClickedInternal: "slotDblClickedInternal", slotRightClickedInternal: "slotRightClickedInternal", appointmentClickedInternal: "appointmentClickedInternal", appointmentDblClickedInternal: "appointmentDblClickedInternal", appointmentRightClickedInternal: "appointmentRightClickedInternal", onActionClickInternal: "onActionClickInternal", onAppointmentDropInternal: "onAppointmentDropInternal" }, host: { properties: { "class.ax-state-readonly": "this.isReadonly" } }, 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      (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?.title ?? ''\"\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 }} )\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            [ngClass]=\"segment.cssClass ?? `ax-scheduler-${segment.priority ?? 'primary'}-periority`\"\n            [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n            [axTooltip]=\"tooltipTemplate()\"\n            [axTooltipContext]=\"segment\"\n          >\n            <div class=\"ax-scheduler-agenda-appointment-time\">\n              @if (segment.allDay) {\n                <span>{{ '@acorex:dateTime.duration.all-day' | translate | async }}</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            </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: ["ax-scheduler-agenda-view .ax-scheduler-agenda-container{height:100%;display:flex;flex-direction:column}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-view-container{gap:1rem;display:flex;position:relative;padding-inline:1rem;padding-block:.25rem;border-block-end:1px solid rgba(var(--ax-sys-color-border-lightest-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),.05)}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{font-weight: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{font-weight:700}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-view-container.ax-state-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-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{gap:.25rem;display:flex;height:3.5rem;min-width:6rem;max-width:6rem;position:sticky;align-items:start;flex-direction:column;inset-block-start:1rem;justify-content:center}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%;font-weight: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-weight:500;font-size:1.25rem}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-appointment-container{gap:.25rem;display:flex;align-items:center;flex-direction:column;justify-content:center;width:calc(100% - 7rem)}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-appointment-container .ax-scheduler-agenda-appointment{gap:.5rem;width:100%;display:flex;overflow:hidden;align-items:center;flex-direction:row;padding-block:.25rem;padding-inline:.5rem;justify-content:space-between;border-radius:calc(var(--ax-sys-border-radius) / 2)}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{font-weight:500}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-appointment-container .ax-scheduler-agenda-appointment .ax-scheduler-agenda-appointment-time{flex-shrink:0;min-width:5rem;font-size:.9em;opacity:.9}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-appointment-container .ax-scheduler-agenda-appointment .ax-scheduler-agenda-appointment-title{width:100%}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;font-style:italic;color:rgba(var(--ax-sys-color-on-surface),.6)}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-duration:var(--ax-sys-transition-duration);transition-timing-function:var(--ax-sys-transition-timing-function)}ax-scheduler-agenda-view:not(.ax-state-readonly) .ax-scheduler-agenda-view-container:hover{background-color:rgba(var(--ax-comp-scheduler-slot-hover-bg, var(--ax-sys-color-primary-surface), .1))}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: AXDragDirective, selector: "[axDrag]", inputs: ["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 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.4", ngImport: i0, type: AXSchedulerAgendaViewComponent, decorators: [{
             type: Component,
@@ -731,13 +799,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.4", ngImpor
                         NgClass,
                         AsyncPipe,
                         AXFormatPipe,
-                        AXDecoratorGenericComponent,
                         AXDragDirective,
-                        AXDropZoneDirective,
                         AXTranslatorPipe,
                         AXTooltipDirective,
+                        AXDropZoneDirective,
                         AXDecoratorIconComponent,
-                        AXTooltipDirective,
+                        AXDecoratorGenericComponent,
                     ], providers: [{ provide: AXComponent, useExisting: AXSchedulerAgendaViewComponent }], 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      (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?.title ?? ''\"\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 }} )\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            [ngClass]=\"segment.cssClass ?? `ax-scheduler-${segment.priority ?? 'primary'}-periority`\"\n            [axTooltipDisabled]=\"tooltipTemplate() ? false : true\"\n            [axTooltip]=\"tooltipTemplate()\"\n            [axTooltipContext]=\"segment\"\n          >\n            <div class=\"ax-scheduler-agenda-appointment-time\">\n              @if (segment.allDay) {\n                <span>{{ '@acorex:dateTime.duration.all-day' | translate | async }}</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            </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: ["ax-scheduler-agenda-view .ax-scheduler-agenda-container{height:100%;display:flex;flex-direction:column}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-view-container{gap:1rem;display:flex;position:relative;padding-inline:1rem;padding-block:.25rem;border-block-end:1px solid rgba(var(--ax-sys-color-border-lightest-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),.05)}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{font-weight: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{font-weight:700}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-view-container.ax-state-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-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{gap:.25rem;display:flex;height:3.5rem;min-width:6rem;max-width:6rem;position:sticky;align-items:start;flex-direction:column;inset-block-start:1rem;justify-content:center}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%;font-weight: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-weight:500;font-size:1.25rem}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-appointment-container{gap:.25rem;display:flex;align-items:center;flex-direction:column;justify-content:center;width:calc(100% - 7rem)}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-appointment-container .ax-scheduler-agenda-appointment{gap:.5rem;width:100%;display:flex;overflow:hidden;align-items:center;flex-direction:row;padding-block:.25rem;padding-inline:.5rem;justify-content:space-between;border-radius:calc(var(--ax-sys-border-radius) / 2)}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{font-weight:500}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-appointment-container .ax-scheduler-agenda-appointment .ax-scheduler-agenda-appointment-time{flex-shrink:0;min-width:5rem;font-size:.9em;opacity:.9}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-appointment-container .ax-scheduler-agenda-appointment .ax-scheduler-agenda-appointment-title{width:100%}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;font-style:italic;color:rgba(var(--ax-sys-color-on-surface),.6)}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-duration:var(--ax-sys-transition-duration);transition-timing-function:var(--ax-sys-transition-timing-function)}ax-scheduler-agenda-view:not(.ax-state-readonly) .ax-scheduler-agenda-view-container:hover{background-color:rgba(var(--ax-comp-scheduler-slot-hover-bg, var(--ax-sys-color-primary-surface), .1))}\n"] }]
         }], propDecorators: { isReadonly: [{
                 type: HostBinding,
@@ -1029,21 +1096,21 @@ class AXSchedulerDayViewComponent extends NXComponent {
         return this.readonly();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.4", ngImport: i0, type: AXSchedulerDayViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.4", type: AXSchedulerDayViewComponent, isStandalone: true, selector: "ax-scheduler-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 }, 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 }, 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": "this.isReadonly" } }, providers: [{ provide: AXComponent, useExisting: AXSchedulerDayViewComponent }], 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          [ngClass]=\"\n            allDayAppointments()[0].cssClass ??\n            `ax-scheduler-${allDayAppointments()[0].priority ?? 'primary'}-periority`\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          [ngClass]=\"\n            allDayAppointments()[1].cssClass ??\n            `ax-scheduler-${allDayAppointments()[1].priority ?? 'primary'}-periority`\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-overlay-pane 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                  [ngClass]=\"appointment.cssClass ?? `ax-scheduler-${appointment.priority ?? 'primary'}-periority`\"\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.startDate | format: 'date' : { calendar: calendar() } | async }}\n                    -\n                    {{ appointment.endDate | 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    <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          [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          [ngClass]=\"appointment.cssClass ?? `ax-scheduler-${appointment.priority ?? 'primary'}-periority`\"\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: ["ax-scheduler-day-view{display:block;position:relative;background-color:inherit;min-width:var(--ax-comp-scheduler-width)}ax-scheduler-day-view .ax-scheduler-day-header{top:0;z-index:3;width:100%;display:flex;position:sticky;background-color:var(--ax-comp-scheduler-all-day-bg, inherit);border-block-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-day-view .ax-scheduler-day-header .ax-scheduler-day-header-table{z-index:3;position:sticky;inset-inline-start:0;background-color:inherit}ax-scheduler-day-view .ax-scheduler-day-header .ax-scheduler-day-header-table div{display:flex;align-items:center;justify-content:center;width:var(--ax-comp-scheduler-basic-view-blocks-width);height:var(--ax-comp-scheduler-basic-view-blocks-height);border-inline-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-day-view .ax-scheduler-day-header .ax-scheduler-day-header-table-container{width:100%;display:flex}ax-scheduler-day-view .ax-scheduler-day-header .ax-scheduler-day-header-table-container .ax-scheduler-day-header-appointment-container{gap:1rem;display:flex;width:calc(100% - 2.5rem)}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{width:100%;display:flex;overflow:hidden;flex-direction:column;padding-inline:.5rem;justify-content:center;border-radius:calc(var(--ax-sys-border-radius) / 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;text-wrap:nowrap;flex-direction:column;padding-inline:.5rem;justify-content:center;border-radius:var(--ax-sys-border-radius)}ax-scheduler-day-view .ax-scheduler-day-time-container{width:100%;display:flex;background-color:inherit}ax-scheduler-day-view .ax-scheduler-day-time-container .ax-scheduler-day-time{z-index:2;position:sticky;inset-inline-start:0;background-color:var(--ax-comp-scheduler-all-day-bg, inherit)}ax-scheduler-day-view .ax-scheduler-day-time-container .ax-scheduler-day-time div{display:block;text-align:center;padding-inline:.5rem;width:var(--ax-comp-scheduler-basic-view-blocks-width);height:calc(var(--ax-comp-scheduler-basic-view-blocks-height) * 2);border-inline-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-day-view .ax-scheduler-day-time-container .ax-scheduler-day-table-container{width:100%;position:relative}ax-scheduler-day-view .ax-scheduler-day-time-container .ax-scheduler-day-table-container .ax-scheduler-day-appointment-container{top:0;position:absolute;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{width:100%;display:flex;overflow:hidden;position:absolute;inset-inline-start:0;flex-direction:column;padding-block:.25rem;padding-inline:.5rem;border-radius:calc(var(--ax-sys-border-radius) / 2)}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{height:var(--ax-comp-scheduler-basic-view-blocks-height);display:block;padding-inline:.5rem;border-block-start:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-day-view .ax-scheduler-day-time-container .ax-scheduler-day-table-container .ax-scheduler-day-slot div:first-child{border-block-start-width:0}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-duration:var(--ax-sys-transition-duration);transition-timing-function:var(--ax-sys-transition-timing-function)}ax-scheduler-day-view:not(.ax-state-readonly) .ax-scheduler-day-header-table-container:hover,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}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: "component", type: AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "directive", type: AXDragDirective, selector: "[axDrag]", inputs: ["dragData", "dragDisabled", "dragTransition", "dragElementClone", "dropZoneGroup", "dragStartDelay", "dragResetOnDblClick", "dragLockAxis", "dragClonedTemplate", "dragCursor", "dragBoundary", "dragTransitionDuration"], outputs: ["dragPositionChanged"] }, { kind: "directive", type: AXDropZoneDirective, selector: "[axDropZone]", inputs: ["dropZoneGroup"], outputs: ["onElementDrop", "onElementHover"], exportAs: ["axDropZone"] }, { kind: "component", type: AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "directive", type: AXTooltipDirective, selector: "[axTooltip]", inputs: ["axTooltipDisabled", "axTooltip", "axTooltipContext", "axTooltipPlacement", "axTooltipOffsetX", "axTooltipOffsetY", "axTooltipOpenAfter", "axTooltipCloseAfter"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AXFormatPipe, name: "format" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.4", type: AXSchedulerDayViewComponent, isStandalone: true, selector: "ax-scheduler-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 }, 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 }, 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": "this.isReadonly" } }, providers: [{ provide: AXComponent, useExisting: AXSchedulerDayViewComponent }], 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          [ngClass]=\"\n            allDayAppointments()[0].cssClass ??\n            `ax-scheduler-${allDayAppointments()[0].priority ?? 'primary'}-periority`\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          [ngClass]=\"\n            allDayAppointments()[1].cssClass ??\n            `ax-scheduler-${allDayAppointments()[1].priority ?? 'primary'}-periority`\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-overlay-pane 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                  [ngClass]=\"appointment.cssClass ?? `ax-scheduler-${appointment.priority ?? 'primary'}-periority`\"\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.startDate | format: 'date' : { calendar: calendar() } | async }}\n                    -\n                    {{ appointment.endDate | 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    <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          [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          [ngClass]=\"appointment.cssClass ?? `ax-scheduler-${appointment.priority ?? 'primary'}-periority`\"\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: ["ax-scheduler-day-view{display:block;position:relative;background-color:inherit;min-width:var(--ax-comp-scheduler-width)}ax-scheduler-day-view .ax-scheduler-day-header{top:0;z-index:3;width:100%;display:flex;position:sticky;background-color:var(--ax-comp-scheduler-all-day-bg, inherit);border-block-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-day-view .ax-scheduler-day-header .ax-scheduler-day-header-table{z-index:3;position:sticky;inset-inline-start:0;background-color:inherit}ax-scheduler-day-view .ax-scheduler-day-header .ax-scheduler-day-header-table div{display:flex;align-items:center;justify-content:center;width:var(--ax-comp-scheduler-basic-view-blocks-width);height:var(--ax-comp-scheduler-basic-view-blocks-height);border-inline-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-day-view .ax-scheduler-day-header .ax-scheduler-day-header-table-container{width:100%;display:flex}ax-scheduler-day-view .ax-scheduler-day-header .ax-scheduler-day-header-table-container .ax-scheduler-day-header-appointment-container{gap:1rem;display:flex;width:calc(100% - 2.5rem)}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{width:100%;display:flex;overflow:hidden;flex-direction:column;padding-inline:.5rem;justify-content:center;border-radius:calc(var(--ax-sys-border-radius) / 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;text-wrap:nowrap;flex-direction:column;padding-inline:.5rem;justify-content:center;border-radius:var(--ax-sys-border-radius)}ax-scheduler-day-view .ax-scheduler-day-time-container{width:100%;display:flex;background-color:inherit}ax-scheduler-day-view .ax-scheduler-day-time-container .ax-scheduler-day-time{z-index:2;position:sticky;inset-inline-start:0;background-color:var(--ax-comp-scheduler-all-day-bg, inherit)}ax-scheduler-day-view .ax-scheduler-day-time-container .ax-scheduler-day-time div{display:block;text-align:center;padding-inline:.5rem;width:var(--ax-comp-scheduler-basic-view-blocks-width);height:calc(var(--ax-comp-scheduler-basic-view-blocks-height) * 2);border-inline-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-day-view .ax-scheduler-day-time-container .ax-scheduler-day-table-container{width:100%;position:relative}ax-scheduler-day-view .ax-scheduler-day-time-container .ax-scheduler-day-table-container .ax-scheduler-day-appointment-container{top:0;position:absolute;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{width:100%;display:flex;overflow:hidden;position:absolute;inset-inline-start:0;flex-direction:column;padding-block:.25rem;padding-inline:.5rem;border-radius:calc(var(--ax-sys-border-radius) / 2)}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{height:var(--ax-comp-scheduler-basic-view-blocks-height);display:block;padding-inline:.5rem;border-block-start:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-day-view .ax-scheduler-day-time-container .ax-scheduler-day-table-container .ax-scheduler-day-slot div:first-child{border-block-start-width:0}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-duration:var(--ax-sys-transition-duration);transition-timing-function:var(--ax-sys-transition-timing-function)}ax-scheduler-day-view:not(.ax-state-readonly) .ax-scheduler-day-header-table-container:hover,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}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: AXDragDirective, selector: "[axDrag]", inputs: ["dragData", "dragDisabled", "dragTransition", "dragElementClone", "dropZoneGroup", "dragStartDelay", "dragResetOnDblClick", "dragLockAxis", "dragClonedTemplate", "dragCursor", "dragBoundary", "dragTransitionDuration"], outputs: ["dragPositionChanged"] }, { kind: "component", type: AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "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 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.4", ngImport: i0, type: AXSchedulerDayViewComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ax-scheduler-day-view', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [
                         NgClass,
-                        AXDecoratorGenericComponent,
                         AsyncPipe,
-                        AXTranslatorPipe,
-                        AXPopoverComponent,
                         AXFormatPipe,
                         AXDragDirective,
+                        AXTranslatorPipe,
+                        AXPopoverComponent,
+                        AXTooltipDirective,
                         AXDropZoneDirective,
                         AXDecoratorIconComponent,
-                        AXTooltipDirective,
+                        AXDecoratorGenericComponent,
                     ], providers: [{ provide: AXComponent, useExisting: AXSchedulerDayViewComponent }], 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          [ngClass]=\"\n            allDayAppointments()[0].cssClass ??\n            `ax-scheduler-${allDayAppointments()[0].priority ?? 'primary'}-periority`\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          [ngClass]=\"\n            allDayAppointments()[1].cssClass ??\n            `ax-scheduler-${allDayAppointments()[1].priority ?? 'primary'}-periority`\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-overlay-pane 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                  [ngClass]=\"appointment.cssClass ?? `ax-scheduler-${appointment.priority ?? 'primary'}-periority`\"\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.startDate | format: 'date' : { calendar: calendar() } | async }}\n                    -\n                    {{ appointment.endDate | 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    <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          [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          [ngClass]=\"appointment.cssClass ?? `ax-scheduler-${appointment.priority ?? 'primary'}-periority`\"\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: ["ax-scheduler-day-view{display:block;position:relative;background-color:inherit;min-width:var(--ax-comp-scheduler-width)}ax-scheduler-day-view .ax-scheduler-day-header{top:0;z-index:3;width:100%;display:flex;position:sticky;background-color:var(--ax-comp-scheduler-all-day-bg, inherit);border-block-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-day-view .ax-scheduler-day-header .ax-scheduler-day-header-table{z-index:3;position:sticky;inset-inline-start:0;background-color:inherit}ax-scheduler-day-view .ax-scheduler-day-header .ax-scheduler-day-header-table div{display:flex;align-items:center;justify-content:center;width:var(--ax-comp-scheduler-basic-view-blocks-width);height:var(--ax-comp-scheduler-basic-view-blocks-height);border-inline-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-day-view .ax-scheduler-day-header .ax-scheduler-day-header-table-container{width:100%;display:flex}ax-scheduler-day-view .ax-scheduler-day-header .ax-scheduler-day-header-table-container .ax-scheduler-day-header-appointment-container{gap:1rem;display:flex;width:calc(100% - 2.5rem)}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{width:100%;display:flex;overflow:hidden;flex-direction:column;padding-inline:.5rem;justify-content:center;border-radius:calc(var(--ax-sys-border-radius) / 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;text-wrap:nowrap;flex-direction:column;padding-inline:.5rem;justify-content:center;border-radius:var(--ax-sys-border-radius)}ax-scheduler-day-view .ax-scheduler-day-time-container{width:100%;display:flex;background-color:inherit}ax-scheduler-day-view .ax-scheduler-day-time-container .ax-scheduler-day-time{z-index:2;position:sticky;inset-inline-start:0;background-color:var(--ax-comp-scheduler-all-day-bg, inherit)}ax-scheduler-day-view .ax-scheduler-day-time-container .ax-scheduler-day-time div{display:block;text-align:center;padding-inline:.5rem;width:var(--ax-comp-scheduler-basic-view-blocks-width);height:calc(var(--ax-comp-scheduler-basic-view-blocks-height) * 2);border-inline-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-day-view .ax-scheduler-day-time-container .ax-scheduler-day-table-container{width:100%;position:relative}ax-scheduler-day-view .ax-scheduler-day-time-container .ax-scheduler-day-table-container .ax-scheduler-day-appointment-container{top:0;position:absolute;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{width:100%;display:flex;overflow:hidden;position:absolute;inset-inline-start:0;flex-direction:column;padding-block:.25rem;padding-inline:.5rem;border-radius:calc(var(--ax-sys-border-radius) / 2)}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{height:var(--ax-comp-scheduler-basic-view-blocks-height);display:block;padding-inline:.5rem;border-block-start:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-day-view .ax-scheduler-day-time-container .ax-scheduler-day-table-container .ax-scheduler-day-slot div:first-child{border-block-start-width:0}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-duration:var(--ax-sys-transition-duration);transition-timing-function:var(--ax-sys-transition-timing-function)}ax-scheduler-day-view:not(.ax-state-readonly) .ax-scheduler-day-header-table-container:hover,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}\n"] }]
         }], propDecorators: { isReadonly: [{
                 type: HostBinding,
@@ -1278,22 +1345,20 @@ class AXSchedulerMonthViewComponent extends NXComponent {
         return this.readonly();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.4", ngImport: i0, type: AXSchedulerMonthViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.4", 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 }, 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": "this.isReadonly" } }, 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 -->\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        [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.holidayTitle ?? ''\">\n            {{ dayCell.date.dayOfMonth }}\n\n            @if (dayCell.holidayTitle) {\n              ( {{ dayCell.holidayTitle }} )\n            }\n          </span>\n        </div>\n        <div class=\"ax-scheduler-month-day-appointments\">\n          <!-- Visible 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              [ngClass]=\"segment.cssClass ?? `ax-scheduler-${segment.priority ?? 'primary'}-periority`\"\n              [class.continuation-to-next]=\"segment.isContinuationToNextDay && !segment.allDay\"\n              [class.continuation-from-prev]=\"segment.isContinuationFromPreviousDay && !segment.allDay\"\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-overlay-pane 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                    [ngClass]=\"segment.cssClass ?? `ax-scheduler-${segment.priority ?? 'primary'}-periority`\"\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 | format: 'time' : { format: 'HH:mm', calendar: calendar() } | 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", styles: ["ax-scheduler-month-view{height:100%;display:block;background-color:inherit;min-width:var(--ax-comp-scheduler-width)}ax-scheduler-month-view .ax-scheduler-month-container{height:100%;display:flex;flex-direction:column;background-color:inherit}ax-scheduler-month-view .ax-scheduler-month-weekdays{top:0;z-index:2;width:100%;display:grid;flex-shrink:0;position:sticky;padding:.5rem 0;text-align:center;grid-template-columns:repeat(7,minmax(0,1fr));background-color:var(--ax-comp-scheduler-all-day-bg, inherit);border-bottom:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-month-view .ax-scheduler-month-weekdays .ax-scheduler-month-weekday{font-weight:500;font-size:.875rem}ax-scheduler-month-view .ax-scheduler-month-grid{width:100%;flex-grow:1;display:grid;grid-auto-rows:minmax(5rem,auto);grid-template-columns:repeat(7,minmax(0,1fr));border-left:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell{padding:.25rem;overflow:hidden;position:relative;border-right:1px solid rgba(var(--ax-sys-color-border-lightest-surface));border-bottom:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}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),.2)}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),.5)}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),.05)}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell.ax-state-today .ax-scheduler-month-day-number{font-weight: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),.025)}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),.5)}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell.ax-state-holiday .ax-scheduler-month-day-number{font-weight:700;color:rgba(var(--ax-sys-color-danger-surface))}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: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{text-align:center;margin-bottom:.25rem}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell .ax-scheduler-month-day-header .ax-scheduler-month-day-number{max-width:100%;font-size:.875rem;display:inline-block}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell .ax-scheduler-month-day-appointments{gap:.125rem;display:flex;overflow:hidden;flex-direction:column}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;font-size:.75rem;white-space:nowrap;border-radius:.25rem;text-overflow:ellipsis;padding:.125rem .25rem}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell .ax-scheduler-month-day-appointments .ax-scheduler-month-overflow-badge{cursor:pointer;text-align:left;font-size:.75rem;padding:.125rem 0;margin-top:.125rem}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:underline}ax-scheduler-month-view:not(.ax-state-readonly) .ax-scheduler-month-appointment-chip{cursor:pointer}ax-scheduler-month-view:not(.ax-state-readonly) .ax-scheduler-month-day-cell{cursor:pointer;transition-property:background-color;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}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "directive", type: AXDragDirective, selector: "[axDrag]", inputs: ["dragData", "dragDisabled", "dragTransition", "dragElementClone", "dropZoneGroup", "dragStartDelay", "dragResetOnDblClick", "dragLockAxis", "dragClonedTemplate", "dragCursor", "dragBoundary", "dragTransitionDuration"], outputs: ["dragPositionChanged"] }, { kind: "directive", type: AXDropZoneDirective, selector: "[axDropZone]", inputs: ["dropZoneGroup"], outputs: ["onElementDrop", "onElementHover"], exportAs: ["axDropZone"] }, { 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: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AXFormatPipe, name: "format" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.4", 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 }, 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": "this.isReadonly" } }, 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 -->\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        [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.holidayTitle ?? ''\">\n            {{ dayCell.date.dayOfMonth }}\n\n            @if (dayCell.holidayTitle) {\n              ( {{ dayCell.holidayTitle }} )\n            }\n          </span>\n        </div>\n        <div class=\"ax-scheduler-month-day-appointments\">\n          <!-- Visible 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              [ngClass]=\"segment.cssClass ?? `ax-scheduler-${segment.priority ?? 'primary'}-periority`\"\n              [class.continuation-to-next]=\"segment.isContinuationToNextDay && !segment.allDay\"\n              [class.continuation-from-prev]=\"segment.isContinuationFromPreviousDay && !segment.allDay\"\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-overlay-pane 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                    [ngClass]=\"segment.cssClass ?? `ax-scheduler-${segment.priority ?? 'primary'}-periority`\"\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 | format: 'time' : { format: 'HH:mm', calendar: calendar() } | 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", styles: ["ax-scheduler-month-view{height:100%;display:block;background-color:inherit;min-width:var(--ax-comp-scheduler-width)}ax-scheduler-month-view .ax-scheduler-month-container{height:100%;display:flex;flex-direction:column;background-color:inherit}ax-scheduler-month-view .ax-scheduler-month-weekdays{top:0;z-index:2;width:100%;display:grid;flex-shrink:0;position:sticky;padding:.5rem 0;text-align:center;grid-template-columns:repeat(7,minmax(0,1fr));background-color:var(--ax-comp-scheduler-all-day-bg, inherit);border-bottom:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-month-view .ax-scheduler-month-weekdays .ax-scheduler-month-weekday{font-weight:500;font-size:.875rem}ax-scheduler-month-view .ax-scheduler-month-grid{width:100%;flex-grow:1;display:grid;grid-auto-rows:minmax(5rem,auto);grid-template-columns:repeat(7,minmax(0,1fr));border-left:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell{padding:.25rem;overflow:hidden;position:relative;border-right:1px solid rgba(var(--ax-sys-color-border-lightest-surface));border-bottom:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}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),.2)}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),.5)}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),.05)}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell.ax-state-today .ax-scheduler-month-day-number{font-weight: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),.025)}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),.5)}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell.ax-state-holiday .ax-scheduler-month-day-number{font-weight:700;color:rgba(var(--ax-sys-color-danger-surface))}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: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{text-align:center;margin-bottom:.25rem}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell .ax-scheduler-month-day-header .ax-scheduler-month-day-number{max-width:100%;font-size:.875rem;display:inline-block}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell .ax-scheduler-month-day-appointments{gap:.125rem;display:flex;overflow:hidden;flex-direction:column}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;font-size:.75rem;white-space:nowrap;border-radius:.25rem;text-overflow:ellipsis;padding:.125rem .25rem}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell .ax-scheduler-month-day-appointments .ax-scheduler-month-overflow-badge{cursor:pointer;text-align:left;font-size:.75rem;padding:.125rem 0;margin-top:.125rem}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:underline}ax-scheduler-month-view:not(.ax-state-readonly) .ax-scheduler-month-appointment-chip{cursor:pointer}ax-scheduler-month-view:not(.ax-state-readonly) .ax-scheduler-month-day-cell{cursor:pointer;transition-property:background-color;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}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: AXDragDirective, selector: "[axDrag]", inputs: ["dragData", "dragDisabled", "dragTransition", "dragElementClone", "dropZoneGroup", "dragStartDelay", "dragResetOnDblClick", "dragLockAxis", "dragClonedTemplate", "dragCursor", "dragBoundary", "dragTransitionDuration"], outputs: ["dragPositionChanged"] }, { kind: "component", type: AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "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 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.4", ngImport: i0, type: AXSchedulerMonthViewComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ax-scheduler-month-view', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [
                         NgClass,
                         AsyncPipe,
-                        AXTranslatorPipe,
-                        AXPopoverComponent,
                         AXFormatPipe,
-                        AsyncPipe,
                         AXDragDirective,
-                        AXDropZoneDirective,
+                        AXTranslatorPipe,
+                        AXPopoverComponent,
                         AXTooltipDirective,
+                        AXDropZoneDirective,
                         AXDecoratorIconComponent,
-                        AXTooltipDirective,
                     ], providers: [{ provide: AXComponent, useExisting: AXSchedulerMonthViewComponent }], 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 -->\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        [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.holidayTitle ?? ''\">\n            {{ dayCell.date.dayOfMonth }}\n\n            @if (dayCell.holidayTitle) {\n              ( {{ dayCell.holidayTitle }} )\n            }\n          </span>\n        </div>\n        <div class=\"ax-scheduler-month-day-appointments\">\n          <!-- Visible 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              [ngClass]=\"segment.cssClass ?? `ax-scheduler-${segment.priority ?? 'primary'}-periority`\"\n              [class.continuation-to-next]=\"segment.isContinuationToNextDay && !segment.allDay\"\n              [class.continuation-from-prev]=\"segment.isContinuationFromPreviousDay && !segment.allDay\"\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-overlay-pane 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                    [ngClass]=\"segment.cssClass ?? `ax-scheduler-${segment.priority ?? 'primary'}-periority`\"\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 | format: 'time' : { format: 'HH:mm', calendar: calendar() } | 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", styles: ["ax-scheduler-month-view{height:100%;display:block;background-color:inherit;min-width:var(--ax-comp-scheduler-width)}ax-scheduler-month-view .ax-scheduler-month-container{height:100%;display:flex;flex-direction:column;background-color:inherit}ax-scheduler-month-view .ax-scheduler-month-weekdays{top:0;z-index:2;width:100%;display:grid;flex-shrink:0;position:sticky;padding:.5rem 0;text-align:center;grid-template-columns:repeat(7,minmax(0,1fr));background-color:var(--ax-comp-scheduler-all-day-bg, inherit);border-bottom:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-month-view .ax-scheduler-month-weekdays .ax-scheduler-month-weekday{font-weight:500;font-size:.875rem}ax-scheduler-month-view .ax-scheduler-month-grid{width:100%;flex-grow:1;display:grid;grid-auto-rows:minmax(5rem,auto);grid-template-columns:repeat(7,minmax(0,1fr));border-left:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell{padding:.25rem;overflow:hidden;position:relative;border-right:1px solid rgba(var(--ax-sys-color-border-lightest-surface));border-bottom:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}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),.2)}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),.5)}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),.05)}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell.ax-state-today .ax-scheduler-month-day-number{font-weight: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),.025)}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),.5)}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell.ax-state-holiday .ax-scheduler-month-day-number{font-weight:700;color:rgba(var(--ax-sys-color-danger-surface))}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: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{text-align:center;margin-bottom:.25rem}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell .ax-scheduler-month-day-header .ax-scheduler-month-day-number{max-width:100%;font-size:.875rem;display:inline-block}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell .ax-scheduler-month-day-appointments{gap:.125rem;display:flex;overflow:hidden;flex-direction:column}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;font-size:.75rem;white-space:nowrap;border-radius:.25rem;text-overflow:ellipsis;padding:.125rem .25rem}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell .ax-scheduler-month-day-appointments .ax-scheduler-month-overflow-badge{cursor:pointer;text-align:left;font-size:.75rem;padding:.125rem 0;margin-top:.125rem}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:underline}ax-scheduler-month-view:not(.ax-state-readonly) .ax-scheduler-month-appointment-chip{cursor:pointer}ax-scheduler-month-view:not(.ax-state-readonly) .ax-scheduler-month-day-cell{cursor:pointer;transition-property:background-color;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}\n"] }]
         }], propDecorators: { isReadonly: [{
                 type: HostBinding,
@@ -1316,9 +1381,30 @@ class AXSchedulerTimelineDayViewComponent extends NXComponent {
         this.date = input.required(...(ngDevMode ? [{ debugName: "date" }] : []));
         this.endDayHour = input.required(...(ngDevMode ? [{ debugName: "endDayHour" }] : []));
         this.startDayHour = input.required(...(ngDevMode ? [{ debugName: "startDayHour" }] : []));
+        this.resources = input([], ...(ngDevMode ? [{ debugName: "resources" }] : []));
+        this.showUnassignedAppointments = input(true, ...(ngDevMode ? [{ debugName: "showUnassignedAppointments" }] : []));
+        this.showResourceHeaders = input(true, ...(ngDevMode ? [{ debugName: "showResourceHeaders" }] : [])); // New input to control resource header visibility
         this.appointments = input([], ...(ngDevMode ? [{ debugName: "appointments" }] : []));
         this.tooltipTemplate = input(...(ngDevMode ? [undefined, { debugName: "tooltipTemplate" }] : []));
         this.dragStartSlotId = signal(null, ...(ngDevMode ? [{ debugName: "dragStartSlotId" }] : []));
+        this.dragStartSlotResourceId = signal(null, ...(ngDevMode ? [{ debugName: "dragStartSlotResourceId" }] : []));
+        /**
+         * Gets appointments grouped by resources for timeline view.
+         */
+        this.appointmentsByResource = computed(() => {
+            const allAppointments = this.appointments();
+            const resources = this.resources();
+            const showUnassigned = this.showUnassignedAppointments();
+            return this.schedulerService.filterAppointmentsByResources(allAppointments, resources, showUnassigned);
+        }, ...(ngDevMode ? [{ debugName: "appointmentsByResource" }] : []));
+        /**
+         * Gets all resource IDs including unassigned if applicable.
+         */
+        this.resourceIds = computed(() => {
+            const resources = this.resources();
+            const showUnassigned = this.showUnassignedAppointments();
+            return this.schedulerService.getAllResourceIds(resources, showUnassigned);
+        }, ...(ngDevMode ? [{ debugName: "resourceIds" }] : []));
         /**
          * Processes original appointments to get segments relevant to this specific day and its viewable hours.
          * Filters out original all-day events.
@@ -1334,6 +1420,26 @@ class AXSchedulerTimelineDayViewComponent extends NXComponent {
             const segmentsOnThisDay = [];
             for (const appt of allOriginalAppointments) {
                 if (appt.allDay) {
+                    // For all-day appointments, create a segment that spans the full day
+                    const dayStart = viewDate.startOf('day');
+                    const dayEnd = viewDate.endOf('day');
+                    // Check if the all-day appointment overlaps with this day
+                    const apptStart = this.calendarService.create(appt.startDate, this.calendar()).startOf('day');
+                    const apptEnd = this.calendarService.create(appt.endDate, this.calendar()).startOf('day');
+                    if (apptStart.compare(dayEnd, 'day') <= 0 && apptEnd.compare(dayStart, 'day') >= 0) {
+                        const allDaySegment = {
+                            ...appt,
+                            startDate: dayStart.date,
+                            endDate: dayEnd.date,
+                            allDay: true,
+                            originalStartDate: appt.startDate,
+                            originalEndDate: appt.endDate,
+                            isContinuationFromPreviousDay: apptStart.compare(dayStart, 'day') < 0,
+                            isContinuationToNextDay: apptEnd.compare(dayStart, 'day') > 0,
+                            originalAppointmentRef: appt,
+                        };
+                        segmentsOnThisDay.push(allDaySegment);
+                    }
                     continue;
                 }
                 const segment = this.schedulerService.getClonedAppointmentSegmentOnDay(appt, viewDate, viewConfigStartHour, viewConfigEndHour, false);
@@ -1443,7 +1549,7 @@ class AXSchedulerTimelineDayViewComponent extends NXComponent {
         if (slotData)
             this.schedulerService.handleEvent({ nativeEvent: mouseEvent, slot: slotData, sender: this.scheduler }, this.eventOutputMap, 'slot');
     }
-    handleDrop(e, startDate) {
+    handleDrop(e, startDate, resourceId) {
         const slotData = this.schedulerService.getSlotData(startDate, 'timeline-day');
         const droppedItem = e.dropped.dragData();
         const originalAppointment = this.schedulerService.getOriginalAppointment(droppedItem);
@@ -1452,12 +1558,19 @@ class AXSchedulerTimelineDayViewComponent extends NXComponent {
             endDate: originalAppointment.endDate,
             startDate: originalAppointment.startDate,
         };
+        // Convert 'unassigned' string to undefined for proper unassigned appointments
+        const actualResourceId = resourceId === 'unassigned' ? undefined : resourceId;
+        // Check if it's the same slot (same time AND same resource)
+        const dragStartSlotId = this.dragStartSlotId();
+        const dropSlotId = e.sender.element().dataset['slotId'];
+        const dragStartResourceId = this.dragStartSlotResourceId();
+        const isSameSlotDrop = dragStartSlotId === dropSlotId && dragStartResourceId === resourceId;
         this.onAppointmentDropInternal.emit({
             dropEvent: e,
-            slot: slotData,
+            slot: { ...slotData, resourceId: actualResourceId },
             sender: this.scheduler,
             appointment: appointmentRef,
-            isSameSlotDrop: this.dragStartSlotId() === e.sender.element().dataset['slotId'],
+            isSameSlotDrop,
         });
     }
     handleActionClick(event, appointmentItem) {
@@ -1469,30 +1582,161 @@ class AXSchedulerTimelineDayViewComponent extends NXComponent {
             sender: this.scheduler,
         });
     }
+    /**
+     * Gets appointments for a specific resource.
+     */
+    getAppointmentsForResource(resourceId) {
+        const appointmentsByResource = this.appointmentsByResource();
+        return appointmentsByResource.get(resourceId) || [];
+    }
+    /**
+     * Gets resource title by ID.
+     */
+    getResourceTitle(resourceId) {
+        if (resourceId === 'unassigned') {
+            return 'Unassigned';
+        }
+        const resources = this.resources();
+        const resource = resources.find((r) => r.id.toString() === resourceId);
+        return resource?.title || resourceId;
+    }
+    /**
+     * Gets appointment layouts for a specific resource with proper positioning.
+     */
+    getAppointmentLayoutsForResource(resourceId) {
+        const resourceAppointments = this.getAppointmentsForResource(resourceId);
+        const viewDate = this.date();
+        const viewConfigStartHour = this.startDayHour();
+        const viewConfigEndHour = this.endDayHour();
+        if (!viewDate || resourceAppointments.length === 0) {
+            return [];
+        }
+        // Get segments for this specific resource
+        const resourceSegments = [];
+        for (const appt of resourceAppointments) {
+            const segment = this.schedulerService.getClonedAppointmentSegmentOnDay(appt, viewDate, viewConfigStartHour, viewConfigEndHour);
+            if (segment) {
+                resourceSegments.push(segment);
+            }
+        }
+        const finalLayouts = [];
+        const sortedAppointments = orderBy(resourceSegments, [(seg) => seg.startDate.getTime(), (seg) => seg.originalEndDate.getTime()], ['asc', 'desc']);
+        const rowEndTimes = [];
+        for (const segment of sortedAppointments) {
+            const horizLayout = this.schedulerService.calculateTimelineLayout(segment, viewConfigStartHour, viewConfigEndHour);
+            if (!horizLayout)
+                continue;
+            const segmentStartTime = this.calendarService.create(segment.startDate, this.calendar());
+            const segmentEndTime = this.calendarService.create(segment.endDate, this.calendar());
+            let assignedRowIndex = -1;
+            for (let i = 0; i < rowEndTimes.length; i++) {
+                if (segmentStartTime.compare(rowEndTimes[i], 'minute') >= 0) {
+                    assignedRowIndex = i;
+                    break;
+                }
+            }
+            if (assignedRowIndex === -1) {
+                assignedRowIndex = rowEndTimes.length;
+                rowEndTimes.push(segmentEndTime);
+            }
+            else {
+                rowEndTimes[assignedRowIndex] = segmentEndTime;
+            }
+            const layoutHeight = 'var(--ax-comp-scheduler-timeline-view-blocks-height)';
+            const layoutLeft = horizLayout.left;
+            const layoutWidth = `calc(${horizLayout.width} - ${this.GAP_PX}px)`;
+            const layoutTop = `calc(${assignedRowIndex} * (${layoutHeight} + ${this.GAP_PX}px))`;
+            finalLayouts.push({
+                appointment: segment,
+                layoutLeft,
+                layoutWidth,
+                layoutTop,
+                layoutHeight,
+            });
+        }
+        return finalLayouts;
+    }
+    /**
+     * Calculates the height for a resource row based on its appointments.
+     */
+    getResourceRowHeight(resourceId) {
+        const layouts = this.getAppointmentLayoutsForResource(resourceId);
+        if (layouts.length === 0) {
+            // If no appointments, use minimum height (one appointment height)
+            return 'var(--ax-comp-scheduler-basic-view-blocks-height)';
+        }
+        // Calculate the maximum number of overlapping rows needed
+        const appointments = layouts.map((layout) => layout.appointment);
+        const maxOverlappingRows = this.calculateMaxOverlappingRows(appointments);
+        // Use CSS calc() to handle the height calculation with CSS variables
+        return `calc(var(--ax-comp-scheduler-basic-view-blocks-height) * ${maxOverlappingRows} + ${this.GAP_PX}px * ${Math.max(0, maxOverlappingRows)})`;
+    }
+    /**
+     * Calculates the maximum number of overlapping appointment rows needed.
+     */
+    calculateMaxOverlappingRows(appointments) {
+        if (appointments.length === 0)
+            return 0;
+        if (appointments.length === 1)
+            return 1;
+        // Sort appointments by start time, then by end time (descending)
+        const sortedAppointments = [...appointments].sort((a, b) => {
+            const startDiff = a.startDate.getTime() - b.startDate.getTime();
+            if (startDiff !== 0)
+                return startDiff;
+            return b.endDate.getTime() - a.endDate.getTime(); // Longer appointments first
+        });
+        // Simulate the row assignment algorithm from the original layout
+        const rowEndTimes = [];
+        let maxRows = 0;
+        for (const appointment of sortedAppointments) {
+            let assignedRowIndex = -1;
+            // Find the first available row
+            for (let i = 0; i < rowEndTimes.length; i++) {
+                if (appointment.startDate >= rowEndTimes[i]) {
+                    assignedRowIndex = i;
+                    break;
+                }
+            }
+            // If no available row, create a new one
+            if (assignedRowIndex === -1) {
+                assignedRowIndex = rowEndTimes.length;
+                rowEndTimes.push(appointment.endDate);
+            }
+            else {
+                // Update the row's end time
+                rowEndTimes[assignedRowIndex] = appointment.endDate;
+            }
+            // Track the maximum number of rows used
+            maxRows = Math.max(maxRows, rowEndTimes.length);
+        }
+        return Math.max(maxRows, 1); // Minimum one row
+    }
     getSlotId(e) {
         const dropListElement = this.document
             .elementsFromPoint(e.clientX, e.clientY)
             .find((el) => el instanceof HTMLElement && el.dataset['slotId'] !== undefined);
         this.dragStartSlotId.set(dropListElement ? dropListElement.dataset['slotId'] : null);
+        this.dragStartSlotResourceId.set(dropListElement ? dropListElement.dataset['resourceId'] : null);
     }
     get isReadonly() {
         return this.readonly();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.4", ngImport: i0, type: AXSchedulerTimelineDayViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.4", 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 }, 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 }, 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": "this.isReadonly" } }, providers: [{ provide: AXComponent, useExisting: AXSchedulerTimelineDayViewComponent }], usesInheritance: true, ngImport: i0, template: "<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  <div class=\"ax-scheduler-timeline-appointment-container\">\n    @for (layout of appointmentLayouts(); 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        [style.insetBlockStart]=\"layout.layoutTop\"\n        [style.insetInlineStart]=\"layout.layoutLeft\"\n        [ngClass]=\"layout.appointment.cssClass ?? `ax-scheduler-${layout.appointment.priority ?? 'primary'}-periority`\"\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          {{ layout.appointment.originalEndDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}\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", styles: ["ax-scheduler-timeline-day-view{height:100%;position:relative;display:inline-flex;flex-direction:column;background-color:inherit}ax-scheduler-timeline-day-view .ax-scheduler-timeline-header{top:0;z-index:2;width:100%;display:flex;position:sticky;background-color:var(--ax-comp-scheduler-all-day-bg, inherit);border-block-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-day-view .ax-scheduler-timeline-header .ax-scheduler-timeline-header-hours{position:relative;padding:.25rem .5rem;width:var(--ax-comp-scheduler-timeline-view-blocks-width);border-inline-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-day-view .ax-scheduler-timeline-header .ax-scheduler-timeline-header-hours span{position:sticky;inset-inline-start:.5rem}ax-scheduler-timeline-day-view .ax-scheduler-timeline-content{height:100%;position:relative}ax-scheduler-timeline-day-view .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container{top:0;width:100%;height:100%;position:absolute}ax-scheduler-timeline-day-view .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container .ax-scheduler-timeline-appointment{width:100%;display:flex;overflow:hidden;position:absolute;inset-inline-start:0;flex-direction:column;padding-block:.25rem;padding-inline:.5rem;border-radius:calc(var(--ax-sys-border-radius) / 2)}ax-scheduler-timeline-day-view .ax-scheduler-timeline-content .ax-scheduler-timeline-slot-row{height:100%;display:flex}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:1px solid 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-duration:var(--ax-sys-transition-duration);transition-timing-function:var(--ax-sys-transition-timing-function)}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}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: "directive", type: AXDragDirective, selector: "[axDrag]", inputs: ["dragData", "dragDisabled", "dragTransition", "dragElementClone", "dropZoneGroup", "dragStartDelay", "dragResetOnDblClick", "dragLockAxis", "dragClonedTemplate", "dragCursor", "dragBoundary", "dragTransitionDuration"], outputs: ["dragPositionChanged"] }, { kind: "directive", type: AXDropZoneDirective, selector: "[axDropZone]", inputs: ["dropZoneGroup"], outputs: ["onElementDrop", "onElementHover"], exportAs: ["axDropZone"] }, { kind: "component", type: AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "directive", type: AXTooltipDirective, selector: "[axTooltip]", inputs: ["axTooltipDisabled", "axTooltip", "axTooltipContext", "axTooltipPlacement", "axTooltipOffsetX", "axTooltipOffsetY", "axTooltipOpenAfter", "axTooltipCloseAfter"] }, { kind: "pipe", type: AXFormatPipe, name: "format" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.4", 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 }, 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 }, resources: { classPropertyName: "resources", publicName: "resources", isSignal: true, isRequired: false, transformFunction: null }, showUnassignedAppointments: { classPropertyName: "showUnassignedAppointments", publicName: "showUnassignedAppointments", isSignal: true, isRequired: false, transformFunction: null }, showResourceHeaders: { classPropertyName: "showResourceHeaders", publicName: "showResourceHeaders", 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": "this.isReadonly" } }, providers: [{ provide: AXComponent, useExisting: AXSchedulerTimelineDayViewComponent }], 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    <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          [style.insetBlockStart]=\"layout.layoutTop\"\n          [style.insetInlineStart]=\"layout.layoutLeft\"\n          [ngClass]=\"\n            layout.appointment.cssClass ?? `ax-scheduler-${layout.appointment.priority ?? 'primary'}-periority`\n          \"\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      @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              <span class=\"ax-scheduler-timeline-resource-title\">{{ getResourceTitle(resourceId) }}</span>\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                  [style.insetBlockStart]=\"layout.layoutTop\"\n                  [style.insetInlineStart]=\"layout.layoutLeft\"\n                  [ngClass]=\"\n                    layout.appointment.cssClass ?? `ax-scheduler-${layout.appointment.priority ?? 'primary'}-periority`\n                  \"\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: ["ax-scheduler-timeline-day-view{height:100%;position:relative;display:inline-flex;flex-direction:column;background-color:inherit}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container{height:auto;display:flex;min-height:100%;overflow:visible;flex-direction:column;background-color:inherit}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-header-sticky{position:sticky;top:0;z-index:10;display:flex;background-color:inherit;border-bottom:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-header-sticky .ax-scheduler-timeline-resource-header-placeholder{left:0;z-index:15;display:flex;position:sticky;align-items:center;justify-content:center;background-color:inherit;width:var(--ax-comp-scheduler-resource-header-width, 8rem);min-width:var(--ax-comp-scheduler-resource-header-width, 8rem);border-right:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-rows{flex:1;overflow:visible;position:relative;background-color:inherit}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-row{display:flex;min-height:0;border-bottom:1px solid rgba(var(--ax-sys-color-border-lightest-surface));width:max-content;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;padding:.5rem;align-items:center;justify-content:center;background-color:inherit;width:var(--ax-comp-scheduler-resource-header-width, 8rem);min-width:var(--ax-comp-scheduler-resource-header-width, 8rem);border-right:1px solid 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-header.ax-scheduler-timeline-resource-header-sticky{position:sticky;left: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{font-weight:500;font-size:.875rem;text-align:center;word-break:break-word}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-row .ax-scheduler-timeline-resource-content{flex:1;display:flex;flex-direction:column;min-width:0;position:relative}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{top:0;width:100%;height:100%;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-appointment-container .ax-scheduler-timeline-appointment{width:100%;display:flex;overflow:hidden;position:absolute;inset-inline-start:0;flex-direction:column;padding-block:.25rem;padding-inline:.5rem;border-radius:calc(var(--ax-sys-border-radius) / 2)}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{height:100%;display:flex;position:relative}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{width:var(--ax-comp-scheduler-timeline-view-blocks-width);border-inline-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface));position:relative}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:\"\";position:absolute;top:0;right:0;width:1px;height:100%;background-color:rgba(var(--ax-sys-color-border-lightest-surface),.3)}ax-scheduler-timeline-day-view .ax-scheduler-timeline-header{top:0;z-index:2;width:100%;display:flex;position:sticky;background-color:var(--ax-comp-scheduler-all-day-bg, inherit);border-block-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-day-view .ax-scheduler-timeline-header .ax-scheduler-timeline-header-hours{position:relative;padding:.25rem .5rem;width:var(--ax-comp-scheduler-timeline-view-blocks-width);border-inline-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-day-view .ax-scheduler-timeline-header .ax-scheduler-timeline-header-hours span{position:sticky;inset-inline-start:.5rem}ax-scheduler-timeline-day-view .ax-scheduler-timeline-content{height:100%;position:relative}ax-scheduler-timeline-day-view .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container{top:0;width:100%;height:100%;position:absolute}ax-scheduler-timeline-day-view .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container .ax-scheduler-timeline-appointment{width:100%;display:flex;overflow:hidden;position:absolute;inset-inline-start:0;flex-direction:column;padding-block:.25rem;padding-inline:.5rem;border-radius:calc(var(--ax-sys-border-radius) / 2)}ax-scheduler-timeline-day-view .ax-scheduler-timeline-content .ax-scheduler-timeline-slot-row{height:100%;display:flex}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:1px solid 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-duration:var(--ax-sys-transition-duration);transition-timing-function:var(--ax-sys-transition-timing-function)}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}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: AXDragDirective, selector: "[axDrag]", inputs: ["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 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.4", ngImport: i0, type: AXSchedulerTimelineDayViewComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ax-scheduler-timeline-day-view', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [
                         NgClass,
-                        AXDecoratorGenericComponent,
-                        AXFormatPipe,
                         AsyncPipe,
+                        AXFormatPipe,
                         AXDragDirective,
+                        AXTooltipDirective,
                         AXDropZoneDirective,
                         AXDecoratorIconComponent,
-                        AXTooltipDirective,
-                    ], providers: [{ provide: AXComponent, useExisting: AXSchedulerTimelineDayViewComponent }], template: "<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  <div class=\"ax-scheduler-timeline-appointment-container\">\n    @for (layout of appointmentLayouts(); 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        [style.insetBlockStart]=\"layout.layoutTop\"\n        [style.insetInlineStart]=\"layout.layoutLeft\"\n        [ngClass]=\"layout.appointment.cssClass ?? `ax-scheduler-${layout.appointment.priority ?? 'primary'}-periority`\"\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          {{ layout.appointment.originalEndDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}\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", styles: ["ax-scheduler-timeline-day-view{height:100%;position:relative;display:inline-flex;flex-direction:column;background-color:inherit}ax-scheduler-timeline-day-view .ax-scheduler-timeline-header{top:0;z-index:2;width:100%;display:flex;position:sticky;background-color:var(--ax-comp-scheduler-all-day-bg, inherit);border-block-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-day-view .ax-scheduler-timeline-header .ax-scheduler-timeline-header-hours{position:relative;padding:.25rem .5rem;width:var(--ax-comp-scheduler-timeline-view-blocks-width);border-inline-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-day-view .ax-scheduler-timeline-header .ax-scheduler-timeline-header-hours span{position:sticky;inset-inline-start:.5rem}ax-scheduler-timeline-day-view .ax-scheduler-timeline-content{height:100%;position:relative}ax-scheduler-timeline-day-view .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container{top:0;width:100%;height:100%;position:absolute}ax-scheduler-timeline-day-view .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container .ax-scheduler-timeline-appointment{width:100%;display:flex;overflow:hidden;position:absolute;inset-inline-start:0;flex-direction:column;padding-block:.25rem;padding-inline:.5rem;border-radius:calc(var(--ax-sys-border-radius) / 2)}ax-scheduler-timeline-day-view .ax-scheduler-timeline-content .ax-scheduler-timeline-slot-row{height:100%;display:flex}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:1px solid 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-duration:var(--ax-sys-transition-duration);transition-timing-function:var(--ax-sys-transition-timing-function)}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}\n"] }]
+                        AXDecoratorGenericComponent,
+                    ], providers: [{ provide: AXComponent, useExisting: AXSchedulerTimelineDayViewComponent }], 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    <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          [style.insetBlockStart]=\"layout.layoutTop\"\n          [style.insetInlineStart]=\"layout.layoutLeft\"\n          [ngClass]=\"\n            layout.appointment.cssClass ?? `ax-scheduler-${layout.appointment.priority ?? 'primary'}-periority`\n          \"\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      @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              <span class=\"ax-scheduler-timeline-resource-title\">{{ getResourceTitle(resourceId) }}</span>\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                  [style.insetBlockStart]=\"layout.layoutTop\"\n                  [style.insetInlineStart]=\"layout.layoutLeft\"\n                  [ngClass]=\"\n                    layout.appointment.cssClass ?? `ax-scheduler-${layout.appointment.priority ?? 'primary'}-periority`\n                  \"\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: ["ax-scheduler-timeline-day-view{height:100%;position:relative;display:inline-flex;flex-direction:column;background-color:inherit}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container{height:auto;display:flex;min-height:100%;overflow:visible;flex-direction:column;background-color:inherit}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-header-sticky{position:sticky;top:0;z-index:10;display:flex;background-color:inherit;border-bottom:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-header-sticky .ax-scheduler-timeline-resource-header-placeholder{left:0;z-index:15;display:flex;position:sticky;align-items:center;justify-content:center;background-color:inherit;width:var(--ax-comp-scheduler-resource-header-width, 8rem);min-width:var(--ax-comp-scheduler-resource-header-width, 8rem);border-right:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-rows{flex:1;overflow:visible;position:relative;background-color:inherit}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-row{display:flex;min-height:0;border-bottom:1px solid rgba(var(--ax-sys-color-border-lightest-surface));width:max-content;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;padding:.5rem;align-items:center;justify-content:center;background-color:inherit;width:var(--ax-comp-scheduler-resource-header-width, 8rem);min-width:var(--ax-comp-scheduler-resource-header-width, 8rem);border-right:1px solid 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-header.ax-scheduler-timeline-resource-header-sticky{position:sticky;left: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{font-weight:500;font-size:.875rem;text-align:center;word-break:break-word}ax-scheduler-timeline-day-view .ax-scheduler-timeline-resource-container .ax-scheduler-timeline-resource-row .ax-scheduler-timeline-resource-content{flex:1;display:flex;flex-direction:column;min-width:0;position:relative}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{top:0;width:100%;height:100%;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-appointment-container .ax-scheduler-timeline-appointment{width:100%;display:flex;overflow:hidden;position:absolute;inset-inline-start:0;flex-direction:column;padding-block:.25rem;padding-inline:.5rem;border-radius:calc(var(--ax-sys-border-radius) / 2)}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{height:100%;display:flex;position:relative}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{width:var(--ax-comp-scheduler-timeline-view-blocks-width);border-inline-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface));position:relative}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:\"\";position:absolute;top:0;right:0;width:1px;height:100%;background-color:rgba(var(--ax-sys-color-border-lightest-surface),.3)}ax-scheduler-timeline-day-view .ax-scheduler-timeline-header{top:0;z-index:2;width:100%;display:flex;position:sticky;background-color:var(--ax-comp-scheduler-all-day-bg, inherit);border-block-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-day-view .ax-scheduler-timeline-header .ax-scheduler-timeline-header-hours{position:relative;padding:.25rem .5rem;width:var(--ax-comp-scheduler-timeline-view-blocks-width);border-inline-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-day-view .ax-scheduler-timeline-header .ax-scheduler-timeline-header-hours span{position:sticky;inset-inline-start:.5rem}ax-scheduler-timeline-day-view .ax-scheduler-timeline-content{height:100%;position:relative}ax-scheduler-timeline-day-view .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container{top:0;width:100%;height:100%;position:absolute}ax-scheduler-timeline-day-view .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container .ax-scheduler-timeline-appointment{width:100%;display:flex;overflow:hidden;position:absolute;inset-inline-start:0;flex-direction:column;padding-block:.25rem;padding-inline:.5rem;border-radius:calc(var(--ax-sys-border-radius) / 2)}ax-scheduler-timeline-day-view .ax-scheduler-timeline-content .ax-scheduler-timeline-slot-row{height:100%;display:flex}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:1px solid 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-duration:var(--ax-sys-transition-duration);transition-timing-function:var(--ax-sys-transition-timing-function)}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}\n"] }]
         }], propDecorators: { isReadonly: [{
                 type: HostBinding,
                 args: ['class.ax-state-readonly']
@@ -1512,13 +1756,19 @@ class AXSchedulerTimelineMonthViewComponent extends NXComponent {
         this.dragStartDelay = input(0, ...(ngDevMode ? [{ debugName: "dragStartDelay" }] : []));
         this.calendar = input(...(ngDevMode ? [undefined, { debugName: "calendar" }] : []));
         this.date = input.required(...(ngDevMode ? [{ debugName: "date" }] : []));
+        this.resources = input([], ...(ngDevMode ? [{ debugName: "resources" }] : []));
+        this.showUnassignedAppointments = input(true, ...(ngDevMode ? [{ debugName: "showUnassignedAppointments" }] : []));
+        this.showResourceHeaders = input(true, ...(ngDevMode ? [{ debugName: "showResourceHeaders" }] : [])); // New input to control resource header visibility
         this.appointments = input([], ...(ngDevMode ? [{ debugName: "appointments" }] : []));
         this.tooltipTemplate = input(...(ngDevMode ? [undefined, { debugName: "tooltipTemplate" }] : []));
         this.dragStartSlotId = signal(null, ...(ngDevMode ? [{ debugName: "dragStartSlotId" }] : []));
+        this.dragStartSlotResourceId = signal(null, ...(ngDevMode ? [{ debugName: "dragStartSlotResourceId" }] : []));
         this.processedDayData = computed(() => {
             const allOriginalAppointments = this.appointments();
             const monthStartDate = this.date().startOf('month');
             const daysInMonth = monthStartDate.endOf('month').dayOfMonth;
+            const resources = this.resources();
+            const showUnassigned = this.showUnassignedAppointments();
             if (!allOriginalAppointments) {
                 return Array.from({ length: daysInMonth }, (_, i) => {
                     const dayDate = monthStartDate.add('day', i);
@@ -1527,6 +1777,7 @@ class AXSchedulerTimelineMonthViewComponent extends NXComponent {
                         visibleAppointments: [],
                         hiddenAppointments: [],
                         moreCount: 0,
+                        appointmentsByResource: resources.length > 0 ? new Map() : undefined,
                     };
                 });
             }
@@ -1552,12 +1803,35 @@ class AXSchedulerTimelineMonthViewComponent extends NXComponent {
                 ], ['asc', 'asc', 'desc', 'asc']);
                 const visibleAppointments = sortedSegments.slice(0, this.MAX_VISIBLE_APPOINTMENTS_PER_DAY);
                 const hiddenAppointments = sortedSegments.slice(this.MAX_VISIBLE_APPOINTMENTS_PER_DAY);
+                // Handle resource grouping if resources are provided
+                let appointmentsByResource;
+                if (resources.length > 0) {
+                    appointmentsByResource = new Map();
+                    const resourceIds = this.schedulerService.getAllResourceIds(resources, showUnassigned);
+                    for (const resourceId of resourceIds) {
+                        // Filter segments by resource ID
+                        const resourceSegments = sortedSegments.filter((segment) => {
+                            if (resourceId === 'unassigned') {
+                                return segment.resourceId === undefined || segment.resourceId === null;
+                            }
+                            return segment.resourceId?.toString() === resourceId;
+                        });
+                        const resourceVisible = resourceSegments.slice(0, this.MAX_VISIBLE_APPOINTMENTS_PER_DAY);
+                        const resourceHidden = resourceSegments.slice(this.MAX_VISIBLE_APPOINTMENTS_PER_DAY);
+                        appointmentsByResource.set(resourceId, {
+                            visible: resourceVisible,
+                            hidden: resourceHidden,
+                            moreCount: resourceHidden.length,
+                        });
+                    }
+                }
                 result.push({
                     date: currentDayDate,
                     visibleAppointments: visibleAppointments,
                     hiddenAppointments: hiddenAppointments,
                     moreCount: hiddenAppointments.length,
                     holiday: this.isHoliday(currentDayDate),
+                    appointmentsByResource,
                 });
             }
             return result;
@@ -1584,6 +1858,23 @@ class AXSchedulerTimelineMonthViewComponent extends NXComponent {
                 contextmenu: this.appointmentRightClickedInternal,
             },
         };
+        /**
+         * Gets appointments grouped by resources for timeline view.
+         */
+        this.appointmentsByResource = computed(() => {
+            const allAppointments = this.appointments();
+            const resources = this.resources();
+            const showUnassigned = this.showUnassignedAppointments();
+            return this.schedulerService.filterAppointmentsByResources(allAppointments, resources, showUnassigned);
+        }, ...(ngDevMode ? [{ debugName: "appointmentsByResource" }] : []));
+        /**
+         * Gets all resource IDs including unassigned if applicable.
+         */
+        this.resourceIds = computed(() => {
+            const resources = this.resources();
+            const showUnassigned = this.showUnassignedAppointments();
+            return this.schedulerService.getAllResourceIds(resources, showUnassigned);
+        }, ...(ngDevMode ? [{ debugName: "resourceIds" }] : []));
     }
     handleAppointmentEvent(mouseEvent, appointmentItem) {
         const originalAppointment = this.schedulerService.getOriginalAppointment(appointmentItem);
@@ -1600,7 +1891,7 @@ class AXSchedulerTimelineMonthViewComponent extends NXComponent {
         if (slotData)
             this.schedulerService.handleEvent({ nativeEvent: mouseEvent, slot: slotData, sender: this.scheduler }, this.eventOutputMap, 'slot');
     }
-    handleDrop(e, date) {
+    handleDrop(e, date, resourceId) {
         // date is the specific day
         const slotData = this.schedulerService.getSlotData(date.startOf('day'), 'timeline-month');
         const droppedItem = e.dropped.dragData();
@@ -1610,12 +1901,19 @@ class AXSchedulerTimelineMonthViewComponent extends NXComponent {
             endDate: originalAppointment.endDate,
             startDate: originalAppointment.startDate,
         };
+        // Convert 'unassigned' string to undefined for proper unassigned appointments
+        const actualResourceId = resourceId === 'unassigned' ? undefined : resourceId;
+        // Check if it's the same slot (same time AND same resource)
+        const dragStartSlotId = this.dragStartSlotId();
+        const dropSlotId = e.sender.element().dataset['slotId'];
+        const dragStartResourceId = this.dragStartSlotResourceId();
+        const isSameSlotDrop = dragStartSlotId === dropSlotId && dragStartResourceId === resourceId;
         this.onAppointmentDropInternal.emit({
             dropEvent: e,
-            slot: slotData,
+            slot: { ...slotData, resourceId: actualResourceId },
             sender: this.scheduler,
             appointment: appointmentRef,
-            isSameSlotDrop: this.dragStartSlotId() === e.sender.element().dataset['slotId'],
+            isSameSlotDrop,
         });
     }
     handleActionClick(event, appointmentItem) {
@@ -1648,32 +1946,106 @@ class AXSchedulerTimelineMonthViewComponent extends NXComponent {
         }
         return { state: 'none' };
     }
+    /**
+     * Gets appointments for a specific resource.
+     */
+    getAppointmentsForResource(resourceId) {
+        const appointmentsByResource = this.appointmentsByResource();
+        return appointmentsByResource.get(resourceId) || [];
+    }
+    /**
+     * Gets resource title by ID.
+     */
+    getResourceTitle(resourceId) {
+        if (resourceId === 'unassigned') {
+            return 'Unassigned';
+        }
+        const resources = this.resources();
+        const resource = resources.find((r) => r.id.toString() === resourceId);
+        return resource?.title || resourceId;
+    }
+    /**
+     * Gets appointments for a specific resource and day.
+     */
+    getAppointmentsForResourceAndDay(resourceId, dayData) {
+        if (!dayData.appointmentsByResource) {
+            return { visible: [], hidden: [], moreCount: 0 };
+        }
+        return dayData.appointmentsByResource.get(resourceId) || { visible: [], hidden: [], moreCount: 0 };
+    }
     getSlotId(e) {
         const dropListElement = this.document
             .elementsFromPoint(e.clientX, e.clientY)
             .find((el) => el instanceof HTMLElement && el.dataset['slotId'] !== undefined);
         this.dragStartSlotId.set(dropListElement ? dropListElement.dataset['slotId'] : null);
+        this.dragStartSlotResourceId.set(dropListElement ? dropListElement.dataset['resourceId'] : null);
+    }
+    /**
+     * Gets the height for a specific resource row based on appointments.
+     */
+    getResourceRowHeight(resourceId) {
+        const dayData = this.processedDayData();
+        let maxAppointments = 0;
+        let hasMoreLink = false;
+        // Find the maximum number of visible appointments for this resource across all days
+        // Only consider visible appointments, not hidden ones
+        for (const day of dayData) {
+            const resourceAppointments = this.getAppointmentsForResourceAndDay(resourceId, day);
+            maxAppointments = Math.max(maxAppointments, resourceAppointments.visible.length);
+            // Check if any day has hidden appointments (more link)
+            if (resourceAppointments.moreCount > 0) {
+                hasMoreLink = true;
+            }
+        }
+        if (maxAppointments === 0) {
+            // If no appointments, use minimum height (one appointment height)
+            return 'var(--ax-comp-scheduler-basic-view-blocks-height)';
+        }
+        // Use CSS calc with CSS variables for dynamic height calculation
+        // Formula: (appointments * appointment-height) + (gaps) + (more-link if present)
+        const appointmentHeight = 'var(--ax-comp-scheduler-timeline-month-appointment-height, 3rem)';
+        const gapHeight = 'var(--ax-comp-scheduler-timeline-month-gap-height, 0.125rem)';
+        const moreLinkHeight = 'var(--ax-comp-scheduler-timeline-month-more-link-height, 2.5rem)';
+        if (hasMoreLink) {
+            // If there are hidden appointments, add space for the more link
+            return `calc(${maxAppointments} * ${appointmentHeight} + ${maxAppointments - 1} * ${gapHeight} + ${moreLinkHeight})`;
+        }
+        else {
+            // No more link needed
+            return `calc(${maxAppointments} * ${appointmentHeight} + ${maxAppointments - 1} * ${gapHeight})`;
+        }
+    }
+    /**
+     * Calculates the maximum number of overlapping appointment rows needed.
+     * This is a simplified version for timeline month view.
+     */
+    calculateMaxOverlappingRows(appointments) {
+        if (appointments.length === 0)
+            return 1;
+        // For timeline month view, we'll use a simple approach
+        // Each appointment takes one row, so the max overlapping rows is just the count
+        return Math.max(1, appointments.length);
     }
     get isReadonly() {
         return this.readonly();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.4", ngImport: i0, type: AXSchedulerTimelineMonthViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.4", 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 }, 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 } }, outputs: { slotClickedInternal: "slotClickedInternal", slotDblClickedInternal: "slotDblClickedInternal", slotRightClickedInternal: "slotRightClickedInternal", appointmentClickedInternal: "appointmentClickedInternal", appointmentDblClickedInternal: "appointmentDblClickedInternal", appointmentRightClickedInternal: "appointmentRightClickedInternal", onActionClickInternal: "onActionClickInternal", onAppointmentDropInternal: "onAppointmentDropInternal" }, host: { properties: { "class.ax-state-readonly": "this.isReadonly" } }, providers: [{ provide: AXComponent, useExisting: AXSchedulerTimelineMonthViewComponent }], usesInheritance: true, ngImport: i0, template: "<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        >\n          <span\n            class=\"ax-scheduler-month-header-date-day-char ax-scheduler-truncate\"\n            [axTooltip]=\"dayData.holiday.holiday?.title ?? ''\"\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 }} )\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      >\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.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-timeline-appointment\"\n              [class.all-day-segment]=\"segment.allDay\"\n              [ngClass]=\"segment.cssClass ?? `ax-scheduler-${segment.priority ?? 'primary'}-periority`\"\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              <!-- Display segment's start/end times if not allDay for this segment -->\n              @if (!segment.allDay) {\n                <ax-subtitle>\n                  {{ segment.originalStartDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }} -\n                  {{ segment.originalEndDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}\n                </ax-subtitle>\n              }\n            </div>\n          }\n          @if (dayData.moreCount > 0) {\n            <div #moreAppointments class=\"ax-scheduler-month-overflow-badge\" (click)=\"$event.stopPropagation()\">\n              +{{ '@acorex:common.general.more-items' | translate: { params: { number: dayData.moreCount } } | async }}\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-overlay-pane ax-scheduler-popover ax-scheduler-month-popover-appointment\"\n              >\n                @for (segment of dayData.hiddenAppointments; 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                    (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                    [class.all-day-segment]=\"segment.allDay\"\n                    [ngClass]=\"segment.cssClass ?? `ax-scheduler-${segment.priority ?? 'primary'}-periority`\"\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                      <ax-subtitle>\n                        {{\n                          segment.originalStartDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async\n                        }}\n                        -\n                        {{\n                          segment.originalEndDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async\n                        }}\n                      </ax-subtitle>\n                    }\n                  </div>\n                }\n              </div>\n            </ax-popover>\n          }\n        </div>\n      </div>\n    </div>\n  }\n</div>\n", styles: ["ax-scheduler-timeline-month-view{height:100%;position:relative;display:inline-flex;flex-direction:column;background-color:inherit}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container{height:100%;display:flex}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-header{width:100%;display:flex;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{gap:.25rem;height:4rem;display:flex;position:relative;align-items:start;padding-inline:1rem;flex-direction:column;padding-block:.25rem;justify-content:center;width:var(--ax-comp-scheduler-timeline-month-view-blocks-width, calc(var(--ax-comp-scheduler-timeline-view-blocks-width) / 2));border-block-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface));border-inline-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-header .ax-scheduler-month-header-date-day.ax-state-today{color:rgba(var(--ax-sys-color-primary-surface));background-color:rgba(var(--ax-sys-color-primary-surface),.05)}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{font-weight: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{font-weight: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: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{max-width:100%;position:sticky;font-weight:300;inset-inline-start:1rem}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;font-weight:500;font-size:1.25rem;inset-inline-start:1rem}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-content{padding:.125rem .25rem;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:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container{gap:1px;display:flex;flex-direction:column}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container .ax-scheduler-timeline-appointment{width:100%;display:flex;overflow:hidden;flex-direction:column;padding-block:.25rem;padding-inline:.5rem;border-radius:calc(var(--ax-sys-border-radius) / 2)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container .ax-scheduler-month-overflow-badge{cursor:pointer;text-align:left;font-size:.75rem;padding:.125rem 0;margin-top:.125rem}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: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-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}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: "component", type: AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "directive", type: AXDragDirective, selector: "[axDrag]", inputs: ["dragData", "dragDisabled", "dragTransition", "dragElementClone", "dropZoneGroup", "dragStartDelay", "dragResetOnDblClick", "dragLockAxis", "dragClonedTemplate", "dragCursor", "dragBoundary", "dragTransitionDuration"], outputs: ["dragPositionChanged"] }, { kind: "directive", type: AXDropZoneDirective, selector: "[axDropZone]", inputs: ["dropZoneGroup"], outputs: ["onElementDrop", "onElementHover"], exportAs: ["axDropZone"] }, { 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: "pipe", type: AXFormatPipe, name: "format" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.4", 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 }, date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: true, transformFunction: null }, resources: { classPropertyName: "resources", publicName: "resources", isSignal: true, isRequired: false, transformFunction: null }, showUnassignedAppointments: { classPropertyName: "showUnassignedAppointments", publicName: "showUnassignedAppointments", isSignal: true, isRequired: false, transformFunction: null }, showResourceHeaders: { classPropertyName: "showResourceHeaders", publicName: "showResourceHeaders", 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": "this.isReadonly" } }, providers: [{ provide: AXComponent, useExisting: AXSchedulerTimelineMonthViewComponent }], usesInheritance: true, ngImport: i0, template: "@if (resources().length === 0 || !showResourceHeaders()) {\n  <!-- Original layout when no resources -->\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          >\n            <span\n              class=\"ax-scheduler-month-header-date-day-char ax-scheduler-truncate\"\n              [axTooltip]=\"dayData.holiday.holiday?.title ?? ''\"\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 }} )\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        >\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.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-timeline-appointment\"\n                [class.all-day-segment]=\"segment.allDay\"\n                [ngClass]=\"segment.cssClass ?? `ax-scheduler-${segment.priority ?? 'primary'}-periority`\"\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                <!-- Display segment's start/end times if not allDay for this segment -->\n                @if (!segment.allDay) {\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                }\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-overlay-pane ax-scheduler-popover ax-scheduler-month-popover-appointment\"\n                >\n                  @for (segment of dayData.hiddenAppointments; 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                      (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                      [class.all-day-segment]=\"segment.allDay\"\n                      [ngClass]=\"segment.cssClass ?? `ax-scheduler-${segment.priority ?? 'primary'}-periority`\"\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                        <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                      }\n                    </div>\n                  }\n                </div>\n              </ax-popover>\n            }\n          </div>\n        </div>\n      </div>\n    }\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            >\n              <span\n                class=\"ax-scheduler-month-header-date-day-char ax-scheduler-truncate\"\n                [axTooltip]=\"dayData.holiday?.holiday?.title ?? ''\"\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 }} )\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      @for (resourceId of resourceIds(); track resourceId) {\n        <div class=\"ax-scheduler-timeline-month-resource-row\" [style.height]=\"getResourceRowHeight(resourceId)\">\n          @if (showResourceHeaders()) {\n            <!-- Sticky Resource Header -->\n            <div class=\"ax-scheduler-timeline-month-resource-header ax-scheduler-timeline-month-resource-header-sticky\">\n              <span class=\"ax-scheduler-timeline-month-resource-title\">{{ getResourceTitle(resourceId) }}</span>\n            </div>\n          }\n\n          <!-- Resource Content -->\n          <div class=\"ax-scheduler-timeline-month-resource-content\">\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              >\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                            : 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                      [class.all-day-segment]=\"segment.allDay\"\n                      [ngClass]=\"segment.cssClass ?? `ax-scheduler-${segment.priority ?? 'primary'}-periority`\"\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                        <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                      }\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-overlay-pane 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                                  : 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                            [class.all-day-segment]=\"segment.allDay\"\n                            [ngClass]=\"segment.cssClass ?? `ax-scheduler-${segment.priority ?? 'primary'}-periority`\"\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                              <ax-subtitle>\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                              </ax-subtitle>\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: ["ax-scheduler-timeline-month-view{height:100%;position:relative;display:inline-flex;flex-direction:column;background-color:inherit}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container{height:100%;display:flex}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-header{width:100%;display:flex;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{gap:.25rem;height:4rem;display:flex;position:relative;align-items:start;padding-inline:1rem;flex-direction:column;padding-block:.25rem;justify-content:center;width:var(--ax-comp-scheduler-timeline-month-view-blocks-width, calc(var(--ax-comp-scheduler-timeline-view-blocks-width) / 2));border-block-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface));border-inline-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-header .ax-scheduler-month-header-date-day.ax-state-today{color:rgba(var(--ax-sys-color-primary-surface));background-color:rgba(var(--ax-sys-color-primary-surface),.05)}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{font-weight: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{font-weight: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: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{max-width:100%;position:sticky;font-weight:300;line-height:1rem;inset-inline-start:1rem}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;font-weight:500;font-size:1.25rem;inset-inline-start:1rem}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-content{padding:.125rem .25rem;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:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container{gap:1px;display:flex;flex-direction:column}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container .ax-scheduler-timeline-appointment{width:100%;display:flex;overflow:hidden;flex-direction:column;padding-block:.25rem;padding-inline:.5rem;border-radius:calc(var(--ax-sys-border-radius) / 2)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container .ax-scheduler-month-overflow-badge{cursor:pointer;text-align:left;font-size:.75rem;padding:.125rem 0;margin-top:.125rem}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:underline}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container{height:100%;display:flex;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:0;z-index:10;display:flex;background-color:inherit;border-bottom:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-header-sticky .ax-scheduler-timeline-month-resource-header-placeholder{left:0;z-index:15;display:flex;position:sticky;align-items:center;justify-content:center;background-color:inherit;width:var(--ax-comp-scheduler-resource-header-width, 8rem);min-width:var(--ax-comp-scheduler-resource-header-width, 8rem);border-right:1px solid rgba(var(--ax-sys-color-border-lightest-surface));padding:.5rem;font-weight:500;font-size:.875rem}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-header-sticky .ax-scheduler-timeline-month-day-header{flex:1;display:flex;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{gap:.25rem;height:4rem;display:flex;position:relative;align-items:start;padding-inline:1rem;flex-direction:column;padding-block:.25rem;justify-content:center;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));border-inline-end:1px solid rgba(var(--ax-sys-color-border-lightest-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-today{color:rgba(var(--ax-sys-color-primary-surface));background-color:rgba(var(--ax-sys-color-primary-surface),.05)}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{font-weight: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{font-weight: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: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{max-width:100%;position:sticky;font-weight:300;line-height:1rem;inset-inline-start:1rem}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;font-weight:500;font-size:1.25rem;inset-inline-start:1rem}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows{flex:1;overflow:visible;position:relative;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{min-height:0;border-bottom:1px solid rgba(var(--ax-sys-color-border-lightest-surface));width:max-content;background-color:inherit;min-height:3.313rem;display:flex}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;padding:.5rem;align-items:center;justify-content:center;background-color:inherit;width:var(--ax-comp-scheduler-resource-header-width, 8rem);min-width:var(--ax-comp-scheduler-resource-header-width, 8rem);border-right:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}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;left:0;z-index:15;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{font-weight:500;font-size:.875rem;text-align:center;word-break: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{flex:1;display:flex;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-content{flex:1;display:flex;position:relative;background-color:inherit;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));border-inline-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}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{gap:var(--ax-comp-scheduler-timeline-month-gap-height, .125rem);display:flex;flex-direction:column;height:100%;overflow:hidden;width:100%;padding-inline:.25rem;padding-block:.125rem}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{width:100%;height:var(--ax-comp-scheduler-timeline-month-appointment-height, 3rem);display:flex;overflow:hidden;flex-direction:column;padding-block:.25rem;padding-inline:.5rem;border-radius:calc(var(--ax-sys-border-radius) / 2);flex-shrink: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 .ax-scheduler-timeline-appointment-container .ax-scheduler-month-overflow-badge{cursor:pointer;text-align:left;font-size:.75rem;padding:.125rem 0;margin-top:.125rem;flex-shrink:0;height:var(--ax-comp-scheduler-timeline-month-more-link-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-content .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container .ax-scheduler-month-overflow-badge:hover{text-decoration: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-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}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: AXDragDirective, selector: "[axDrag]", inputs: ["dragData", "dragDisabled", "dragTransition", "dragElementClone", "dropZoneGroup", "dragStartDelay", "dragResetOnDblClick", "dragLockAxis", "dragClonedTemplate", "dragCursor", "dragBoundary", "dragTransitionDuration"], outputs: ["dragPositionChanged"] }, { kind: "component", type: AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "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 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.4", ngImport: i0, type: AXSchedulerTimelineMonthViewComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ax-scheduler-timeline-month-view', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [
                         NgClass,
-                        AXDecoratorGenericComponent,
-                        AXFormatPipe,
                         AsyncPipe,
+                        AXFormatPipe,
+                        AXDragDirective,
                         AXTranslatorPipe,
                         AXPopoverComponent,
-                        AXDragDirective,
-                        AXDropZoneDirective,
                         AXTooltipDirective,
+                        AXDropZoneDirective,
                         AXDecoratorIconComponent,
-                    ], providers: [{ provide: AXComponent, useExisting: AXSchedulerTimelineMonthViewComponent }], template: "<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        >\n          <span\n            class=\"ax-scheduler-month-header-date-day-char ax-scheduler-truncate\"\n            [axTooltip]=\"dayData.holiday.holiday?.title ?? ''\"\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 }} )\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      >\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.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-timeline-appointment\"\n              [class.all-day-segment]=\"segment.allDay\"\n              [ngClass]=\"segment.cssClass ?? `ax-scheduler-${segment.priority ?? 'primary'}-periority`\"\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              <!-- Display segment's start/end times if not allDay for this segment -->\n              @if (!segment.allDay) {\n                <ax-subtitle>\n                  {{ segment.originalStartDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }} -\n                  {{ segment.originalEndDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}\n                </ax-subtitle>\n              }\n            </div>\n          }\n          @if (dayData.moreCount > 0) {\n            <div #moreAppointments class=\"ax-scheduler-month-overflow-badge\" (click)=\"$event.stopPropagation()\">\n              +{{ '@acorex:common.general.more-items' | translate: { params: { number: dayData.moreCount } } | async }}\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-overlay-pane ax-scheduler-popover ax-scheduler-month-popover-appointment\"\n              >\n                @for (segment of dayData.hiddenAppointments; 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                    (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                    [class.all-day-segment]=\"segment.allDay\"\n                    [ngClass]=\"segment.cssClass ?? `ax-scheduler-${segment.priority ?? 'primary'}-periority`\"\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                      <ax-subtitle>\n                        {{\n                          segment.originalStartDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async\n                        }}\n                        -\n                        {{\n                          segment.originalEndDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async\n                        }}\n                      </ax-subtitle>\n                    }\n                  </div>\n                }\n              </div>\n            </ax-popover>\n          }\n        </div>\n      </div>\n    </div>\n  }\n</div>\n", styles: ["ax-scheduler-timeline-month-view{height:100%;position:relative;display:inline-flex;flex-direction:column;background-color:inherit}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container{height:100%;display:flex}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-header{width:100%;display:flex;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{gap:.25rem;height:4rem;display:flex;position:relative;align-items:start;padding-inline:1rem;flex-direction:column;padding-block:.25rem;justify-content:center;width:var(--ax-comp-scheduler-timeline-month-view-blocks-width, calc(var(--ax-comp-scheduler-timeline-view-blocks-width) / 2));border-block-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface));border-inline-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-header .ax-scheduler-month-header-date-day.ax-state-today{color:rgba(var(--ax-sys-color-primary-surface));background-color:rgba(var(--ax-sys-color-primary-surface),.05)}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{font-weight: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{font-weight: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: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{max-width:100%;position:sticky;font-weight:300;inset-inline-start:1rem}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;font-weight:500;font-size:1.25rem;inset-inline-start:1rem}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-content{padding:.125rem .25rem;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:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container{gap:1px;display:flex;flex-direction:column}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container .ax-scheduler-timeline-appointment{width:100%;display:flex;overflow:hidden;flex-direction:column;padding-block:.25rem;padding-inline:.5rem;border-radius:calc(var(--ax-sys-border-radius) / 2)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container .ax-scheduler-month-overflow-badge{cursor:pointer;text-align:left;font-size:.75rem;padding:.125rem 0;margin-top:.125rem}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: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-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}\n"] }]
+                        AXDecoratorGenericComponent,
+                    ], providers: [{ provide: AXComponent, useExisting: AXSchedulerTimelineMonthViewComponent }], template: "@if (resources().length === 0 || !showResourceHeaders()) {\n  <!-- Original layout when no resources -->\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          >\n            <span\n              class=\"ax-scheduler-month-header-date-day-char ax-scheduler-truncate\"\n              [axTooltip]=\"dayData.holiday.holiday?.title ?? ''\"\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 }} )\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        >\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.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-timeline-appointment\"\n                [class.all-day-segment]=\"segment.allDay\"\n                [ngClass]=\"segment.cssClass ?? `ax-scheduler-${segment.priority ?? 'primary'}-periority`\"\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                <!-- Display segment's start/end times if not allDay for this segment -->\n                @if (!segment.allDay) {\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                }\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-overlay-pane ax-scheduler-popover ax-scheduler-month-popover-appointment\"\n                >\n                  @for (segment of dayData.hiddenAppointments; 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                      (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                      [class.all-day-segment]=\"segment.allDay\"\n                      [ngClass]=\"segment.cssClass ?? `ax-scheduler-${segment.priority ?? 'primary'}-periority`\"\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                        <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                      }\n                    </div>\n                  }\n                </div>\n              </ax-popover>\n            }\n          </div>\n        </div>\n      </div>\n    }\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            >\n              <span\n                class=\"ax-scheduler-month-header-date-day-char ax-scheduler-truncate\"\n                [axTooltip]=\"dayData.holiday?.holiday?.title ?? ''\"\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 }} )\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      @for (resourceId of resourceIds(); track resourceId) {\n        <div class=\"ax-scheduler-timeline-month-resource-row\" [style.height]=\"getResourceRowHeight(resourceId)\">\n          @if (showResourceHeaders()) {\n            <!-- Sticky Resource Header -->\n            <div class=\"ax-scheduler-timeline-month-resource-header ax-scheduler-timeline-month-resource-header-sticky\">\n              <span class=\"ax-scheduler-timeline-month-resource-title\">{{ getResourceTitle(resourceId) }}</span>\n            </div>\n          }\n\n          <!-- Resource Content -->\n          <div class=\"ax-scheduler-timeline-month-resource-content\">\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              >\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                            : 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                      [class.all-day-segment]=\"segment.allDay\"\n                      [ngClass]=\"segment.cssClass ?? `ax-scheduler-${segment.priority ?? 'primary'}-periority`\"\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                        <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                      }\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-overlay-pane 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                                  : 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                            [class.all-day-segment]=\"segment.allDay\"\n                            [ngClass]=\"segment.cssClass ?? `ax-scheduler-${segment.priority ?? 'primary'}-periority`\"\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                              <ax-subtitle>\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                              </ax-subtitle>\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: ["ax-scheduler-timeline-month-view{height:100%;position:relative;display:inline-flex;flex-direction:column;background-color:inherit}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container{height:100%;display:flex}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-header{width:100%;display:flex;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{gap:.25rem;height:4rem;display:flex;position:relative;align-items:start;padding-inline:1rem;flex-direction:column;padding-block:.25rem;justify-content:center;width:var(--ax-comp-scheduler-timeline-month-view-blocks-width, calc(var(--ax-comp-scheduler-timeline-view-blocks-width) / 2));border-block-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface));border-inline-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-header .ax-scheduler-month-header-date-day.ax-state-today{color:rgba(var(--ax-sys-color-primary-surface));background-color:rgba(var(--ax-sys-color-primary-surface),.05)}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{font-weight: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{font-weight: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: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{max-width:100%;position:sticky;font-weight:300;line-height:1rem;inset-inline-start:1rem}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;font-weight:500;font-size:1.25rem;inset-inline-start:1rem}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-content{padding:.125rem .25rem;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:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container{gap:1px;display:flex;flex-direction:column}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container .ax-scheduler-timeline-appointment{width:100%;display:flex;overflow:hidden;flex-direction:column;padding-block:.25rem;padding-inline:.5rem;border-radius:calc(var(--ax-sys-border-radius) / 2)}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-container .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container .ax-scheduler-month-overflow-badge{cursor:pointer;text-align:left;font-size:.75rem;padding:.125rem 0;margin-top:.125rem}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:underline}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container{height:100%;display:flex;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:0;z-index:10;display:flex;background-color:inherit;border-bottom:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-header-sticky .ax-scheduler-timeline-month-resource-header-placeholder{left:0;z-index:15;display:flex;position:sticky;align-items:center;justify-content:center;background-color:inherit;width:var(--ax-comp-scheduler-resource-header-width, 8rem);min-width:var(--ax-comp-scheduler-resource-header-width, 8rem);border-right:1px solid rgba(var(--ax-sys-color-border-lightest-surface));padding:.5rem;font-weight:500;font-size:.875rem}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-header-sticky .ax-scheduler-timeline-month-day-header{flex:1;display:flex;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{gap:.25rem;height:4rem;display:flex;position:relative;align-items:start;padding-inline:1rem;flex-direction:column;padding-block:.25rem;justify-content:center;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));border-inline-end:1px solid rgba(var(--ax-sys-color-border-lightest-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-today{color:rgba(var(--ax-sys-color-primary-surface));background-color:rgba(var(--ax-sys-color-primary-surface),.05)}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{font-weight: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{font-weight: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: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{max-width:100%;position:sticky;font-weight:300;line-height:1rem;inset-inline-start:1rem}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;font-weight:500;font-size:1.25rem;inset-inline-start:1rem}ax-scheduler-timeline-month-view .ax-scheduler-timeline-month-resource-container .ax-scheduler-timeline-month-resource-rows{flex:1;overflow:visible;position:relative;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{min-height:0;border-bottom:1px solid rgba(var(--ax-sys-color-border-lightest-surface));width:max-content;background-color:inherit;min-height:3.313rem;display:flex}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;padding:.5rem;align-items:center;justify-content:center;background-color:inherit;width:var(--ax-comp-scheduler-resource-header-width, 8rem);min-width:var(--ax-comp-scheduler-resource-header-width, 8rem);border-right:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}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;left:0;z-index:15;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{font-weight:500;font-size:.875rem;text-align:center;word-break: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{flex:1;display:flex;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-content{flex:1;display:flex;position:relative;background-color:inherit;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));border-inline-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}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{gap:var(--ax-comp-scheduler-timeline-month-gap-height, .125rem);display:flex;flex-direction:column;height:100%;overflow:hidden;width:100%;padding-inline:.25rem;padding-block:.125rem}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{width:100%;height:var(--ax-comp-scheduler-timeline-month-appointment-height, 3rem);display:flex;overflow:hidden;flex-direction:column;padding-block:.25rem;padding-inline:.5rem;border-radius:calc(var(--ax-sys-border-radius) / 2);flex-shrink: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 .ax-scheduler-timeline-appointment-container .ax-scheduler-month-overflow-badge{cursor:pointer;text-align:left;font-size:.75rem;padding:.125rem 0;margin-top:.125rem;flex-shrink:0;height:var(--ax-comp-scheduler-timeline-month-more-link-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-content .ax-scheduler-timeline-content .ax-scheduler-timeline-appointment-container .ax-scheduler-month-overflow-badge:hover{text-decoration: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-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}\n"] }]
         }], propDecorators: { isReadonly: [{
                 type: HostBinding,
                 args: ['class.ax-state-readonly']
@@ -1693,6 +2065,8 @@ class AXSchedulerTimelineMultiDayViewComponent extends NXComponent {
         this.date = input.required(...(ngDevMode ? [{ debugName: "date" }] : []));
         this.endDayHour = input.required(...(ngDevMode ? [{ debugName: "endDayHour" }] : []));
         this.startDayHour = input.required(...(ngDevMode ? [{ debugName: "startDayHour" }] : []));
+        this.resources = input([], ...(ngDevMode ? [{ debugName: "resources" }] : []));
+        this.showUnassignedAppointments = input(true, ...(ngDevMode ? [{ debugName: "showUnassignedAppointments" }] : []));
         this.appointments = input([], ...(ngDevMode ? [{ debugName: "appointments" }] : []));
         this.tooltipTemplate = input(...(ngDevMode ? [undefined, { debugName: "tooltipTemplate" }] : []));
         this.daysDataForTimelineViews = computed(() => {
@@ -1706,19 +2080,18 @@ class AXSchedulerTimelineMultiDayViewComponent extends NXComponent {
             for (let i = 0; i < numberOfDays; i++) {
                 const currentDayDate = multiViewStartDate.add('day', i);
                 const currentDayStart = currentDayDate.startOf('day');
-                const currentDayEnd = currentDayDate.endOf('day'); // Use full day for overlap check
-                const appointmentsOverlappingThisDay = allOriginalAppointments.filter((appt) => {
-                    if (appt.allDay) {
-                        return false;
-                    }
+                const currentDayEnd = currentDayDate.endOf('day');
+                // Filter appointments that overlap with this day, preserving original times
+                const appointmentsForThisDay = allOriginalAppointments.filter((appt) => {
                     const apptStart = this.calendarService.create(appt.startDate, this.calendar());
                     const apptEnd = this.calendarService.create(appt.endDate, this.calendar());
+                    // Check if appointment overlaps with this day
                     return apptStart.compare(currentDayEnd, 'second') <= 0 && apptEnd.compare(currentDayStart, 'second') >= 0;
                 });
                 result.push({
                     date: currentDayDate,
                     holiday: this.isHoliday(currentDayDate),
-                    originalAppointmentsForThisDay: appointmentsOverlappingThisDay,
+                    originalAppointmentsForThisDay: appointmentsForThisDay,
                 });
             }
             return result;
@@ -1731,11 +2104,187 @@ class AXSchedulerTimelineMultiDayViewComponent extends NXComponent {
         this.appointmentRightClickedInternal = output();
         this.onActionClickInternal = output();
         this.onAppointmentDropInternal = output();
+        /**
+         * Gets appointments grouped by resources for timeline view.
+         */
+        this.appointmentsByResource = computed(() => {
+            const allAppointments = this.appointments();
+            const resources = this.resources();
+            const showUnassigned = this.showUnassignedAppointments();
+            return this.schedulerService.filterAppointmentsByResources(allAppointments, resources, showUnassigned);
+        }, ...(ngDevMode ? [{ debugName: "appointmentsByResource" }] : []));
+        /**
+         * Gets all resource IDs including unassigned if applicable.
+         */
+        this.resourceIds = computed(() => {
+            const resources = this.resources();
+            const showUnassigned = this.showUnassignedAppointments();
+            return this.schedulerService.getAllResourceIds(resources, showUnassigned);
+        }, ...(ngDevMode ? [{ debugName: "resourceIds" }] : []));
+    }
+    handleDrop(event, resourceId) {
+        // Convert 'unassigned' string to undefined for proper unassigned appointments
+        const actualResourceId = resourceId === 'unassigned' ? undefined : resourceId;
+        // Use the isSameSlotDrop value from the child timeline-day-view component
+        // The child component has the proper context for its own day
+        const isSameSlotDrop = event.isSameSlotDrop;
+        // Update the slot with the correct resource ID
+        const updatedEvent = {
+            ...event,
+            slot: {
+                ...event.slot,
+                resourceId: actualResourceId,
+            },
+            isSameSlotDrop,
+        };
+        this.onAppointmentDropInternal.emit(updatedEvent);
     }
     isToday(date) {
         const today = this.calendarService.create(new Date());
         return date.equal(today, 'day');
     }
+    /**
+     * Gets appointments for a specific resource.
+     */
+    getAppointmentsForResource(resourceId) {
+        const appointmentsByResource = this.appointmentsByResource();
+        return appointmentsByResource.get(resourceId) || [];
+    }
+    /**
+     * Gets resource title by ID.
+     */
+    getResourceTitle(resourceId) {
+        if (resourceId === 'unassigned') {
+            return 'Unassigned';
+        }
+        const resources = this.resources();
+        const resource = resources.find((r) => r.id.toString() === resourceId);
+        return resource?.title || resourceId;
+    }
+    /**
+     * Gets appointments for a specific resource and day.
+     */
+    getAppointmentsForResourceAndDay(resourceId, dayAppointments) {
+        if (resourceId === 'unassigned') {
+            return dayAppointments.filter((appointment) => appointment.resourceId === undefined || appointment.resourceId === null);
+        }
+        return dayAppointments.filter((appointment) => appointment.resourceId?.toString() === resourceId);
+    }
+    /**
+     * Gets the height for a specific resource across all days.
+     */
+    getResourceRowHeight(resourceId) {
+        // Calculate the maximum height needed for this specific resource across all days
+        const daysData = this.daysDataForTimelineViews();
+        let maxHeight = 1; // Minimum height
+        for (const daySlot of daysData) {
+            const appointments = this.getAppointmentsForResourceAndDay(resourceId, daySlot.originalAppointmentsForThisDay);
+            if (appointments.length > 0) {
+                // Calculate overlapping rows for this resource on this day
+                const overlappingRows = this.calculateMaxOverlappingRowsForAppointments(appointments, daySlot.date);
+                maxHeight = Math.max(maxHeight, overlappingRows);
+            }
+        }
+        // Use CSS calc to return the height
+        const GAP_PX = 4; // Same as in timeline-day component
+        return `calc(var(--ax-comp-scheduler-basic-view-blocks-height) * ${maxHeight} + ${GAP_PX}px * ${Math.max(0, maxHeight - 1)})`;
+    }
+    /**
+     * Calculates the maximum number of overlapping rows for a set of appointments.
+     * Uses the actual segmented times that will be displayed in the timeline view.
+     */
+    calculateMaxOverlappingRowsForAppointments(appointments, dayDate) {
+        if (appointments.length === 0)
+            return 1;
+        if (appointments.length === 1)
+            return 1;
+        // Get the actual segments that will be displayed in the timeline view
+        const segments = [];
+        const viewConfigStartHour = this.startDayHour();
+        const viewConfigEndHour = this.endDayHour();
+        for (const appointment of appointments) {
+            if (appointment.allDay) {
+                // For all-day appointments, create a segment that spans the full day
+                const dayStart = this.calendarService.create(appointment.startDate, this.calendar()).startOf('day');
+                const dayEnd = this.calendarService.create(appointment.endDate, this.calendar()).startOf('day');
+                // Check if the all-day appointment overlaps with the current day
+                const currentDayStart = dayDate.startOf('day');
+                const currentDayEnd = dayDate.endOf('day');
+                if (dayStart.compare(currentDayEnd, 'day') <= 0 && dayEnd.compare(currentDayStart, 'day') >= 0) {
+                    segments.push({
+                        startDate: currentDayStart.date,
+                        endDate: currentDayEnd.date,
+                        allDay: true,
+                    });
+                }
+            }
+            else {
+                // For regular appointments, get the proper segment
+                const segment = this.schedulerService.getClonedAppointmentSegmentOnDay(appointment, dayDate, viewConfigStartHour, viewConfigEndHour, false);
+                if (segment) {
+                    segments.push(segment);
+                }
+            }
+        }
+        if (segments.length === 0)
+            return 1;
+        if (segments.length === 1)
+            return 1;
+        // Sort segments by start time, then by end time (descending)
+        const sortedSegments = [...segments].sort((a, b) => {
+            const startDiff = a.startDate.getTime() - b.startDate.getTime();
+            if (startDiff !== 0)
+                return startDiff;
+            return b.endDate.getTime() - a.endDate.getTime();
+        });
+        const rowEndTimes = [];
+        let maxRows = 0;
+        for (const segment of sortedSegments) {
+            let assignedRowIndex = -1;
+            // Find the first row where this segment can fit
+            for (let i = 0; i < rowEndTimes.length; i++) {
+                if (segment.startDate >= rowEndTimes[i]) {
+                    assignedRowIndex = i;
+                    break;
+                }
+            }
+            // If no row is available, create a new one
+            if (assignedRowIndex === -1) {
+                assignedRowIndex = rowEndTimes.length;
+                rowEndTimes.push(segment.endDate);
+            }
+            else {
+                rowEndTimes[assignedRowIndex] = segment.endDate;
+            }
+            maxRows = Math.max(maxRows, rowEndTimes.length);
+        }
+        return Math.max(maxRows, 1);
+    }
+    /**
+     * Gets the hours array for time slots display.
+     */
+    getHoursArray() {
+        const startHour = this.startDayHour();
+        const endHour = this.endDayHour();
+        const hours = [];
+        // Use the first day's date as a base for creating time slots
+        const firstDay = this.daysDataForTimelineViews()[0];
+        if (!firstDay)
+            return [];
+        let time = firstDay.date.set('hour', startHour).startOf('hour');
+        hours.push(time);
+        while (time.hour < endHour - 1) {
+            time = time.add('hour', 1);
+            hours.push(time);
+        }
+        return hours;
+    }
+    /**
+     * Gets the number of hours for CSS calculations.
+     */
+    getHoursCount() {
+        return this.endDayHour() - this.startDayHour();
+    }
     isHoliday(date) {
         const isHoliday = this.schedulerService.isHoliday(date);
         if (isHoliday) {
@@ -1754,11 +2303,11 @@ class AXSchedulerTimelineMultiDayViewComponent extends NXComponent {
         return { state: 'none' };
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.4", ngImport: i0, type: AXSchedulerTimelineMultiDayViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.4", type: AXSchedulerTimelineMultiDayViewComponent, isStandalone: true, selector: "ax-scheduler-timeline-multi-day-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 }, endDayHour: { classPropertyName: "endDayHour", publicName: "endDayHour", isSignal: true, isRequired: true, transformFunction: null }, startDayHour: { classPropertyName: "startDayHour", publicName: "startDayHour", 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 } }, outputs: { slotClickedInternal: "slotClickedInternal", slotDblClickedInternal: "slotDblClickedInternal", slotRightClickedInternal: "slotRightClickedInternal", appointmentClickedInternal: "appointmentClickedInternal", appointmentDblClickedInternal: "appointmentDblClickedInternal", appointmentRightClickedInternal: "appointmentRightClickedInternal", onActionClickInternal: "onActionClickInternal", onAppointmentDropInternal: "onAppointmentDropInternal" }, providers: [{ provide: AXComponent, useExisting: AXSchedulerTimelineMultiDayViewComponent }], usesInheritance: true, ngImport: i0, template: "<div class=\"ax-scheduler-timeline-day-view-container\">\n  @for (daySlot of daysDataForTimelineViews(); track daySlot.date.date.getTime()) {\n    <div class=\"ax-scheduler-timeline-multi-day-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      >\n        <span\n          class=\"ax-scheduler-week-header-date-day-char ax-scheduler-truncate\"\n          [axTooltip]=\"daySlot.holiday.holiday?.title ?? ''\"\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 }} )\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        [endDayHour]=\"endDayHour()\"\n        [startDayHour]=\"startDayHour()\"\n        [hasActions]=\"hasActions()\"\n        [dragStartDelay]=\"dragStartDelay()\"\n        [tooltipTemplate]=\"tooltipTemplate()\"\n        [appointments]=\"daySlot.originalAppointmentsForThisDay\"\n        (onActionClickInternal)=\"onActionClickInternal.emit($event)\"\n        (slotClickedInternal)=\"slotClickedInternal.emit($event)\"\n        (slotDblClickedInternal)=\"slotDblClickedInternal.emit($event)\"\n        (slotRightClickedInternal)=\"slotRightClickedInternal.emit($event)\"\n        (onAppointmentDropInternal)=\"onAppointmentDropInternal.emit($event)\"\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", styles: ["ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-day-view-container{height:100%;display:flex;flex-direction:row}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day{gap:.25rem;height:4rem;display:flex;position:relative;align-items:start;padding-inline:1rem;flex-direction:column;padding-block:.25rem;justify-content:center;border-inline-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface));border-block-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day.ax-state-today{color:rgba(var(--ax-sys-color-primary-surface));background-color:rgba(var(--ax-sys-color-primary-surface),.05)}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day.ax-state-today .ax-scheduler-week-header-date-day-char{font-weight:500}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day.ax-state-today .ax-scheduler-week-header-date-day-num{font-weight:700}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day.ax-state-holiday{color:rgba(var(--ax-sys-color-danger-surface))}ax-scheduler-timeline-multi-day-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-multi-day-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day .ax-scheduler-week-header-date-day-char{max-width:100%;position:sticky;font-weight:300;inset-inline-start:1rem}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day .ax-scheduler-week-header-date-day-num{position:sticky;font-weight:500;font-size:1.25rem;inset-inline-start:1rem}ax-scheduler-timeline-multi-day-view ax-scheduler-timeline-day-view{height:calc(100% - 4rem)}\n"], dependencies: [{ kind: "component", type: AXSchedulerTimelineDayViewComponent, selector: "ax-scheduler-timeline-day-view", inputs: ["readonly", "draggable", "hasActions", "dragStartDelay", "calendar", "date", "endDayHour", "startDayHour", "appointments", "tooltipTemplate"], outputs: ["slotClickedInternal", "slotDblClickedInternal", "slotRightClickedInternal", "appointmentClickedInternal", "appointmentDblClickedInternal", "appointmentRightClickedInternal", "onActionClickInternal", "onAppointmentDropInternal"] }, { kind: "directive", type: AXTooltipDirective, selector: "[axTooltip]", inputs: ["axTooltipDisabled", "axTooltip", "axTooltipContext", "axTooltipPlacement", "axTooltipOffsetX", "axTooltipOffsetY", "axTooltipOpenAfter", "axTooltipCloseAfter"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXFormatPipe, name: "format" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.4", type: AXSchedulerTimelineMultiDayViewComponent, isStandalone: true, selector: "ax-scheduler-timeline-multi-day-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 }, endDayHour: { classPropertyName: "endDayHour", publicName: "endDayHour", isSignal: true, isRequired: true, transformFunction: null }, startDayHour: { classPropertyName: "startDayHour", publicName: "startDayHour", isSignal: true, isRequired: true, transformFunction: null }, resources: { classPropertyName: "resources", publicName: "resources", isSignal: true, isRequired: false, transformFunction: null }, showUnassignedAppointments: { classPropertyName: "showUnassignedAppointments", publicName: "showUnassignedAppointments", 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" }, providers: [{ provide: AXComponent, useExisting: AXSchedulerTimelineMultiDayViewComponent }], usesInheritance: true, ngImport: i0, template: "@if (resources().length === 0) {\n  <!-- Original layout when no resources -->\n  <div class=\"ax-scheduler-timeline-day-view-container\">\n    @for (daySlot of daysDataForTimelineViews(); track daySlot.date.date.getTime()) {\n      <div class=\"ax-scheduler-timeline-multi-day-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        >\n          <span\n            class=\"ax-scheduler-week-header-date-day-char ax-scheduler-truncate\"\n            [axTooltip]=\"daySlot.holiday.holiday?.title ?? ''\"\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 }} )\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          [showUnassignedAppointments]=\"showUnassignedAppointments()\"\n          [showResourceHeaders]=\"true\"\n          [endDayHour]=\"endDayHour()\"\n          [startDayHour]=\"startDayHour()\"\n          [hasActions]=\"hasActions()\"\n          [dragStartDelay]=\"dragStartDelay()\"\n          [tooltipTemplate]=\"tooltipTemplate()\"\n          [appointments]=\"daySlot.originalAppointmentsForThisDay\"\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 multi-day -->\n  <div\n    class=\"ax-scheduler-timeline-multi-day-resource-container\"\n    [style.--ax-comp-scheduler-hours-count]=\"getHoursCount()\"\n  >\n    <!-- Top header with day names -->\n    <div class=\"ax-scheduler-timeline-multi-day-top-header\">\n      <!-- Resource placeholder -->\n      <div class=\"ax-scheduler-timeline-multi-day-resource-header-placeholder\"></div>\n      <!-- Day headers -->\n      @for (daySlot of daysDataForTimelineViews(); track daySlot.date.date.getTime()) {\n        <div class=\"ax-scheduler-timeline-multi-day-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          >\n            <span\n              class=\"ax-scheduler-week-header-date-day-char ax-scheduler-truncate\"\n              [axTooltip]=\"daySlot.holiday.holiday?.title ?? ''\"\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 }} )\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-multi-day-time-header\">\n      <!-- Resource placeholder -->\n      <div class=\"ax-scheduler-timeline-multi-day-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-multi-day-day-time-slots\">\n          @for (hour of getHoursArray(); track hour.date.getTime()) {\n            <div class=\"ax-scheduler-timeline-multi-day-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-multi-day-content\">\n      <!-- Resource headers column -->\n      <div class=\"ax-scheduler-timeline-multi-day-resource-headers\">\n        <!-- Resource headers -->\n        @for (resourceId of resourceIds(); track resourceId) {\n          <div\n            class=\"ax-scheduler-timeline-multi-day-resource-header\"\n            [style.height]=\"getResourceRowHeight(resourceId)\"\n          >\n            <span class=\"ax-scheduler-timeline-resource-title\">{{ getResourceTitle(resourceId) }}</span>\n          </div>\n        }\n      </div>\n\n      <!-- Days columns -->\n      <div class=\"ax-scheduler-timeline-multi-day-days-container\">\n        @for (daySlot of daysDataForTimelineViews(); track daySlot.date.date.getTime()) {\n          <div class=\"ax-scheduler-timeline-multi-day-column\">\n            <!-- Resource rows for this day -->\n            <div class=\"ax-scheduler-timeline-multi-day-resource-rows\">\n              @for (resourceId of resourceIds(); track resourceId) {\n                <div\n                  class=\"ax-scheduler-timeline-multi-day-resource-row\"\n                  [style.height]=\"getResourceRowHeight(resourceId)\"\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                    [showUnassignedAppointments]=\"resourceId === 'unassigned'\"\n                    [showResourceHeaders]=\"false\"\n                    [endDayHour]=\"endDayHour()\"\n                    [startDayHour]=\"startDayHour()\"\n                    [hasActions]=\"hasActions()\"\n                    [dragStartDelay]=\"dragStartDelay()\"\n                    [tooltipTemplate]=\"tooltipTemplate()\"\n                    [appointments]=\"\n                      getAppointmentsForResourceAndDay(resourceId, daySlot.originalAppointmentsForThisDay)\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: ["ax-scheduler-timeline-multi-day-view{background-color:inherit}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-day-view-container{height:100%;display:flex;flex-direction:row;background-color:inherit}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day{gap:.25rem;height:4rem;display:flex;position:relative;align-items:start;padding-inline:1rem;flex-direction:column;padding-block:.25rem;justify-content:center;border-inline-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface));border-block-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day.ax-state-today{color:rgba(var(--ax-sys-color-primary-surface));background-color:rgba(var(--ax-sys-color-primary-surface),.05)}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day.ax-state-today .ax-scheduler-week-header-date-day-char{font-weight:500}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day.ax-state-today .ax-scheduler-week-header-date-day-num{font-weight:700}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day.ax-state-holiday{color:rgba(var(--ax-sys-color-danger-surface))}ax-scheduler-timeline-multi-day-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-multi-day-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day .ax-scheduler-week-header-date-day-char{max-width:100%;position:sticky;font-weight:300;inset-inline-start:1rem}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day .ax-scheduler-week-header-date-day-num{position:sticky;font-weight:500;font-size:1.25rem;inset-inline-start:1rem}ax-scheduler-timeline-multi-day-view ax-scheduler-timeline-day-view{height:calc(100% - 4rem)}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container{height:100%;display:flex;overflow:auto;flex-direction:column;background-color:inherit}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-top-header{position:sticky;top:0;z-index:20;display:flex;flex-direction:row;min-width:max-content;background-color:inherit;border-bottom:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-top-header .ax-scheduler-timeline-multi-day-resource-header-placeholder{width:var(--ax-comp-scheduler-resource-header-width, 8rem);min-width:var(--ax-comp-scheduler-resource-header-width, 8rem);height:4rem;display:flex;align-items:center;justify-content:center;background-color:inherit;border-right:1px solid rgba(var(--ax-sys-color-border-lightest-surface));position:sticky;left:0;z-index:17}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-top-header .ax-scheduler-timeline-multi-day-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));border-right:1px solid rgba(var(--ax-sys-color-border-lightest-surface));flex-shrink:0}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-top-header .ax-scheduler-timeline-multi-day-day-header .ax-scheduler-week-header-date-day{gap:.25rem;height:4rem;display:flex;position:relative;align-items:start;padding-inline:1rem;flex-direction:column;padding-block:.25rem;justify-content:center}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-top-header .ax-scheduler-timeline-multi-day-day-header .ax-scheduler-week-header-date-day.ax-state-today{color:rgba(var(--ax-sys-color-primary-surface));background-color:rgba(var(--ax-sys-color-primary-surface),.05)}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-top-header .ax-scheduler-timeline-multi-day-day-header .ax-scheduler-week-header-date-day.ax-state-today .ax-scheduler-week-header-date-day-char{font-weight:500}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-top-header .ax-scheduler-timeline-multi-day-day-header .ax-scheduler-week-header-date-day.ax-state-today .ax-scheduler-week-header-date-day-num{font-weight:700}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-top-header .ax-scheduler-timeline-multi-day-day-header .ax-scheduler-week-header-date-day.ax-state-holiday{color:rgba(var(--ax-sys-color-danger-surface))}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-top-header .ax-scheduler-timeline-multi-day-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-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-top-header .ax-scheduler-timeline-multi-day-day-header .ax-scheduler-week-header-date-day .ax-scheduler-week-header-date-day-char{max-width:100%;font-weight:300;position:sticky;font-size:.75rem;inset-inline-start:calc(var(--ax-comp-scheduler-resource-header-width, 8rem) + 1rem)}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-top-header .ax-scheduler-timeline-multi-day-day-header .ax-scheduler-week-header-date-day .ax-scheduler-week-header-date-day-num{font-weight:500;position:sticky;font-size:1.25rem;inset-inline-start:calc(var(--ax-comp-scheduler-resource-header-width, 8rem) + 1rem)}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-time-header{top:4rem;z-index:19;display:flex;position:sticky;flex-direction:row;min-width:max-content;background-color:inherit;border-bottom:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-time-header .ax-scheduler-timeline-multi-day-time-header-placeholder{z-index:17;height:2rem;display:flex;position:sticky;align-items:center;inset-inline-start:0;justify-content:center;background-color:inherit;width:var(--ax-comp-scheduler-resource-header-width, 8rem);min-width:var(--ax-comp-scheduler-resource-header-width, 8rem);border-right:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-time-header .ax-scheduler-timeline-multi-day-day-time-slots{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));height:2rem;display:flex;flex-direction:row;border-right:1px solid rgba(var(--ax-sys-color-border-lightest-surface));flex-shrink:0;background-color:inherit}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-time-header .ax-scheduler-timeline-multi-day-day-time-slots .ax-scheduler-timeline-multi-day-time-slot{display:flex;flex-shrink:0;position:relative;align-items:center;padding-inline:1rem;width:var(--ax-comp-scheduler-timeline-view-blocks-width);min-width:var(--ax-comp-scheduler-timeline-view-blocks-width);border-right:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-time-header .ax-scheduler-timeline-multi-day-day-time-slots .ax-scheduler-timeline-multi-day-time-slot span{z-index:1;font-weight:400;position:sticky;font-size:.75rem;inset-inline-start:calc(var(--ax-comp-scheduler-resource-header-width, 8rem) + 1rem)}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-content{flex:1;display:flex;min-height:0;width:fit-content;flex-direction:row;background-color:inherit}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-content .ax-scheduler-timeline-multi-day-resource-headers{z-index:18;display:flex;position:sticky;height:fit-content;inset-inline-start:0;flex-direction:column;background-color:inherit;width:var(--ax-comp-scheduler-resource-header-width, 8rem);min-width:var(--ax-comp-scheduler-resource-header-width, 8rem);border-right:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-content .ax-scheduler-timeline-multi-day-resource-headers .ax-scheduler-timeline-multi-day-resource-header{display:flex;align-items:center;justify-content:center;padding:.5rem;border-bottom:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-content .ax-scheduler-timeline-multi-day-resource-headers .ax-scheduler-timeline-multi-day-resource-header .ax-scheduler-timeline-resource-title{font-weight:500;font-size:.875rem;text-align:center;word-break:break-word}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-content .ax-scheduler-timeline-multi-day-days-container{flex:1;display:flex;flex-direction:row;min-width:max-content}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-content .ax-scheduler-timeline-multi-day-days-container .ax-scheduler-timeline-multi-day-column{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));display:flex;flex-direction:column;border-right:1px solid rgba(var(--ax-sys-color-border-lightest-surface));flex-shrink:0}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-content .ax-scheduler-timeline-multi-day-days-container .ax-scheduler-timeline-multi-day-column .ax-scheduler-timeline-multi-day-resource-rows{flex:1;display:flex;flex-direction:column}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-content .ax-scheduler-timeline-multi-day-days-container .ax-scheduler-timeline-multi-day-column .ax-scheduler-timeline-multi-day-resource-rows .ax-scheduler-timeline-multi-day-resource-row{border-bottom:1px solid rgba(var(--ax-sys-color-border-lightest-surface));min-height:var(--ax-comp-scheduler-basic-view-blocks-height)}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-content .ax-scheduler-timeline-multi-day-days-container .ax-scheduler-timeline-multi-day-column .ax-scheduler-timeline-multi-day-resource-rows .ax-scheduler-timeline-multi-day-resource-row ax-scheduler-timeline-day-view{height:100%;width:100%;display:block}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-content .ax-scheduler-timeline-multi-day-days-container .ax-scheduler-timeline-multi-day-column .ax-scheduler-timeline-multi-day-resource-rows .ax-scheduler-timeline-multi-day-resource-row ax-scheduler-timeline-day-view .ax-scheduler-timeline-header{display:none}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-content .ax-scheduler-timeline-multi-day-days-container .ax-scheduler-timeline-multi-day-column .ax-scheduler-timeline-multi-day-resource-rows .ax-scheduler-timeline-multi-day-resource-row ax-scheduler-timeline-day-view .ax-scheduler-timeline-content{height:100%;position:relative}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-content .ax-scheduler-timeline-multi-day-days-container .ax-scheduler-timeline-multi-day-column .ax-scheduler-timeline-multi-day-resource-rows .ax-scheduler-timeline-multi-day-resource-row ax-scheduler-timeline-day-view .ax-scheduler-timeline-appointment-container{top:0;width:100%;height:100%;position:absolute}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-content .ax-scheduler-timeline-multi-day-days-container .ax-scheduler-timeline-multi-day-column .ax-scheduler-timeline-multi-day-resource-rows .ax-scheduler-timeline-multi-day-resource-row ax-scheduler-timeline-day-view .ax-scheduler-timeline-appointment-container .ax-scheduler-timeline-appointment{width:100%;display:flex;overflow:hidden;position:absolute;inset-inline-start:0;flex-direction:column;padding-block:.25rem;padding-inline:.5rem;border-radius:calc(var(--ax-sys-border-radius) / 2)}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-content .ax-scheduler-timeline-multi-day-days-container .ax-scheduler-timeline-multi-day-column .ax-scheduler-timeline-multi-day-resource-rows .ax-scheduler-timeline-multi-day-resource-row ax-scheduler-timeline-day-view .ax-scheduler-timeline-slot-row{height:100%;display:flex;position:relative;width:max-content}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-content .ax-scheduler-timeline-multi-day-days-container .ax-scheduler-timeline-multi-day-column .ax-scheduler-timeline-multi-day-resource-rows .ax-scheduler-timeline-multi-day-resource-row ax-scheduler-timeline-day-view .ax-scheduler-timeline-slot-row .ax-scheduler-timeline-slot-cell{width:var(--ax-comp-scheduler-timeline-view-blocks-width);border-inline-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface));position:relative;flex-shrink:0}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-content .ax-scheduler-timeline-multi-day-days-container .ax-scheduler-timeline-multi-day-column .ax-scheduler-timeline-multi-day-resource-rows .ax-scheduler-timeline-multi-day-resource-row ax-scheduler-timeline-day-view .ax-scheduler-timeline-slot-row .ax-scheduler-timeline-slot-cell:after{content:\"\";position:absolute;top:0;right:0;width:1px;height:100%;background-color:rgba(var(--ax-sys-color-border-lightest-surface),.3)}\n"], dependencies: [{ kind: "directive", type: AXTooltipDirective, selector: "[axTooltip]", inputs: ["axTooltipDisabled", "axTooltip", "axTooltipContext", "axTooltipPlacement", "axTooltipOffsetX", "axTooltipOffsetY", "axTooltipOpenAfter", "axTooltipCloseAfter"] }, { kind: "component", type: AXSchedulerTimelineDayViewComponent, selector: "ax-scheduler-timeline-day-view", inputs: ["readonly", "draggable", "hasActions", "dragStartDelay", "calendar", "date", "endDayHour", "startDayHour", "resources", "showUnassignedAppointments", "showResourceHeaders", "appointments", "tooltipTemplate"], outputs: ["slotClickedInternal", "slotDblClickedInternal", "slotRightClickedInternal", "appointmentClickedInternal", "appointmentDblClickedInternal", "appointmentRightClickedInternal", "onActionClickInternal", "onAppointmentDropInternal"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXFormatPipe, name: "format" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.4", ngImport: i0, type: AXSchedulerTimelineMultiDayViewComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ax-scheduler-timeline-multi-day-view', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [AXSchedulerTimelineDayViewComponent, AsyncPipe, AXFormatPipe, AXTooltipDirective], providers: [{ provide: AXComponent, useExisting: AXSchedulerTimelineMultiDayViewComponent }], template: "<div class=\"ax-scheduler-timeline-day-view-container\">\n  @for (daySlot of daysDataForTimelineViews(); track daySlot.date.date.getTime()) {\n    <div class=\"ax-scheduler-timeline-multi-day-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      >\n        <span\n          class=\"ax-scheduler-week-header-date-day-char ax-scheduler-truncate\"\n          [axTooltip]=\"daySlot.holiday.holiday?.title ?? ''\"\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 }} )\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        [endDayHour]=\"endDayHour()\"\n        [startDayHour]=\"startDayHour()\"\n        [hasActions]=\"hasActions()\"\n        [dragStartDelay]=\"dragStartDelay()\"\n        [tooltipTemplate]=\"tooltipTemplate()\"\n        [appointments]=\"daySlot.originalAppointmentsForThisDay\"\n        (onActionClickInternal)=\"onActionClickInternal.emit($event)\"\n        (slotClickedInternal)=\"slotClickedInternal.emit($event)\"\n        (slotDblClickedInternal)=\"slotDblClickedInternal.emit($event)\"\n        (slotRightClickedInternal)=\"slotRightClickedInternal.emit($event)\"\n        (onAppointmentDropInternal)=\"onAppointmentDropInternal.emit($event)\"\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", styles: ["ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-day-view-container{height:100%;display:flex;flex-direction:row}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day{gap:.25rem;height:4rem;display:flex;position:relative;align-items:start;padding-inline:1rem;flex-direction:column;padding-block:.25rem;justify-content:center;border-inline-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface));border-block-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day.ax-state-today{color:rgba(var(--ax-sys-color-primary-surface));background-color:rgba(var(--ax-sys-color-primary-surface),.05)}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day.ax-state-today .ax-scheduler-week-header-date-day-char{font-weight:500}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day.ax-state-today .ax-scheduler-week-header-date-day-num{font-weight:700}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day.ax-state-holiday{color:rgba(var(--ax-sys-color-danger-surface))}ax-scheduler-timeline-multi-day-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-multi-day-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day .ax-scheduler-week-header-date-day-char{max-width:100%;position:sticky;font-weight:300;inset-inline-start:1rem}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day .ax-scheduler-week-header-date-day-num{position:sticky;font-weight:500;font-size:1.25rem;inset-inline-start:1rem}ax-scheduler-timeline-multi-day-view ax-scheduler-timeline-day-view{height:calc(100% - 4rem)}\n"] }]
+            args: [{ selector: 'ax-scheduler-timeline-multi-day-view', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [AsyncPipe, AXFormatPipe, AXTooltipDirective, AXSchedulerTimelineDayViewComponent], providers: [{ provide: AXComponent, useExisting: AXSchedulerTimelineMultiDayViewComponent }], template: "@if (resources().length === 0) {\n  <!-- Original layout when no resources -->\n  <div class=\"ax-scheduler-timeline-day-view-container\">\n    @for (daySlot of daysDataForTimelineViews(); track daySlot.date.date.getTime()) {\n      <div class=\"ax-scheduler-timeline-multi-day-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        >\n          <span\n            class=\"ax-scheduler-week-header-date-day-char ax-scheduler-truncate\"\n            [axTooltip]=\"daySlot.holiday.holiday?.title ?? ''\"\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 }} )\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          [showUnassignedAppointments]=\"showUnassignedAppointments()\"\n          [showResourceHeaders]=\"true\"\n          [endDayHour]=\"endDayHour()\"\n          [startDayHour]=\"startDayHour()\"\n          [hasActions]=\"hasActions()\"\n          [dragStartDelay]=\"dragStartDelay()\"\n          [tooltipTemplate]=\"tooltipTemplate()\"\n          [appointments]=\"daySlot.originalAppointmentsForThisDay\"\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 multi-day -->\n  <div\n    class=\"ax-scheduler-timeline-multi-day-resource-container\"\n    [style.--ax-comp-scheduler-hours-count]=\"getHoursCount()\"\n  >\n    <!-- Top header with day names -->\n    <div class=\"ax-scheduler-timeline-multi-day-top-header\">\n      <!-- Resource placeholder -->\n      <div class=\"ax-scheduler-timeline-multi-day-resource-header-placeholder\"></div>\n      <!-- Day headers -->\n      @for (daySlot of daysDataForTimelineViews(); track daySlot.date.date.getTime()) {\n        <div class=\"ax-scheduler-timeline-multi-day-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          >\n            <span\n              class=\"ax-scheduler-week-header-date-day-char ax-scheduler-truncate\"\n              [axTooltip]=\"daySlot.holiday.holiday?.title ?? ''\"\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 }} )\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-multi-day-time-header\">\n      <!-- Resource placeholder -->\n      <div class=\"ax-scheduler-timeline-multi-day-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-multi-day-day-time-slots\">\n          @for (hour of getHoursArray(); track hour.date.getTime()) {\n            <div class=\"ax-scheduler-timeline-multi-day-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-multi-day-content\">\n      <!-- Resource headers column -->\n      <div class=\"ax-scheduler-timeline-multi-day-resource-headers\">\n        <!-- Resource headers -->\n        @for (resourceId of resourceIds(); track resourceId) {\n          <div\n            class=\"ax-scheduler-timeline-multi-day-resource-header\"\n            [style.height]=\"getResourceRowHeight(resourceId)\"\n          >\n            <span class=\"ax-scheduler-timeline-resource-title\">{{ getResourceTitle(resourceId) }}</span>\n          </div>\n        }\n      </div>\n\n      <!-- Days columns -->\n      <div class=\"ax-scheduler-timeline-multi-day-days-container\">\n        @for (daySlot of daysDataForTimelineViews(); track daySlot.date.date.getTime()) {\n          <div class=\"ax-scheduler-timeline-multi-day-column\">\n            <!-- Resource rows for this day -->\n            <div class=\"ax-scheduler-timeline-multi-day-resource-rows\">\n              @for (resourceId of resourceIds(); track resourceId) {\n                <div\n                  class=\"ax-scheduler-timeline-multi-day-resource-row\"\n                  [style.height]=\"getResourceRowHeight(resourceId)\"\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                    [showUnassignedAppointments]=\"resourceId === 'unassigned'\"\n                    [showResourceHeaders]=\"false\"\n                    [endDayHour]=\"endDayHour()\"\n                    [startDayHour]=\"startDayHour()\"\n                    [hasActions]=\"hasActions()\"\n                    [dragStartDelay]=\"dragStartDelay()\"\n                    [tooltipTemplate]=\"tooltipTemplate()\"\n                    [appointments]=\"\n                      getAppointmentsForResourceAndDay(resourceId, daySlot.originalAppointmentsForThisDay)\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: ["ax-scheduler-timeline-multi-day-view{background-color:inherit}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-day-view-container{height:100%;display:flex;flex-direction:row;background-color:inherit}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day{gap:.25rem;height:4rem;display:flex;position:relative;align-items:start;padding-inline:1rem;flex-direction:column;padding-block:.25rem;justify-content:center;border-inline-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface));border-block-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day.ax-state-today{color:rgba(var(--ax-sys-color-primary-surface));background-color:rgba(var(--ax-sys-color-primary-surface),.05)}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day.ax-state-today .ax-scheduler-week-header-date-day-char{font-weight:500}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day.ax-state-today .ax-scheduler-week-header-date-day-num{font-weight:700}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day.ax-state-holiday{color:rgba(var(--ax-sys-color-danger-surface))}ax-scheduler-timeline-multi-day-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-multi-day-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day .ax-scheduler-week-header-date-day-char{max-width:100%;position:sticky;font-weight:300;inset-inline-start:1rem}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-day-view-container .ax-scheduler-week-header-date-day .ax-scheduler-week-header-date-day-num{position:sticky;font-weight:500;font-size:1.25rem;inset-inline-start:1rem}ax-scheduler-timeline-multi-day-view ax-scheduler-timeline-day-view{height:calc(100% - 4rem)}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container{height:100%;display:flex;overflow:auto;flex-direction:column;background-color:inherit}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-top-header{position:sticky;top:0;z-index:20;display:flex;flex-direction:row;min-width:max-content;background-color:inherit;border-bottom:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-top-header .ax-scheduler-timeline-multi-day-resource-header-placeholder{width:var(--ax-comp-scheduler-resource-header-width, 8rem);min-width:var(--ax-comp-scheduler-resource-header-width, 8rem);height:4rem;display:flex;align-items:center;justify-content:center;background-color:inherit;border-right:1px solid rgba(var(--ax-sys-color-border-lightest-surface));position:sticky;left:0;z-index:17}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-top-header .ax-scheduler-timeline-multi-day-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));border-right:1px solid rgba(var(--ax-sys-color-border-lightest-surface));flex-shrink:0}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-top-header .ax-scheduler-timeline-multi-day-day-header .ax-scheduler-week-header-date-day{gap:.25rem;height:4rem;display:flex;position:relative;align-items:start;padding-inline:1rem;flex-direction:column;padding-block:.25rem;justify-content:center}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-top-header .ax-scheduler-timeline-multi-day-day-header .ax-scheduler-week-header-date-day.ax-state-today{color:rgba(var(--ax-sys-color-primary-surface));background-color:rgba(var(--ax-sys-color-primary-surface),.05)}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-top-header .ax-scheduler-timeline-multi-day-day-header .ax-scheduler-week-header-date-day.ax-state-today .ax-scheduler-week-header-date-day-char{font-weight:500}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-top-header .ax-scheduler-timeline-multi-day-day-header .ax-scheduler-week-header-date-day.ax-state-today .ax-scheduler-week-header-date-day-num{font-weight:700}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-top-header .ax-scheduler-timeline-multi-day-day-header .ax-scheduler-week-header-date-day.ax-state-holiday{color:rgba(var(--ax-sys-color-danger-surface))}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-top-header .ax-scheduler-timeline-multi-day-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-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-top-header .ax-scheduler-timeline-multi-day-day-header .ax-scheduler-week-header-date-day .ax-scheduler-week-header-date-day-char{max-width:100%;font-weight:300;position:sticky;font-size:.75rem;inset-inline-start:calc(var(--ax-comp-scheduler-resource-header-width, 8rem) + 1rem)}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-top-header .ax-scheduler-timeline-multi-day-day-header .ax-scheduler-week-header-date-day .ax-scheduler-week-header-date-day-num{font-weight:500;position:sticky;font-size:1.25rem;inset-inline-start:calc(var(--ax-comp-scheduler-resource-header-width, 8rem) + 1rem)}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-time-header{top:4rem;z-index:19;display:flex;position:sticky;flex-direction:row;min-width:max-content;background-color:inherit;border-bottom:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-time-header .ax-scheduler-timeline-multi-day-time-header-placeholder{z-index:17;height:2rem;display:flex;position:sticky;align-items:center;inset-inline-start:0;justify-content:center;background-color:inherit;width:var(--ax-comp-scheduler-resource-header-width, 8rem);min-width:var(--ax-comp-scheduler-resource-header-width, 8rem);border-right:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-time-header .ax-scheduler-timeline-multi-day-day-time-slots{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));height:2rem;display:flex;flex-direction:row;border-right:1px solid rgba(var(--ax-sys-color-border-lightest-surface));flex-shrink:0;background-color:inherit}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-time-header .ax-scheduler-timeline-multi-day-day-time-slots .ax-scheduler-timeline-multi-day-time-slot{display:flex;flex-shrink:0;position:relative;align-items:center;padding-inline:1rem;width:var(--ax-comp-scheduler-timeline-view-blocks-width);min-width:var(--ax-comp-scheduler-timeline-view-blocks-width);border-right:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-time-header .ax-scheduler-timeline-multi-day-day-time-slots .ax-scheduler-timeline-multi-day-time-slot span{z-index:1;font-weight:400;position:sticky;font-size:.75rem;inset-inline-start:calc(var(--ax-comp-scheduler-resource-header-width, 8rem) + 1rem)}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-content{flex:1;display:flex;min-height:0;width:fit-content;flex-direction:row;background-color:inherit}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-content .ax-scheduler-timeline-multi-day-resource-headers{z-index:18;display:flex;position:sticky;height:fit-content;inset-inline-start:0;flex-direction:column;background-color:inherit;width:var(--ax-comp-scheduler-resource-header-width, 8rem);min-width:var(--ax-comp-scheduler-resource-header-width, 8rem);border-right:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-content .ax-scheduler-timeline-multi-day-resource-headers .ax-scheduler-timeline-multi-day-resource-header{display:flex;align-items:center;justify-content:center;padding:.5rem;border-bottom:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-content .ax-scheduler-timeline-multi-day-resource-headers .ax-scheduler-timeline-multi-day-resource-header .ax-scheduler-timeline-resource-title{font-weight:500;font-size:.875rem;text-align:center;word-break:break-word}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-content .ax-scheduler-timeline-multi-day-days-container{flex:1;display:flex;flex-direction:row;min-width:max-content}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-content .ax-scheduler-timeline-multi-day-days-container .ax-scheduler-timeline-multi-day-column{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));display:flex;flex-direction:column;border-right:1px solid rgba(var(--ax-sys-color-border-lightest-surface));flex-shrink:0}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-content .ax-scheduler-timeline-multi-day-days-container .ax-scheduler-timeline-multi-day-column .ax-scheduler-timeline-multi-day-resource-rows{flex:1;display:flex;flex-direction:column}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-content .ax-scheduler-timeline-multi-day-days-container .ax-scheduler-timeline-multi-day-column .ax-scheduler-timeline-multi-day-resource-rows .ax-scheduler-timeline-multi-day-resource-row{border-bottom:1px solid rgba(var(--ax-sys-color-border-lightest-surface));min-height:var(--ax-comp-scheduler-basic-view-blocks-height)}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-content .ax-scheduler-timeline-multi-day-days-container .ax-scheduler-timeline-multi-day-column .ax-scheduler-timeline-multi-day-resource-rows .ax-scheduler-timeline-multi-day-resource-row ax-scheduler-timeline-day-view{height:100%;width:100%;display:block}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-content .ax-scheduler-timeline-multi-day-days-container .ax-scheduler-timeline-multi-day-column .ax-scheduler-timeline-multi-day-resource-rows .ax-scheduler-timeline-multi-day-resource-row ax-scheduler-timeline-day-view .ax-scheduler-timeline-header{display:none}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-content .ax-scheduler-timeline-multi-day-days-container .ax-scheduler-timeline-multi-day-column .ax-scheduler-timeline-multi-day-resource-rows .ax-scheduler-timeline-multi-day-resource-row ax-scheduler-timeline-day-view .ax-scheduler-timeline-content{height:100%;position:relative}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-content .ax-scheduler-timeline-multi-day-days-container .ax-scheduler-timeline-multi-day-column .ax-scheduler-timeline-multi-day-resource-rows .ax-scheduler-timeline-multi-day-resource-row ax-scheduler-timeline-day-view .ax-scheduler-timeline-appointment-container{top:0;width:100%;height:100%;position:absolute}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-content .ax-scheduler-timeline-multi-day-days-container .ax-scheduler-timeline-multi-day-column .ax-scheduler-timeline-multi-day-resource-rows .ax-scheduler-timeline-multi-day-resource-row ax-scheduler-timeline-day-view .ax-scheduler-timeline-appointment-container .ax-scheduler-timeline-appointment{width:100%;display:flex;overflow:hidden;position:absolute;inset-inline-start:0;flex-direction:column;padding-block:.25rem;padding-inline:.5rem;border-radius:calc(var(--ax-sys-border-radius) / 2)}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-content .ax-scheduler-timeline-multi-day-days-container .ax-scheduler-timeline-multi-day-column .ax-scheduler-timeline-multi-day-resource-rows .ax-scheduler-timeline-multi-day-resource-row ax-scheduler-timeline-day-view .ax-scheduler-timeline-slot-row{height:100%;display:flex;position:relative;width:max-content}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-content .ax-scheduler-timeline-multi-day-days-container .ax-scheduler-timeline-multi-day-column .ax-scheduler-timeline-multi-day-resource-rows .ax-scheduler-timeline-multi-day-resource-row ax-scheduler-timeline-day-view .ax-scheduler-timeline-slot-row .ax-scheduler-timeline-slot-cell{width:var(--ax-comp-scheduler-timeline-view-blocks-width);border-inline-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface));position:relative;flex-shrink:0}ax-scheduler-timeline-multi-day-view .ax-scheduler-timeline-multi-day-resource-container .ax-scheduler-timeline-multi-day-content .ax-scheduler-timeline-multi-day-days-container .ax-scheduler-timeline-multi-day-column .ax-scheduler-timeline-multi-day-resource-rows .ax-scheduler-timeline-multi-day-resource-row ax-scheduler-timeline-day-view .ax-scheduler-timeline-slot-row .ax-scheduler-timeline-slot-cell:after{content:\"\";position:absolute;top:0;right:0;width:1px;height:100%;background-color:rgba(var(--ax-sys-color-border-lightest-surface),.3)}\n"] }]
         }] });
 
 class AXSchedulerWeekViewComponent extends NXComponent {
@@ -2164,22 +2713,21 @@ class AXSchedulerWeekViewComponent extends NXComponent {
         return this.readonly();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.4", ngImport: i0, type: AXSchedulerWeekViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.4", 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 }, 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": "this.isReadonly" } }, providers: [{ provide: AXComponent, useExisting: AXSchedulerWeekViewComponent }], 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        >\n          <span\n            class=\"ax-scheduler-week-header-date-day-char ax-scheduler-truncate\"\n            [axTooltip]=\"day.holiday?.holiday?.title ?? ''\"\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 }} )\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  <div class=\"ax-scheduler-week-header-days\">\n    <div class=\"ax-scheduler-week-header-table\">{{ '@acorex:dateTime.duration.all-day' | translate | async }}</div>\n    <div aria-hidden=\"true\" class=\"ax-scheduler-week-header-date\">\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          @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              [ngClass]=\"\n                slotData.appointments[0].cssClass ??\n                `ax-scheduler-${slotData.appointments[0].priority ?? 'primary'}-periority`\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              [ngClass]=\"\n                slotData.appointments[1].cssClass ??\n                `ax-scheduler-${slotData.appointments[1].priority ?? 'primary'}-periority`\n              \"\n            >\n              +{{ slotData.appointments.length - 1 }}\n            </div>\n            <ax-popover [target]=\"moreAppointments\">\n              <div class=\"ax-overlay-pane 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                      [ngClass]=\"appointment.cssClass ?? `ax-scheduler-${appointment.priority ?? 'primary'}-periority`\"\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\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    <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          [ngClass]=\"appt.appointment.cssClass ?? `ax-scheduler-${appt.appointment.priority ?? 'primary'}-periority`\"\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            [ngClass]=\"\n              badge.hiddenAppointments[0].cssClass ??\n              `ax-scheduler-${badge.hiddenAppointments[0].priority ?? 'primary'}-periority`\n            \"\n          >\n            +{{ badge.count }}\n          </div>\n          <!-- The Popover -->\n          <ax-popover [target]=\"actionButton\">\n            <div class=\"ax-overlay-pane 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                  [ngClass]=\"appointment.cssClass ?? `ax-scheduler-${appointment.priority ?? 'primary'}-periority`\"\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: ["ax-scheduler-week-view{display:block;position:relative;background-color:inherit;min-width:var(--ax-comp-scheduler-width)}ax-scheduler-week-view .ax-scheduler-appointment-badge{display:flex;width:1.5rem;height:1.5rem;cursor:pointer;font-size:.75rem;align-items:center;border-radius:9999px;justify-content:center}ax-scheduler-week-view .ax-scheduler-week-header{top:0;z-index:2;width:100%;position:sticky;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;background-color:inherit;border-block-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-table{z-index:2;flex-shrink:0;position:sticky;text-align:center;inset-inline-start:0;width:var(--ax-comp-scheduler-basic-view-blocks-width);background-color:inherit;border-inline-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date{width:calc(100% - var(--ax-comp-scheduler-basic-view-blocks-width));display:flex}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date div{width:100%;text-align:center;border-inline-end:1px solid rgba(var(--ax-sys-color-border-lightest-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{gap:.25rem;display:grid;align-items:center;padding-inline:.5rem;justify-content: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.ax-state-today{color:rgba(var(--ax-sys-color-primary-surface));background-color:rgba(var(--ax-sys-color-primary-surface),.05)}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{font-weight: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{font-weight: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: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%;font-weight: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-weight:500;font-size:1.25rem}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date div:last-child{border-inline-end-width:0}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date .ax-scheduler-all-day-slot{gap:.25rem;display:flex;width:14.2857142857%}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;overflow:hidden;text-align:start;padding-inline:.5rem;width:100%;border-radius:calc(var(--ax-sys-border-radius) / 2)}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-time-container{width:100%;display:flex;background-color:inherit}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-time{z-index:1;position:sticky;inset-inline-start:0;background-color:var(--ax-comp-scheduler-all-day-bg, inherit)}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-time div{display:block;text-align:center;padding-inline:.5rem;width:var(--ax-comp-scheduler-basic-view-blocks-width);height:calc(var(--ax-comp-scheduler-basic-view-blocks-height) * 2);border-inline-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-table-container{width:100%;position:relative}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-table-container .ax-scheduler-week-appointment-container{top:0;width:100%;position:absolute}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-table-container .ax-scheduler-week-appointment-container .ax-scheduler-week-appointment{display:flex;position:absolute;inset-inline-start:0;flex-direction:column;padding-block:.25rem;padding-inline:.5rem;border-radius:calc(var(--ax-sys-border-radius) / 2)}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-block-start:1px solid 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-block-start-width:0}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-table-container table tr td{width:100%;text-align:center;border-inline-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-table-container table tr td:last-child{border-inline-end-width:0}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-duration:var(--ax-sys-transition-duration);transition-timing-function:var(--ax-sys-transition-timing-function)}ax-scheduler-week-view:not(.ax-state-readonly) .ax-scheduler-all-day-slot:hover,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}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: "component", type: AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "directive", type: AXDragDirective, selector: "[axDrag]", inputs: ["dragData", "dragDisabled", "dragTransition", "dragElementClone", "dropZoneGroup", "dragStartDelay", "dragResetOnDblClick", "dragLockAxis", "dragClonedTemplate", "dragCursor", "dragBoundary", "dragTransitionDuration"], outputs: ["dragPositionChanged"] }, { kind: "directive", type: AXDropZoneDirective, selector: "[axDropZone]", inputs: ["dropZoneGroup"], outputs: ["onElementDrop", "onElementHover"], exportAs: ["axDropZone"] }, { 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: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AXFormatPipe, name: "format" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.4", 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 }, 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": "this.isReadonly" } }, providers: [{ provide: AXComponent, useExisting: AXSchedulerWeekViewComponent }], 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        >\n          <span\n            class=\"ax-scheduler-week-header-date-day-char ax-scheduler-truncate\"\n            [axTooltip]=\"day.holiday?.holiday?.title ?? ''\"\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 }} )\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  <div class=\"ax-scheduler-week-header-days\">\n    <div class=\"ax-scheduler-week-header-table\">{{ '@acorex:dateTime.duration.all-day' | translate | async }}</div>\n    <div aria-hidden=\"true\" class=\"ax-scheduler-week-header-date\">\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          @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              [ngClass]=\"\n                slotData.appointments[0].cssClass ??\n                `ax-scheduler-${slotData.appointments[0].priority ?? 'primary'}-periority`\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              [ngClass]=\"\n                slotData.appointments[1].cssClass ??\n                `ax-scheduler-${slotData.appointments[1].priority ?? 'primary'}-periority`\n              \"\n            >\n              +{{ slotData.appointments.length - 1 }}\n            </div>\n            <ax-popover [target]=\"moreAppointments\">\n              <div class=\"ax-overlay-pane 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                      [ngClass]=\"appointment.cssClass ?? `ax-scheduler-${appointment.priority ?? 'primary'}-periority`\"\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\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    <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          [ngClass]=\"appt.appointment.cssClass ?? `ax-scheduler-${appt.appointment.priority ?? 'primary'}-periority`\"\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            [ngClass]=\"\n              badge.hiddenAppointments[0].cssClass ??\n              `ax-scheduler-${badge.hiddenAppointments[0].priority ?? 'primary'}-periority`\n            \"\n          >\n            +{{ badge.count }}\n          </div>\n          <!-- The Popover -->\n          <ax-popover [target]=\"actionButton\">\n            <div class=\"ax-overlay-pane 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                  [ngClass]=\"appointment.cssClass ?? `ax-scheduler-${appointment.priority ?? 'primary'}-periority`\"\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: ["ax-scheduler-week-view{display:block;position:relative;background-color:inherit;min-width:var(--ax-comp-scheduler-width)}ax-scheduler-week-view .ax-scheduler-appointment-badge{display:flex;width:1.5rem;height:1.5rem;cursor:pointer;font-size:.75rem;align-items:center;border-radius:9999px;justify-content:center}ax-scheduler-week-view .ax-scheduler-week-header{top:0;z-index:2;width:100%;position:sticky;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;background-color:inherit;border-block-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-table{z-index:2;flex-shrink:0;position:sticky;text-align:center;inset-inline-start:0;width:var(--ax-comp-scheduler-basic-view-blocks-width);background-color:inherit;border-inline-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date{width:calc(100% - var(--ax-comp-scheduler-basic-view-blocks-width));display:flex}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date div{width:100%;text-align:center;border-inline-end:1px solid rgba(var(--ax-sys-color-border-lightest-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{gap:.25rem;display:grid;align-items:center;padding-inline:.5rem;justify-content: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.ax-state-today{color:rgba(var(--ax-sys-color-primary-surface));background-color:rgba(var(--ax-sys-color-primary-surface),.05)}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{font-weight: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{font-weight: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: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%;font-weight: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-weight:500;font-size:1.25rem}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date div:last-child{border-inline-end-width:0}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date .ax-scheduler-all-day-slot{gap:.25rem;display:flex;width:14.2857142857%}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;overflow:hidden;text-align:start;padding-inline:.5rem;width:100%;border-radius:calc(var(--ax-sys-border-radius) / 2)}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-time-container{width:100%;display:flex;background-color:inherit}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-time{z-index:1;position:sticky;inset-inline-start:0;background-color:var(--ax-comp-scheduler-all-day-bg, inherit)}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-time div{display:block;text-align:center;padding-inline:.5rem;width:var(--ax-comp-scheduler-basic-view-blocks-width);height:calc(var(--ax-comp-scheduler-basic-view-blocks-height) * 2);border-inline-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-table-container{width:100%;position:relative}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-table-container .ax-scheduler-week-appointment-container{top:0;width:100%;position:absolute}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-table-container .ax-scheduler-week-appointment-container .ax-scheduler-week-appointment{display:flex;position:absolute;inset-inline-start:0;flex-direction:column;padding-block:.25rem;padding-inline:.5rem;border-radius:calc(var(--ax-sys-border-radius) / 2)}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-block-start:1px solid 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-block-start-width:0}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-table-container table tr td{width:100%;text-align:center;border-inline-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-table-container table tr td:last-child{border-inline-end-width:0}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-duration:var(--ax-sys-transition-duration);transition-timing-function:var(--ax-sys-transition-timing-function)}ax-scheduler-week-view:not(.ax-state-readonly) .ax-scheduler-all-day-slot:hover,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}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: AXDragDirective, selector: "[axDrag]", inputs: ["dragData", "dragDisabled", "dragTransition", "dragElementClone", "dropZoneGroup", "dragStartDelay", "dragResetOnDblClick", "dragLockAxis", "dragClonedTemplate", "dragCursor", "dragBoundary", "dragTransitionDuration"], outputs: ["dragPositionChanged"] }, { kind: "component", type: AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "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 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.4", ngImport: i0, type: AXSchedulerWeekViewComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ax-scheduler-week-view', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [
                         NgClass,
-                        AXDecoratorGenericComponent,
                         AsyncPipe,
-                        AXTranslatorPipe,
-                        AXPopoverComponent,
                         AXFormatPipe,
                         AXDragDirective,
-                        AXDropZoneDirective,
+                        AXTranslatorPipe,
+                        AXPopoverComponent,
                         AXTooltipDirective,
+                        AXDropZoneDirective,
                         AXDecoratorIconComponent,
-                        AXTooltipDirective,
+                        AXDecoratorGenericComponent,
                     ], providers: [{ provide: AXComponent, useExisting: AXSchedulerWeekViewComponent }], 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        >\n          <span\n            class=\"ax-scheduler-week-header-date-day-char ax-scheduler-truncate\"\n            [axTooltip]=\"day.holiday?.holiday?.title ?? ''\"\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 }} )\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  <div class=\"ax-scheduler-week-header-days\">\n    <div class=\"ax-scheduler-week-header-table\">{{ '@acorex:dateTime.duration.all-day' | translate | async }}</div>\n    <div aria-hidden=\"true\" class=\"ax-scheduler-week-header-date\">\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          @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              [ngClass]=\"\n                slotData.appointments[0].cssClass ??\n                `ax-scheduler-${slotData.appointments[0].priority ?? 'primary'}-periority`\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              [ngClass]=\"\n                slotData.appointments[1].cssClass ??\n                `ax-scheduler-${slotData.appointments[1].priority ?? 'primary'}-periority`\n              \"\n            >\n              +{{ slotData.appointments.length - 1 }}\n            </div>\n            <ax-popover [target]=\"moreAppointments\">\n              <div class=\"ax-overlay-pane 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                      [ngClass]=\"appointment.cssClass ?? `ax-scheduler-${appointment.priority ?? 'primary'}-periority`\"\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\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    <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          [ngClass]=\"appt.appointment.cssClass ?? `ax-scheduler-${appt.appointment.priority ?? 'primary'}-periority`\"\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            [ngClass]=\"\n              badge.hiddenAppointments[0].cssClass ??\n              `ax-scheduler-${badge.hiddenAppointments[0].priority ?? 'primary'}-periority`\n            \"\n          >\n            +{{ badge.count }}\n          </div>\n          <!-- The Popover -->\n          <ax-popover [target]=\"actionButton\">\n            <div class=\"ax-overlay-pane 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                  [ngClass]=\"appointment.cssClass ?? `ax-scheduler-${appointment.priority ?? 'primary'}-periority`\"\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: ["ax-scheduler-week-view{display:block;position:relative;background-color:inherit;min-width:var(--ax-comp-scheduler-width)}ax-scheduler-week-view .ax-scheduler-appointment-badge{display:flex;width:1.5rem;height:1.5rem;cursor:pointer;font-size:.75rem;align-items:center;border-radius:9999px;justify-content:center}ax-scheduler-week-view .ax-scheduler-week-header{top:0;z-index:2;width:100%;position:sticky;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;background-color:inherit;border-block-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-table{z-index:2;flex-shrink:0;position:sticky;text-align:center;inset-inline-start:0;width:var(--ax-comp-scheduler-basic-view-blocks-width);background-color:inherit;border-inline-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date{width:calc(100% - var(--ax-comp-scheduler-basic-view-blocks-width));display:flex}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date div{width:100%;text-align:center;border-inline-end:1px solid rgba(var(--ax-sys-color-border-lightest-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{gap:.25rem;display:grid;align-items:center;padding-inline:.5rem;justify-content: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.ax-state-today{color:rgba(var(--ax-sys-color-primary-surface));background-color:rgba(var(--ax-sys-color-primary-surface),.05)}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{font-weight: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{font-weight: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: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%;font-weight: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-weight:500;font-size:1.25rem}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date div:last-child{border-inline-end-width:0}ax-scheduler-week-view .ax-scheduler-week-header .ax-scheduler-week-header-days .ax-scheduler-week-header-date .ax-scheduler-all-day-slot{gap:.25rem;display:flex;width:14.2857142857%}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;overflow:hidden;text-align:start;padding-inline:.5rem;width:100%;border-radius:calc(var(--ax-sys-border-radius) / 2)}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-time-container{width:100%;display:flex;background-color:inherit}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-time{z-index:1;position:sticky;inset-inline-start:0;background-color:var(--ax-comp-scheduler-all-day-bg, inherit)}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-time div{display:block;text-align:center;padding-inline:.5rem;width:var(--ax-comp-scheduler-basic-view-blocks-width);height:calc(var(--ax-comp-scheduler-basic-view-blocks-height) * 2);border-inline-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-table-container{width:100%;position:relative}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-table-container .ax-scheduler-week-appointment-container{top:0;width:100%;position:absolute}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-table-container .ax-scheduler-week-appointment-container .ax-scheduler-week-appointment{display:flex;position:absolute;inset-inline-start:0;flex-direction:column;padding-block:.25rem;padding-inline:.5rem;border-radius:calc(var(--ax-sys-border-radius) / 2)}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-block-start:1px solid 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-block-start-width:0}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-table-container table tr td{width:100%;text-align:center;border-inline-end:1px solid rgba(var(--ax-sys-color-border-lightest-surface))}ax-scheduler-week-view .ax-scheduler-week-time-container .ax-scheduler-week-table-container table tr td:last-child{border-inline-end-width:0}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-duration:var(--ax-sys-transition-duration);transition-timing-function:var(--ax-sys-transition-timing-function)}ax-scheduler-week-view:not(.ax-state-readonly) .ax-scheduler-all-day-slot:hover,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}\n"] }]
         }], propDecorators: { isReadonly: [{
                 type: HostBinding,
@@ -2227,6 +2775,8 @@ class AXSchedulerComponent extends NXComponent {
         this.weekend = input([], ...(ngDevMode ? [{ debugName: "weekend" }] : []));
         this.allowFullScreen = input(true, ...(ngDevMode ? [{ debugName: "allowFullScreen" }] : []));
         this.multiDayViewDaysCount = input(7, ...(ngDevMode ? [{ debugName: "multiDayViewDaysCount" }] : []));
+        this.resources = input([], ...(ngDevMode ? [{ debugName: "resources" }] : []));
+        this.showUnassignedAppointments = input(true, ...(ngDevMode ? [{ debugName: "showUnassignedAppointments" }] : []));
         this.tooltipTemplate = input(...(ngDevMode ? [undefined, { debugName: "tooltipTemplate" }] : []));
         this.dataSource = input([], ...(ngDevMode ? [{ debugName: "dataSource" }] : []));
         this.holidays = input(...(ngDevMode ? [undefined, { debugName: "holidays" }] : []));
@@ -2600,26 +3150,26 @@ class AXSchedulerComponent extends NXComponent {
         this.onDataLoaded.emit();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.4", ngImport: i0, type: AXSchedulerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.4", 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 }, 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 }, firstDayOfWeek: { classPropertyName: "firstDayOfWeek", publicName: "firstDayOfWeek", 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" }, 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 }], 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 ax-text-xl\"\n            [ngClass]=\"{\n              'ax-icon-chevron-left': !rtl(),\n              'ax-icon-chevron-right': rtl(),\n            }\"\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 ax-text-xl\"\n            [ngClass]=\"{\n              'ax-icon-chevron-right': !rtl(),\n              'ax-icon-chevron-left': rtl(),\n            }\"\n          ></ax-icon>\n        </ax-button>\n        <ax-popover [target]=\"date\" #calendarPopover>\n          <div class=\"ax-overlay-pane\">\n            <ax-calendar\n              [type]=\"calendarType()\"\n              [depth]=\"calendarDepth()\"\n              [ngModel]=\"currentDate()\"\n              (onValueChanged)=\"calendarDateChanged($event)\"\n            ></ax-calendar>\n          </div>\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\n                class=\"fa-solid fa-expand\"\n                [ngClass]=\"{ 'fa-compress': isFullScreen(), 'fa-expand': !isFullScreen() }\"\n              ></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          [date]=\"currentDate()\"\n          [readonly]=\"readonly()\"\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          (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          [appointments]=\"viewAppointments()\"\n          [dragStartDelay]=\"dragStartDelay()\"\n          [tooltipTemplate]=\"tooltipTemplate()\"\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          (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          [draggable]=\"draggable()\"\n          [hasActions]=\"hasActions()\"\n          [calendar]=\"calendarType()\"\n          [endDayHour]=\"endDayHour()\"\n          [startDayHour]=\"startDayHour()\"\n          [appointments]=\"viewAppointments()\"\n          [dragStartDelay]=\"dragStartDelay()\"\n          [tooltipTemplate]=\"tooltipTemplate()\"\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-multi-day') {\n        <ax-scheduler-timeline-multi-day-view\n          [date]=\"currentDate()\"\n          [readonly]=\"readonly()\"\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          (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-multi-day-view>\n      }\n      @case ('timeline-month') {\n        <ax-scheduler-timeline-month-view\n          [date]=\"currentDate()\"\n          [readonly]=\"readonly()\"\n          [draggable]=\"draggable()\"\n          [calendar]=\"calendarType()\"\n          [hasActions]=\"hasActions()\"\n          [appointments]=\"viewAppointments()\"\n          [dragStartDelay]=\"dragStartDelay()\"\n          [tooltipTemplate]=\"tooltipTemplate()\"\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 ('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          (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", styles: [":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-surface);--ax-comp-scheduler-primary-text-color: var(--ax-sys-color-on-primary-surface);--ax-comp-scheduler-highest-periority-bg-color: var(--ax-sys-color-danger-dark-surface);--ax-comp-scheduler-highest-periority-text-color: var(--ax-sys-color-on-danger-dark-surface);--ax-comp-scheduler-high-periority-bg-color: var(--ax-sys-color-danger-surface);--ax-comp-scheduler-high-periority-text-color: var(--ax-sys-color-on-danger-surface);--ax-comp-scheduler-medium-periority-bg-color: var(--ax-sys-color-warning-surface);--ax-comp-scheduler-medium-periority-text-color: var(--ax-sys-color-on-warning-surface);--ax-comp-scheduler-low-periority-bg-color: var(--ax-sys-color-success-light-surface);--ax-comp-scheduler-low-periority-text-color: var(--ax-sys-color-on-success-light-surface);--ax-comp-scheduler-lowest-periority-bg-color: var(--ax-sys-color-success-lightest-surface);--ax-comp-scheduler-lowest-periority-text-color: var(--ax-sys-color-on-success-lightest-surface)}ax-scheduler{width:100%;height:100%;display:block;-webkit-user-select:none;user-select:none;font-size:.875rem;background-color:inherit}ax-scheduler.ax-full-screen-container{top:0;left:0;z-index:61;width:100vw;height:100vh;position:fixed}ax-scheduler .ax-scheduler-container{height:100%;display:flex;overflow:hidden;border-width:1px;flex-direction:column;background-color:inherit;border-radius:var(--ax-sys-border-radius)}ax-scheduler .ax-scheduler-container .ax-scheduler-header{display:flex;padding:1rem;overflow-x:auto;overflow-y:hidden;align-items:center;border-bottom-width:1px;justify-content:space-between}ax-scheduler .ax-scheduler-container .ax-scheduler-header .ax-scheduler-date{display:flex;min-width:20.5rem;align-items:center;justify-content:space-between}ax-scheduler .ax-scheduler-container .ax-scheduler-header .ax-scheduler-date p{margin:0;font-size:1rem;min-width:10rem;font-weight:500;text-align:center}ax-scheduler .ax-scheduler-container .ax-scheduler-actions{gap:.75rem;display:flex;align-items:center;justify-content:center}ax-scheduler .ax-scheduler-container .ax-scheduler-truncate{display:block;overflow:hidden;text-wrap:nowrap;text-overflow:ellipsis}ax-scheduler .ax-scheduler-container ax-subtitle{font-size:.75rem}ax-scheduler .ax-scheduler-container .ax-scheduler-views-container{height:100%;overflow:auto;background-color:inherit}ax-scheduler .ax-scheduler-primary-periority{color:rgba(var(--ax-comp-scheduler-primary-text-color));background-color:rgba(var(--ax-comp-scheduler-primary-bg-color))}ax-scheduler .ax-scheduler-highest-periority{color:rgba(var(--ax-comp-scheduler-highest-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-highest-periority-bg-color))}ax-scheduler .ax-scheduler-high-periority{color:rgba(var(--ax-comp-scheduler-high-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-high-periority-bg-color))}ax-scheduler .ax-scheduler-medium-periority{color:rgba(var(--ax-comp-scheduler-medium-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-medium-periority-bg-color))}ax-scheduler .ax-scheduler-low-periority{color:rgba(var(--ax-comp-scheduler-low-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-low-periority-bg-color))}ax-scheduler .ax-scheduler-lowest-periority{color:rgba(var(--ax-comp-scheduler-lowest-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-lowest-periority-bg-color))}.ax-overlay-pane.ax-scheduler-popover{gap:.25rem;display:grid;overflow:auto;padding:.25rem;max-height:10rem;font-size:.875rem;border-radius:.5rem}.ax-overlay-pane.ax-scheduler-popover.ax-scheduler-month-popover-appointment{font-size:.75rem}.ax-overlay-pane.ax-scheduler-popover:not(.ax-state-readonly) .ax-scheduler-popover-appointment{cursor:pointer}.ax-overlay-pane.ax-scheduler-popover .ax-scheduler-popover-appointment{display:flex;overflow:hidden;-webkit-user-select:none;user-select:none;flex-direction:column;padding-block:.25rem;padding-inline:.5rem;border-radius:calc(var(--ax-sys-border-radius) / 2);color:rgba(var(--ax-comp-scheduler-primary-text-color));background-color:rgba(var(--ax-comp-scheduler-primary-bg-color))}.ax-overlay-pane.ax-scheduler-popover .ax-scheduler-popover-appointment ax-subtitle{font-size:.75rem}.ax-overlay-pane.ax-scheduler-popover .ax-scheduler-popover-appointment .ax-scheduler-truncate{display:block;overflow:hidden;text-wrap:nowrap;text-overflow:ellipsis}.ax-overlay-pane.ax-scheduler-popover ax-title,.ax-overlay-pane.ax-scheduler-popover .ax-appointment-chip-title{display:flex;justify-content:space-between}.ax-overlay-pane.ax-scheduler-popover ax-title .ax-scheduler-action-icon,.ax-overlay-pane.ax-scheduler-popover .ax-appointment-chip-title .ax-scheduler-action-icon{width:auto;cursor:pointer}.ax-overlay-pane.ax-scheduler-popover .ax-scheduler-primary-periority{color:rgba(var(--ax-comp-scheduler-primary-text-color));background-color:rgba(var(--ax-comp-scheduler-primary-bg-color))}.ax-overlay-pane.ax-scheduler-popover .ax-scheduler-highest-periority{color:rgba(var(--ax-comp-scheduler-highest-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-highest-periority-bg-color))}.ax-overlay-pane.ax-scheduler-popover .ax-scheduler-high-periority{color:rgba(var(--ax-comp-scheduler-high-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-high-periority-bg-color))}.ax-overlay-pane.ax-scheduler-popover .ax-scheduler-medium-periority{color:rgba(var(--ax-comp-scheduler-medium-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-medium-periority-bg-color))}.ax-overlay-pane.ax-scheduler-popover .ax-scheduler-low-periority{color:rgba(var(--ax-comp-scheduler-low-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-low-periority-bg-color))}.ax-overlay-pane.ax-scheduler-popover .ax-scheduler-lowest-periority{color:rgba(var(--ax-comp-scheduler-lowest-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-lowest-periority-bg-color))}\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: 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", "dataSource", "minRecordsForSearch", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "dropdownWidth", "searchBoxAutoFocus"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed"] }, { kind: "component", type: AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { 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: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "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", "cellTemplate", "cellClass", "showNavigation", "count", "id", "weekend", "weekdays"], outputs: ["onOptionChanged", "valueChange", "onValueChanged", "minValueChange", "maxValueChange", "onBlur", "onFocus", "depthChange", "typeChange", "activeViewChange", "disabledDatesChange", "holidayDatesChange", "onNavigate", "onSlotClick", "countChange"] }, { kind: "component", type: AXSchedulerDayViewComponent, selector: "ax-scheduler-day-view", inputs: ["readonly", "draggable", "hasActions", "dragStartDelay", "calendar", "date", "endDayHour", "startDayHour", "appointments", "tooltipTemplate"], 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", "appointments", "tooltipTemplate"], 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", "tooltipTemplate"], 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", "date", "endDayHour", "startDayHour", "appointments", "tooltipTemplate"], outputs: ["slotClickedInternal", "slotDblClickedInternal", "slotRightClickedInternal", "appointmentClickedInternal", "appointmentDblClickedInternal", "appointmentRightClickedInternal", "onActionClickInternal", "onAppointmentDropInternal"] }, { kind: "component", type: AXSchedulerTimelineMultiDayViewComponent, selector: "ax-scheduler-timeline-multi-day-view", inputs: ["daysCount", "readonly", "draggable", "hasActions", "dragStartDelay", "calendar", "date", "endDayHour", "startDayHour", "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", "date", "appointments", "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"], outputs: ["slotClickedInternal", "slotDblClickedInternal", "slotRightClickedInternal", "appointmentClickedInternal", "appointmentDblClickedInternal", "appointmentRightClickedInternal", "onActionClickInternal", "onAppointmentDropInternal"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.4", 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 }, resources: { classPropertyName: "resources", publicName: "resources", isSignal: true, isRequired: false, transformFunction: null }, showUnassignedAppointments: { classPropertyName: "showUnassignedAppointments", publicName: "showUnassignedAppointments", 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 }, firstDayOfWeek: { classPropertyName: "firstDayOfWeek", publicName: "firstDayOfWeek", 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" }, 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 }], 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 ax-text-xl\"\n            [ngClass]=\"{\n              'ax-icon-chevron-left': !rtl(),\n              'ax-icon-chevron-right': rtl(),\n            }\"\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 ax-text-xl\"\n            [ngClass]=\"{\n              'ax-icon-chevron-right': !rtl(),\n              'ax-icon-chevron-left': rtl(),\n            }\"\n          ></ax-icon>\n        </ax-button>\n        <ax-popover [target]=\"date\" #calendarPopover>\n          <div class=\"ax-overlay-pane\">\n            <ax-calendar\n              [type]=\"calendarType()\"\n              [depth]=\"calendarDepth()\"\n              [ngModel]=\"currentDate()\"\n              (onValueChanged)=\"calendarDateChanged($event)\"\n            ></ax-calendar>\n          </div>\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\n                class=\"fa-solid fa-expand\"\n                [ngClass]=\"{ 'fa-compress': isFullScreen(), 'fa-expand': !isFullScreen() }\"\n              ></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          [date]=\"currentDate()\"\n          [readonly]=\"readonly()\"\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          (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          [appointments]=\"viewAppointments()\"\n          [dragStartDelay]=\"dragStartDelay()\"\n          [tooltipTemplate]=\"tooltipTemplate()\"\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          (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          [showUnassignedAppointments]=\"showUnassignedAppointments()\"\n          [showResourceHeaders]=\"true\"\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          (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-multi-day') {\n        <ax-scheduler-timeline-multi-day-view\n          [date]=\"currentDate()\"\n          [readonly]=\"readonly()\"\n          [resources]=\"resources()\"\n          [showUnassignedAppointments]=\"showUnassignedAppointments()\"\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          (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-multi-day-view>\n      }\n      @case ('timeline-month') {\n        <ax-scheduler-timeline-month-view\n          [date]=\"currentDate()\"\n          [readonly]=\"readonly()\"\n          [resources]=\"resources()\"\n          [showUnassignedAppointments]=\"showUnassignedAppointments()\"\n          [showResourceHeaders]=\"true\"\n          [draggable]=\"draggable()\"\n          [calendar]=\"calendarType()\"\n          [hasActions]=\"hasActions()\"\n          [appointments]=\"viewAppointments()\"\n          [dragStartDelay]=\"dragStartDelay()\"\n          [tooltipTemplate]=\"tooltipTemplate()\"\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 ('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          (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", styles: [":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-surface);--ax-comp-scheduler-primary-text-color: var(--ax-sys-color-on-primary-surface);--ax-comp-scheduler-highest-periority-bg-color: var(--ax-sys-color-danger-dark-surface);--ax-comp-scheduler-highest-periority-text-color: var(--ax-sys-color-on-danger-dark-surface);--ax-comp-scheduler-high-periority-bg-color: var(--ax-sys-color-danger-surface);--ax-comp-scheduler-high-periority-text-color: var(--ax-sys-color-on-danger-surface);--ax-comp-scheduler-medium-periority-bg-color: var(--ax-sys-color-warning-surface);--ax-comp-scheduler-medium-periority-text-color: var(--ax-sys-color-on-warning-surface);--ax-comp-scheduler-low-periority-bg-color: var(--ax-sys-color-success-light-surface);--ax-comp-scheduler-low-periority-text-color: var(--ax-sys-color-on-success-light-surface);--ax-comp-scheduler-lowest-periority-bg-color: var(--ax-sys-color-success-lightest-surface);--ax-comp-scheduler-lowest-periority-text-color: var(--ax-sys-color-on-success-lightest-surface)}ax-scheduler{width:100%;height:100%;display:block;-webkit-user-select:none;user-select:none;font-size:.875rem;background-color:inherit}ax-scheduler.ax-full-screen-container{top:0;left:0;z-index:61;width:100vw;height:100vh;position:fixed}ax-scheduler .ax-scheduler-container{height:100%;display:flex;overflow:hidden;border-width:1px;flex-direction:column;background-color:inherit;border-radius:var(--ax-sys-border-radius)}ax-scheduler .ax-scheduler-container .ax-scheduler-header{display:flex;padding:1rem;overflow-x:auto;overflow-y:hidden;align-items:center;border-bottom-width:1px;justify-content:space-between}ax-scheduler .ax-scheduler-container .ax-scheduler-header .ax-scheduler-date{display:flex;min-width:20.5rem;align-items:center;justify-content:space-between}ax-scheduler .ax-scheduler-container .ax-scheduler-header .ax-scheduler-date p{margin:0;font-size:1rem;min-width:10rem;font-weight:500;text-align:center}ax-scheduler .ax-scheduler-container .ax-scheduler-actions{gap:.75rem;display:flex;align-items:center;justify-content:center}ax-scheduler .ax-scheduler-container .ax-scheduler-truncate{display:block;overflow:hidden;text-wrap:nowrap;text-overflow:ellipsis}ax-scheduler .ax-scheduler-container ax-subtitle{font-size:.75rem}ax-scheduler .ax-scheduler-container .ax-scheduler-views-container{height:100%;overflow:auto;background-color:inherit}ax-scheduler .ax-scheduler-primary-periority{color:rgba(var(--ax-comp-scheduler-primary-text-color));background-color:rgba(var(--ax-comp-scheduler-primary-bg-color))}ax-scheduler .ax-scheduler-highest-periority{color:rgba(var(--ax-comp-scheduler-highest-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-highest-periority-bg-color))}ax-scheduler .ax-scheduler-high-periority{color:rgba(var(--ax-comp-scheduler-high-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-high-periority-bg-color))}ax-scheduler .ax-scheduler-medium-periority{color:rgba(var(--ax-comp-scheduler-medium-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-medium-periority-bg-color))}ax-scheduler .ax-scheduler-low-periority{color:rgba(var(--ax-comp-scheduler-low-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-low-periority-bg-color))}ax-scheduler .ax-scheduler-lowest-periority{color:rgba(var(--ax-comp-scheduler-lowest-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-lowest-periority-bg-color))}.ax-overlay-pane.ax-scheduler-popover{gap:.25rem;display:grid;overflow:auto;padding:.25rem;max-height:10rem;font-size:.875rem;border-radius:.5rem}.ax-overlay-pane.ax-scheduler-popover.ax-scheduler-month-popover-appointment{font-size:.75rem}.ax-overlay-pane.ax-scheduler-popover:not(.ax-state-readonly) .ax-scheduler-popover-appointment{cursor:pointer}.ax-overlay-pane.ax-scheduler-popover .ax-scheduler-popover-appointment{display:flex;overflow:hidden;-webkit-user-select:none;user-select:none;flex-direction:column;padding-block:.25rem;padding-inline:.5rem;border-radius:calc(var(--ax-sys-border-radius) / 2);color:rgba(var(--ax-comp-scheduler-primary-text-color));background-color:rgba(var(--ax-comp-scheduler-primary-bg-color))}.ax-overlay-pane.ax-scheduler-popover .ax-scheduler-popover-appointment ax-subtitle{font-size:.75rem}.ax-overlay-pane.ax-scheduler-popover .ax-scheduler-popover-appointment .ax-scheduler-truncate{display:block;overflow:hidden;text-wrap:nowrap;text-overflow:ellipsis}.ax-overlay-pane.ax-scheduler-popover ax-title,.ax-overlay-pane.ax-scheduler-popover .ax-appointment-chip-title{display:flex;justify-content:space-between}.ax-overlay-pane.ax-scheduler-popover ax-title .ax-scheduler-action-icon,.ax-overlay-pane.ax-scheduler-popover .ax-appointment-chip-title .ax-scheduler-action-icon{width:auto;cursor:pointer}.ax-overlay-pane.ax-scheduler-popover .ax-scheduler-primary-periority{color:rgba(var(--ax-comp-scheduler-primary-text-color));background-color:rgba(var(--ax-comp-scheduler-primary-bg-color))}.ax-overlay-pane.ax-scheduler-popover .ax-scheduler-highest-periority{color:rgba(var(--ax-comp-scheduler-highest-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-highest-periority-bg-color))}.ax-overlay-pane.ax-scheduler-popover .ax-scheduler-high-periority{color:rgba(var(--ax-comp-scheduler-high-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-high-periority-bg-color))}.ax-overlay-pane.ax-scheduler-popover .ax-scheduler-medium-periority{color:rgba(var(--ax-comp-scheduler-medium-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-medium-periority-bg-color))}.ax-overlay-pane.ax-scheduler-popover .ax-scheduler-low-periority{color:rgba(var(--ax-comp-scheduler-low-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-low-periority-bg-color))}.ax-overlay-pane.ax-scheduler-popover .ax-scheduler-lowest-periority{color:rgba(var(--ax-comp-scheduler-lowest-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-lowest-periority-bg-color))}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: 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", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "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"], 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", "dataSource", "minRecordsForSearch", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "dropdownWidth", "searchBoxAutoFocus"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed"] }, { kind: "component", type: AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: AXSchedulerDayViewComponent, selector: "ax-scheduler-day-view", inputs: ["readonly", "draggable", "hasActions", "dragStartDelay", "calendar", "date", "endDayHour", "startDayHour", "appointments", "tooltipTemplate"], 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", "appointments", "tooltipTemplate"], 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", "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"], 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", "date", "endDayHour", "startDayHour", "resources", "showUnassignedAppointments", "showResourceHeaders", "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", "date", "resources", "showUnassignedAppointments", "showResourceHeaders", "appointments", "tooltipTemplate"], outputs: ["slotClickedInternal", "slotDblClickedInternal", "slotRightClickedInternal", "appointmentClickedInternal", "appointmentDblClickedInternal", "appointmentRightClickedInternal", "onActionClickInternal", "onAppointmentDropInternal"] }, { kind: "component", type: AXSchedulerTimelineMultiDayViewComponent, selector: "ax-scheduler-timeline-multi-day-view", inputs: ["daysCount", "readonly", "draggable", "hasActions", "dragStartDelay", "calendar", "date", "endDayHour", "startDayHour", "resources", "showUnassignedAppointments", "appointments", "tooltipTemplate"], outputs: ["slotClickedInternal", "slotDblClickedInternal", "slotRightClickedInternal", "appointmentClickedInternal", "appointmentDblClickedInternal", "appointmentRightClickedInternal", "onActionClickInternal", "onAppointmentDropInternal"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.4", ngImport: i0, type: AXSchedulerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ax-scheduler', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [
+                        NgClass,
                         FormsModule,
-                        AXSelectBoxComponent,
-                        AXDecoratorIconComponent,
                         AXButtonComponent,
-                        NgClass,
                         AXPopoverComponent,
                         AXCalendarComponent,
+                        AXSelectBoxComponent,
+                        AXDecoratorIconComponent,
                         AXSchedulerDayViewComponent,
                         AXSchedulerWeekViewComponent,
                         AXSchedulerMonthViewComponent,
+                        AXSchedulerAgendaViewComponent,
                         AXSchedulerTimelineDayViewComponent,
-                        AXSchedulerTimelineMultiDayViewComponent,
                         AXSchedulerTimelineMonthViewComponent,
-                        AXSchedulerAgendaViewComponent,
-                    ], 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 ax-text-xl\"\n            [ngClass]=\"{\n              'ax-icon-chevron-left': !rtl(),\n              'ax-icon-chevron-right': rtl(),\n            }\"\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 ax-text-xl\"\n            [ngClass]=\"{\n              'ax-icon-chevron-right': !rtl(),\n              'ax-icon-chevron-left': rtl(),\n            }\"\n          ></ax-icon>\n        </ax-button>\n        <ax-popover [target]=\"date\" #calendarPopover>\n          <div class=\"ax-overlay-pane\">\n            <ax-calendar\n              [type]=\"calendarType()\"\n              [depth]=\"calendarDepth()\"\n              [ngModel]=\"currentDate()\"\n              (onValueChanged)=\"calendarDateChanged($event)\"\n            ></ax-calendar>\n          </div>\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\n                class=\"fa-solid fa-expand\"\n                [ngClass]=\"{ 'fa-compress': isFullScreen(), 'fa-expand': !isFullScreen() }\"\n              ></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          [date]=\"currentDate()\"\n          [readonly]=\"readonly()\"\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          (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          [appointments]=\"viewAppointments()\"\n          [dragStartDelay]=\"dragStartDelay()\"\n          [tooltipTemplate]=\"tooltipTemplate()\"\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          (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          [draggable]=\"draggable()\"\n          [hasActions]=\"hasActions()\"\n          [calendar]=\"calendarType()\"\n          [endDayHour]=\"endDayHour()\"\n          [startDayHour]=\"startDayHour()\"\n          [appointments]=\"viewAppointments()\"\n          [dragStartDelay]=\"dragStartDelay()\"\n          [tooltipTemplate]=\"tooltipTemplate()\"\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-multi-day') {\n        <ax-scheduler-timeline-multi-day-view\n          [date]=\"currentDate()\"\n          [readonly]=\"readonly()\"\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          (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-multi-day-view>\n      }\n      @case ('timeline-month') {\n        <ax-scheduler-timeline-month-view\n          [date]=\"currentDate()\"\n          [readonly]=\"readonly()\"\n          [draggable]=\"draggable()\"\n          [calendar]=\"calendarType()\"\n          [hasActions]=\"hasActions()\"\n          [appointments]=\"viewAppointments()\"\n          [dragStartDelay]=\"dragStartDelay()\"\n          [tooltipTemplate]=\"tooltipTemplate()\"\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 ('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          (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", styles: [":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-surface);--ax-comp-scheduler-primary-text-color: var(--ax-sys-color-on-primary-surface);--ax-comp-scheduler-highest-periority-bg-color: var(--ax-sys-color-danger-dark-surface);--ax-comp-scheduler-highest-periority-text-color: var(--ax-sys-color-on-danger-dark-surface);--ax-comp-scheduler-high-periority-bg-color: var(--ax-sys-color-danger-surface);--ax-comp-scheduler-high-periority-text-color: var(--ax-sys-color-on-danger-surface);--ax-comp-scheduler-medium-periority-bg-color: var(--ax-sys-color-warning-surface);--ax-comp-scheduler-medium-periority-text-color: var(--ax-sys-color-on-warning-surface);--ax-comp-scheduler-low-periority-bg-color: var(--ax-sys-color-success-light-surface);--ax-comp-scheduler-low-periority-text-color: var(--ax-sys-color-on-success-light-surface);--ax-comp-scheduler-lowest-periority-bg-color: var(--ax-sys-color-success-lightest-surface);--ax-comp-scheduler-lowest-periority-text-color: var(--ax-sys-color-on-success-lightest-surface)}ax-scheduler{width:100%;height:100%;display:block;-webkit-user-select:none;user-select:none;font-size:.875rem;background-color:inherit}ax-scheduler.ax-full-screen-container{top:0;left:0;z-index:61;width:100vw;height:100vh;position:fixed}ax-scheduler .ax-scheduler-container{height:100%;display:flex;overflow:hidden;border-width:1px;flex-direction:column;background-color:inherit;border-radius:var(--ax-sys-border-radius)}ax-scheduler .ax-scheduler-container .ax-scheduler-header{display:flex;padding:1rem;overflow-x:auto;overflow-y:hidden;align-items:center;border-bottom-width:1px;justify-content:space-between}ax-scheduler .ax-scheduler-container .ax-scheduler-header .ax-scheduler-date{display:flex;min-width:20.5rem;align-items:center;justify-content:space-between}ax-scheduler .ax-scheduler-container .ax-scheduler-header .ax-scheduler-date p{margin:0;font-size:1rem;min-width:10rem;font-weight:500;text-align:center}ax-scheduler .ax-scheduler-container .ax-scheduler-actions{gap:.75rem;display:flex;align-items:center;justify-content:center}ax-scheduler .ax-scheduler-container .ax-scheduler-truncate{display:block;overflow:hidden;text-wrap:nowrap;text-overflow:ellipsis}ax-scheduler .ax-scheduler-container ax-subtitle{font-size:.75rem}ax-scheduler .ax-scheduler-container .ax-scheduler-views-container{height:100%;overflow:auto;background-color:inherit}ax-scheduler .ax-scheduler-primary-periority{color:rgba(var(--ax-comp-scheduler-primary-text-color));background-color:rgba(var(--ax-comp-scheduler-primary-bg-color))}ax-scheduler .ax-scheduler-highest-periority{color:rgba(var(--ax-comp-scheduler-highest-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-highest-periority-bg-color))}ax-scheduler .ax-scheduler-high-periority{color:rgba(var(--ax-comp-scheduler-high-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-high-periority-bg-color))}ax-scheduler .ax-scheduler-medium-periority{color:rgba(var(--ax-comp-scheduler-medium-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-medium-periority-bg-color))}ax-scheduler .ax-scheduler-low-periority{color:rgba(var(--ax-comp-scheduler-low-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-low-periority-bg-color))}ax-scheduler .ax-scheduler-lowest-periority{color:rgba(var(--ax-comp-scheduler-lowest-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-lowest-periority-bg-color))}.ax-overlay-pane.ax-scheduler-popover{gap:.25rem;display:grid;overflow:auto;padding:.25rem;max-height:10rem;font-size:.875rem;border-radius:.5rem}.ax-overlay-pane.ax-scheduler-popover.ax-scheduler-month-popover-appointment{font-size:.75rem}.ax-overlay-pane.ax-scheduler-popover:not(.ax-state-readonly) .ax-scheduler-popover-appointment{cursor:pointer}.ax-overlay-pane.ax-scheduler-popover .ax-scheduler-popover-appointment{display:flex;overflow:hidden;-webkit-user-select:none;user-select:none;flex-direction:column;padding-block:.25rem;padding-inline:.5rem;border-radius:calc(var(--ax-sys-border-radius) / 2);color:rgba(var(--ax-comp-scheduler-primary-text-color));background-color:rgba(var(--ax-comp-scheduler-primary-bg-color))}.ax-overlay-pane.ax-scheduler-popover .ax-scheduler-popover-appointment ax-subtitle{font-size:.75rem}.ax-overlay-pane.ax-scheduler-popover .ax-scheduler-popover-appointment .ax-scheduler-truncate{display:block;overflow:hidden;text-wrap:nowrap;text-overflow:ellipsis}.ax-overlay-pane.ax-scheduler-popover ax-title,.ax-overlay-pane.ax-scheduler-popover .ax-appointment-chip-title{display:flex;justify-content:space-between}.ax-overlay-pane.ax-scheduler-popover ax-title .ax-scheduler-action-icon,.ax-overlay-pane.ax-scheduler-popover .ax-appointment-chip-title .ax-scheduler-action-icon{width:auto;cursor:pointer}.ax-overlay-pane.ax-scheduler-popover .ax-scheduler-primary-periority{color:rgba(var(--ax-comp-scheduler-primary-text-color));background-color:rgba(var(--ax-comp-scheduler-primary-bg-color))}.ax-overlay-pane.ax-scheduler-popover .ax-scheduler-highest-periority{color:rgba(var(--ax-comp-scheduler-highest-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-highest-periority-bg-color))}.ax-overlay-pane.ax-scheduler-popover .ax-scheduler-high-periority{color:rgba(var(--ax-comp-scheduler-high-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-high-periority-bg-color))}.ax-overlay-pane.ax-scheduler-popover .ax-scheduler-medium-periority{color:rgba(var(--ax-comp-scheduler-medium-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-medium-periority-bg-color))}.ax-overlay-pane.ax-scheduler-popover .ax-scheduler-low-periority{color:rgba(var(--ax-comp-scheduler-low-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-low-periority-bg-color))}.ax-overlay-pane.ax-scheduler-popover .ax-scheduler-lowest-periority{color:rgba(var(--ax-comp-scheduler-lowest-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-lowest-periority-bg-color))}\n"] }]
+                        AXSchedulerTimelineMultiDayViewComponent,
+                    ], 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 ax-text-xl\"\n            [ngClass]=\"{\n              'ax-icon-chevron-left': !rtl(),\n              'ax-icon-chevron-right': rtl(),\n            }\"\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 ax-text-xl\"\n            [ngClass]=\"{\n              'ax-icon-chevron-right': !rtl(),\n              'ax-icon-chevron-left': rtl(),\n            }\"\n          ></ax-icon>\n        </ax-button>\n        <ax-popover [target]=\"date\" #calendarPopover>\n          <div class=\"ax-overlay-pane\">\n            <ax-calendar\n              [type]=\"calendarType()\"\n              [depth]=\"calendarDepth()\"\n              [ngModel]=\"currentDate()\"\n              (onValueChanged)=\"calendarDateChanged($event)\"\n            ></ax-calendar>\n          </div>\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\n                class=\"fa-solid fa-expand\"\n                [ngClass]=\"{ 'fa-compress': isFullScreen(), 'fa-expand': !isFullScreen() }\"\n              ></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          [date]=\"currentDate()\"\n          [readonly]=\"readonly()\"\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          (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          [appointments]=\"viewAppointments()\"\n          [dragStartDelay]=\"dragStartDelay()\"\n          [tooltipTemplate]=\"tooltipTemplate()\"\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          (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          [showUnassignedAppointments]=\"showUnassignedAppointments()\"\n          [showResourceHeaders]=\"true\"\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          (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-multi-day') {\n        <ax-scheduler-timeline-multi-day-view\n          [date]=\"currentDate()\"\n          [readonly]=\"readonly()\"\n          [resources]=\"resources()\"\n          [showUnassignedAppointments]=\"showUnassignedAppointments()\"\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          (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-multi-day-view>\n      }\n      @case ('timeline-month') {\n        <ax-scheduler-timeline-month-view\n          [date]=\"currentDate()\"\n          [readonly]=\"readonly()\"\n          [resources]=\"resources()\"\n          [showUnassignedAppointments]=\"showUnassignedAppointments()\"\n          [showResourceHeaders]=\"true\"\n          [draggable]=\"draggable()\"\n          [calendar]=\"calendarType()\"\n          [hasActions]=\"hasActions()\"\n          [appointments]=\"viewAppointments()\"\n          [dragStartDelay]=\"dragStartDelay()\"\n          [tooltipTemplate]=\"tooltipTemplate()\"\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 ('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          (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", styles: [":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-surface);--ax-comp-scheduler-primary-text-color: var(--ax-sys-color-on-primary-surface);--ax-comp-scheduler-highest-periority-bg-color: var(--ax-sys-color-danger-dark-surface);--ax-comp-scheduler-highest-periority-text-color: var(--ax-sys-color-on-danger-dark-surface);--ax-comp-scheduler-high-periority-bg-color: var(--ax-sys-color-danger-surface);--ax-comp-scheduler-high-periority-text-color: var(--ax-sys-color-on-danger-surface);--ax-comp-scheduler-medium-periority-bg-color: var(--ax-sys-color-warning-surface);--ax-comp-scheduler-medium-periority-text-color: var(--ax-sys-color-on-warning-surface);--ax-comp-scheduler-low-periority-bg-color: var(--ax-sys-color-success-light-surface);--ax-comp-scheduler-low-periority-text-color: var(--ax-sys-color-on-success-light-surface);--ax-comp-scheduler-lowest-periority-bg-color: var(--ax-sys-color-success-lightest-surface);--ax-comp-scheduler-lowest-periority-text-color: var(--ax-sys-color-on-success-lightest-surface)}ax-scheduler{width:100%;height:100%;display:block;-webkit-user-select:none;user-select:none;font-size:.875rem;background-color:inherit}ax-scheduler.ax-full-screen-container{top:0;left:0;z-index:61;width:100vw;height:100vh;position:fixed}ax-scheduler .ax-scheduler-container{height:100%;display:flex;overflow:hidden;border-width:1px;flex-direction:column;background-color:inherit;border-radius:var(--ax-sys-border-radius)}ax-scheduler .ax-scheduler-container .ax-scheduler-header{display:flex;padding:1rem;overflow-x:auto;overflow-y:hidden;align-items:center;border-bottom-width:1px;justify-content:space-between}ax-scheduler .ax-scheduler-container .ax-scheduler-header .ax-scheduler-date{display:flex;min-width:20.5rem;align-items:center;justify-content:space-between}ax-scheduler .ax-scheduler-container .ax-scheduler-header .ax-scheduler-date p{margin:0;font-size:1rem;min-width:10rem;font-weight:500;text-align:center}ax-scheduler .ax-scheduler-container .ax-scheduler-actions{gap:.75rem;display:flex;align-items:center;justify-content:center}ax-scheduler .ax-scheduler-container .ax-scheduler-truncate{display:block;overflow:hidden;text-wrap:nowrap;text-overflow:ellipsis}ax-scheduler .ax-scheduler-container ax-subtitle{font-size:.75rem}ax-scheduler .ax-scheduler-container .ax-scheduler-views-container{height:100%;overflow:auto;background-color:inherit}ax-scheduler .ax-scheduler-primary-periority{color:rgba(var(--ax-comp-scheduler-primary-text-color));background-color:rgba(var(--ax-comp-scheduler-primary-bg-color))}ax-scheduler .ax-scheduler-highest-periority{color:rgba(var(--ax-comp-scheduler-highest-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-highest-periority-bg-color))}ax-scheduler .ax-scheduler-high-periority{color:rgba(var(--ax-comp-scheduler-high-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-high-periority-bg-color))}ax-scheduler .ax-scheduler-medium-periority{color:rgba(var(--ax-comp-scheduler-medium-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-medium-periority-bg-color))}ax-scheduler .ax-scheduler-low-periority{color:rgba(var(--ax-comp-scheduler-low-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-low-periority-bg-color))}ax-scheduler .ax-scheduler-lowest-periority{color:rgba(var(--ax-comp-scheduler-lowest-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-lowest-periority-bg-color))}.ax-overlay-pane.ax-scheduler-popover{gap:.25rem;display:grid;overflow:auto;padding:.25rem;max-height:10rem;font-size:.875rem;border-radius:.5rem}.ax-overlay-pane.ax-scheduler-popover.ax-scheduler-month-popover-appointment{font-size:.75rem}.ax-overlay-pane.ax-scheduler-popover:not(.ax-state-readonly) .ax-scheduler-popover-appointment{cursor:pointer}.ax-overlay-pane.ax-scheduler-popover .ax-scheduler-popover-appointment{display:flex;overflow:hidden;-webkit-user-select:none;user-select:none;flex-direction:column;padding-block:.25rem;padding-inline:.5rem;border-radius:calc(var(--ax-sys-border-radius) / 2);color:rgba(var(--ax-comp-scheduler-primary-text-color));background-color:rgba(var(--ax-comp-scheduler-primary-bg-color))}.ax-overlay-pane.ax-scheduler-popover .ax-scheduler-popover-appointment ax-subtitle{font-size:.75rem}.ax-overlay-pane.ax-scheduler-popover .ax-scheduler-popover-appointment .ax-scheduler-truncate{display:block;overflow:hidden;text-wrap:nowrap;text-overflow:ellipsis}.ax-overlay-pane.ax-scheduler-popover ax-title,.ax-overlay-pane.ax-scheduler-popover .ax-appointment-chip-title{display:flex;justify-content:space-between}.ax-overlay-pane.ax-scheduler-popover ax-title .ax-scheduler-action-icon,.ax-overlay-pane.ax-scheduler-popover .ax-appointment-chip-title .ax-scheduler-action-icon{width:auto;cursor:pointer}.ax-overlay-pane.ax-scheduler-popover .ax-scheduler-primary-periority{color:rgba(var(--ax-comp-scheduler-primary-text-color));background-color:rgba(var(--ax-comp-scheduler-primary-bg-color))}.ax-overlay-pane.ax-scheduler-popover .ax-scheduler-highest-periority{color:rgba(var(--ax-comp-scheduler-highest-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-highest-periority-bg-color))}.ax-overlay-pane.ax-scheduler-popover .ax-scheduler-high-periority{color:rgba(var(--ax-comp-scheduler-high-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-high-periority-bg-color))}.ax-overlay-pane.ax-scheduler-popover .ax-scheduler-medium-periority{color:rgba(var(--ax-comp-scheduler-medium-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-medium-periority-bg-color))}.ax-overlay-pane.ax-scheduler-popover .ax-scheduler-low-periority{color:rgba(var(--ax-comp-scheduler-low-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-low-periority-bg-color))}.ax-overlay-pane.ax-scheduler-popover .ax-scheduler-lowest-periority{color:rgba(var(--ax-comp-scheduler-lowest-periority-text-color));background-color:rgba(var(--ax-comp-scheduler-lowest-periority-bg-color))}\n"] }]
         }] });
 
 const COMPONENT = [