@acorex/components 19.13.0-next.9 → 19.13.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +12 -14
- package/calendar/lib/calendar-range.component.d.ts +2 -6
- package/fesm2022/acorex-components-action-sheet.mjs +10 -10
- package/fesm2022/acorex-components-alert.mjs +7 -7
- package/fesm2022/acorex-components-audio-wave.mjs +7 -7
- package/fesm2022/acorex-components-autocomplete.mjs +7 -7
- package/fesm2022/acorex-components-avatar.mjs +10 -10
- package/fesm2022/acorex-components-badge.mjs +7 -7
- package/fesm2022/acorex-components-bottom-navigation.mjs +10 -10
- package/fesm2022/acorex-components-breadcrumbs.mjs +10 -10
- package/fesm2022/acorex-components-button-group.mjs +10 -10
- package/fesm2022/acorex-components-button.mjs +15 -15
- package/fesm2022/acorex-components-button.mjs.map +1 -1
- package/fesm2022/acorex-components-calendar.mjs +35 -26
- package/fesm2022/acorex-components-calendar.mjs.map +1 -1
- package/fesm2022/acorex-components-check-box.mjs +7 -7
- package/fesm2022/acorex-components-chips.mjs +7 -7
- package/fesm2022/acorex-components-circular-progress.mjs +7 -7
- package/fesm2022/acorex-components-collapse.mjs +10 -10
- package/fesm2022/acorex-components-color-box.mjs +7 -7
- package/fesm2022/acorex-components-color-palette.mjs +25 -25
- package/fesm2022/acorex-components-comment.mjs +28 -28
- package/fesm2022/acorex-components-common.mjs +91 -91
- package/fesm2022/acorex-components-conversation.mjs +49 -49
- package/fesm2022/acorex-components-cron-job.mjs +46 -46
- package/fesm2022/acorex-components-data-pager.mjs +31 -31
- package/fesm2022/acorex-components-data-table.mjs +37 -37
- package/fesm2022/acorex-components-datetime-box.mjs +7 -7
- package/fesm2022/acorex-components-datetime-input.mjs +7 -7
- package/fesm2022/acorex-components-datetime-picker.mjs +7 -7
- package/fesm2022/acorex-components-decorators.mjs +27 -27
- package/fesm2022/acorex-components-decorators.mjs.map +1 -1
- package/fesm2022/acorex-components-dialog.mjs +10 -10
- package/fesm2022/acorex-components-drawer.mjs +13 -13
- package/fesm2022/acorex-components-dropdown-button.mjs +7 -7
- package/fesm2022/acorex-components-dropdown.mjs +13 -13
- package/fesm2022/acorex-components-file-explorer.mjs +25 -25
- package/fesm2022/acorex-components-flow-chart.mjs +669 -0
- package/fesm2022/acorex-components-flow-chart.mjs.map +1 -0
- package/fesm2022/acorex-components-form.mjs +24 -23
- package/fesm2022/acorex-components-form.mjs.map +1 -1
- package/fesm2022/acorex-components-grid-layout-builder.mjs +10 -10
- package/fesm2022/acorex-components-image-editor.mjs +34 -34
- package/fesm2022/acorex-components-image.mjs +7 -7
- package/fesm2022/acorex-components-json-viewer.mjs +7 -7
- package/fesm2022/acorex-components-kbd.mjs +10 -10
- package/fesm2022/acorex-components-label.mjs +7 -7
- package/fesm2022/acorex-components-list.mjs +7 -7
- package/fesm2022/acorex-components-loading-dialog.mjs +10 -10
- package/fesm2022/acorex-components-loading.mjs +16 -16
- package/fesm2022/acorex-components-map.mjs +10 -10
- package/fesm2022/acorex-components-media-viewer.mjs +34 -34
- package/fesm2022/acorex-components-menu.mjs +16 -16
- package/fesm2022/{acorex-components-modal-acorex-components-modal-CNCEtZYq.mjs → acorex-components-modal-acorex-components-modal-B4nBGqa3.mjs} +21 -21
- package/fesm2022/{acorex-components-modal-acorex-components-modal-CNCEtZYq.mjs.map → acorex-components-modal-acorex-components-modal-B4nBGqa3.mjs.map} +1 -1
- package/fesm2022/{acorex-components-modal-modal-content.component-Cs1IGBQX.mjs → acorex-components-modal-modal-content.component-oWerCvDI.mjs} +5 -5
- package/fesm2022/{acorex-components-modal-modal-content.component-Cs1IGBQX.mjs.map → acorex-components-modal-modal-content.component-oWerCvDI.mjs.map} +1 -1
- package/fesm2022/acorex-components-modal.mjs +1 -1
- package/fesm2022/acorex-components-navbar.mjs +7 -7
- package/fesm2022/acorex-components-notification.mjs +10 -10
- package/fesm2022/acorex-components-number-box.mjs +7 -7
- package/fesm2022/acorex-components-otp.mjs +7 -7
- package/fesm2022/acorex-components-page.mjs +10 -10
- package/fesm2022/acorex-components-paint.mjs +25 -25
- package/fesm2022/acorex-components-password-box.mjs +10 -10
- package/fesm2022/acorex-components-pdf-reader.mjs +7 -7
- package/fesm2022/acorex-components-phone-box.mjs +7 -7
- package/fesm2022/acorex-components-picker.mjs +13 -13
- package/fesm2022/acorex-components-popover.mjs +7 -7
- package/fesm2022/acorex-components-popup.mjs +11 -11
- package/fesm2022/acorex-components-popup.mjs.map +1 -1
- package/fesm2022/acorex-components-progress-bar.mjs +7 -7
- package/fesm2022/acorex-components-qrcode.mjs +7 -7
- package/fesm2022/acorex-components-query-builder.mjs +7 -7
- package/fesm2022/acorex-components-radio.mjs +7 -7
- package/fesm2022/acorex-components-rail-navigation.mjs +13 -13
- package/fesm2022/acorex-components-range-slider.mjs +7 -7
- package/fesm2022/acorex-components-rate-picker.mjs +7 -7
- package/fesm2022/acorex-components-rest-api-generator.mjs +22 -22
- package/fesm2022/acorex-components-result.mjs +7 -7
- package/fesm2022/acorex-components-routing-progress.mjs +7 -7
- package/fesm2022/acorex-components-scheduler.mjs +31 -31
- package/fesm2022/acorex-components-scss.mjs +4 -4
- package/fesm2022/acorex-components-search-box.mjs +7 -7
- package/fesm2022/acorex-components-select-box.mjs +7 -7
- package/fesm2022/acorex-components-selection-list.mjs +7 -7
- package/fesm2022/acorex-components-side-menu.mjs +13 -13
- package/fesm2022/acorex-components-skeleton.mjs +7 -7
- package/fesm2022/acorex-components-slider.mjs +7 -7
- package/fesm2022/acorex-components-sliding-item.mjs +13 -13
- package/fesm2022/acorex-components-step-wizard.mjs +13 -13
- package/fesm2022/acorex-components-switch.mjs +10 -10
- package/fesm2022/acorex-components-tabs.mjs +13 -13
- package/fesm2022/acorex-components-tag-box.mjs +7 -7
- package/fesm2022/acorex-components-tag.mjs +7 -7
- package/fesm2022/acorex-components-text-area.mjs +7 -7
- package/fesm2022/acorex-components-text-box.mjs +10 -10
- package/fesm2022/acorex-components-time-line.mjs +10 -10
- package/fesm2022/acorex-components-toast.mjs +10 -10
- package/fesm2022/acorex-components-toolbar.mjs +7 -7
- package/fesm2022/acorex-components-tooltip.mjs +10 -10
- package/fesm2022/acorex-components-tree-view.mjs +10 -10
- package/fesm2022/acorex-components-uploader.mjs +22 -22
- package/fesm2022/acorex-components-video-player.mjs +7 -7
- package/fesm2022/acorex-components-wysiwyg.mjs +31 -31
- package/flow-chart/README.md +3 -0
- package/flow-chart/index.d.ts +5 -0
- package/flow-chart/lib/flow-chart-creator/flow-chart-creator.component.d.ts +13 -0
- package/flow-chart/lib/flow-chart-renderer/flow-chart-renderer.component.d.ts +22 -0
- package/flow-chart/lib/flow-chart.component.d.ts +24 -0
- package/flow-chart/lib/flow-chart.module.d.ts +10 -0
- package/flow-chart/lib/flow-chart.service.d.ts +57 -0
- package/flow-chart/lib/flow-chart.type.d.ts +37 -0
- package/form/lib/form-field.component.d.ts +3 -2
- package/package.json +5 -1
@@ -357,10 +357,10 @@ class AXSchedulerService {
|
|
357
357
|
const width = `calc(${blockWidthExpr} * ${widthBlock})`;
|
358
358
|
return { left, width };
|
359
359
|
}
|
360
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
361
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.
|
360
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.9", ngImport: i0, type: AXSchedulerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
361
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.9", ngImport: i0, type: AXSchedulerService, providedIn: 'root' }); }
|
362
362
|
}
|
363
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
363
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.9", ngImport: i0, type: AXSchedulerService, decorators: [{
|
364
364
|
type: Injectable,
|
365
365
|
args: [{
|
366
366
|
providedIn: 'root', // Provide service application-wide
|
@@ -436,10 +436,10 @@ class AXSchedulerAgendaViewComponent extends MXBaseComponent {
|
|
436
436
|
get isReadonly() {
|
437
437
|
return this.readonly();
|
438
438
|
}
|
439
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
440
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.
|
439
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.9", ngImport: i0, type: AXSchedulerAgendaViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
440
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.9", type: AXSchedulerAgendaViewComponent, isStandalone: true, selector: "ax-scheduler-agenda-view", inputs: { daysCount: { classPropertyName: "daysCount", publicName: "daysCount", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, draggable: { classPropertyName: "draggable", publicName: "draggable", isSignal: true, isRequired: false, transformFunction: null }, calendar: { classPropertyName: "calendar", publicName: "calendar", isSignal: true, isRequired: false, transformFunction: null }, endHour: { classPropertyName: "endHour", publicName: "endHour", isSignal: true, isRequired: true, transformFunction: null }, date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: true, transformFunction: null }, startHour: { classPropertyName: "startHour", publicName: "startHour", isSignal: true, isRequired: true, transformFunction: null }, appointments: { classPropertyName: "appointments", publicName: "appointments", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { slotClickedInternal: "slotClickedInternal", slotDblClickedInternal: "slotDblClickedInternal", slotRightClickedInternal: "slotRightClickedInternal", appointmentClickedInternal: "appointmentClickedInternal", appointmentDblClickedInternal: "appointmentDblClickedInternal", appointmentRightClickedInternal: "appointmentRightClickedInternal" }, host: { properties: { "class.ax-state-readonly": "this.isReadonly" } }, usesInheritance: true, ngImport: i0, template: "<div class=\"ax-scheduler-agenda-container\">\n @for (appt of multiDayAppointments(); track appt.appointments) {\n <div\n [class.ax-today]=\"isToday(appt.date)\"\n class=\"ax-scheduler-agenda-view-container\"\n (click)=\"handleSlotEvent($event, appt.date)\"\n (dblclick)=\"handleSlotEvent($event, appt.date)\"\n (contextmenu)=\"handleSlotEvent($event, appt.date)\"\n >\n <div class=\"ax-scheduler-agenda-header-date-day\">\n <span class=\"ax-scheduler-agenda-header-date-day-char\">\n {{ appt.date | format: 'date' : { format: 'dddd', calendar: calendar() } | async }}\n </span>\n <span class=\"ax-scheduler-agenda-header-date-day-num\">\n {{ appt.date | format: 'date' : { format: 'DD', calendar: calendar() } | async }}\n </span>\n </div>\n <div class=\"ax-scheduler-agenda-appointment-container\">\n @for (appointment of appt.appointments; track appointment.key) {\n <div\n (click)=\"handleAppointmentEvent($event, appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, appointment)\"\n [title]=\"appointment.title\"\n [class.ax-draggable]=\"draggable()\"\n [style.color]=\"appointment.textColor\"\n class=\"ax-scheduler-agenda-appointment\"\n [style.background-color]=\"appointment.backgroundColor\"\n >\n <ax-title class=\"ax-scheduler-truncate\">{{ appointment.title }}</ax-title>\n <ax-subtitle>\n {{ appointment.startDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }} -\n {{ appointment.endDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}\n </ax-subtitle>\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-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-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-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-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-scheduler-agenda-header-date-day{width:5.5rem;gap:.25rem;display:flex;height:2.75rem;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{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{width:100%;display:flex;flex-direction:column;gap:.25rem}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-appointment-container .ax-scheduler-agenda-appointment{width:100%;display:flex;overflow:hidden;flex-direction:column;padding-block:.25rem;padding-inline:.5rem;color:rgba(var(--ax-sys-color-on-primary-surface));border-radius:calc(var(--ax-sys-border-radius) / 2);background-color:rgba(var(--ax-sys-color-primary-surface))}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: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXFormatPipe, name: "format" }, { 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" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
441
441
|
}
|
442
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
442
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.9", ngImport: i0, type: AXSchedulerAgendaViewComponent, decorators: [{
|
443
443
|
type: Component,
|
444
444
|
args: [{ selector: 'ax-scheduler-agenda-view', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [AsyncPipe, AXFormatPipe, AXDecoratorGenericComponent], template: "<div class=\"ax-scheduler-agenda-container\">\n @for (appt of multiDayAppointments(); track appt.appointments) {\n <div\n [class.ax-today]=\"isToday(appt.date)\"\n class=\"ax-scheduler-agenda-view-container\"\n (click)=\"handleSlotEvent($event, appt.date)\"\n (dblclick)=\"handleSlotEvent($event, appt.date)\"\n (contextmenu)=\"handleSlotEvent($event, appt.date)\"\n >\n <div class=\"ax-scheduler-agenda-header-date-day\">\n <span class=\"ax-scheduler-agenda-header-date-day-char\">\n {{ appt.date | format: 'date' : { format: 'dddd', calendar: calendar() } | async }}\n </span>\n <span class=\"ax-scheduler-agenda-header-date-day-num\">\n {{ appt.date | format: 'date' : { format: 'DD', calendar: calendar() } | async }}\n </span>\n </div>\n <div class=\"ax-scheduler-agenda-appointment-container\">\n @for (appointment of appt.appointments; track appointment.key) {\n <div\n (click)=\"handleAppointmentEvent($event, appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, appointment)\"\n [title]=\"appointment.title\"\n [class.ax-draggable]=\"draggable()\"\n [style.color]=\"appointment.textColor\"\n class=\"ax-scheduler-agenda-appointment\"\n [style.background-color]=\"appointment.backgroundColor\"\n >\n <ax-title class=\"ax-scheduler-truncate\">{{ appointment.title }}</ax-title>\n <ax-subtitle>\n {{ appointment.startDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }} -\n {{ appointment.endDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}\n </ax-subtitle>\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-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-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-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-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-scheduler-agenda-header-date-day{width:5.5rem;gap:.25rem;display:flex;height:2.75rem;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{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{width:100%;display:flex;flex-direction:column;gap:.25rem}ax-scheduler-agenda-view .ax-scheduler-agenda-container .ax-scheduler-agenda-appointment-container .ax-scheduler-agenda-appointment{width:100%;display:flex;overflow:hidden;flex-direction:column;padding-block:.25rem;padding-inline:.5rem;color:rgba(var(--ax-sys-color-on-primary-surface));border-radius:calc(var(--ax-sys-border-radius) / 2);background-color:rgba(var(--ax-sys-color-primary-surface))}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"] }]
|
445
445
|
}], propDecorators: { isReadonly: [{
|
@@ -637,10 +637,10 @@ class AXSchedulerDayViewComponent extends MXBaseComponent {
|
|
637
637
|
get isReadonly() {
|
638
638
|
return this.readonly();
|
639
639
|
}
|
640
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
641
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.8", 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 }, calendar: { classPropertyName: "calendar", publicName: "calendar", isSignal: true, isRequired: false, transformFunction: null }, endHour: { classPropertyName: "endHour", publicName: "endHour", isSignal: true, isRequired: true, transformFunction: null }, date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: true, transformFunction: null }, startHour: { classPropertyName: "startHour", publicName: "startHour", isSignal: true, isRequired: true, transformFunction: null }, appointments: { classPropertyName: "appointments", publicName: "appointments", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { slotClickedInternal: "slotClickedInternal", slotDblClickedInternal: "slotDblClickedInternal", slotRightClickedInternal: "slotRightClickedInternal", appointmentClickedInternal: "appointmentClickedInternal", appointmentDblClickedInternal: "appointmentDblClickedInternal", appointmentRightClickedInternal: "appointmentRightClickedInternal" }, host: { properties: { "class.ax-state-readonly": "this.isReadonly" } }, 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 {{ 'dateTime.duration.all-day' | translate | async }}\n </div>\n </div>\n <div\n class=\"ax-scheduler-day-header-table-container\"\n (click)=\"handleAllDaySlotEvent($event)\"\n (dblclick)=\"handleAllDaySlotEvent($event)\"\n (contextmenu)=\"handleAllDaySlotEvent($event)\"\n >\n <div class=\"ax-scheduler-day-header-appointment-container\">\n @if (allDayAppointments().length) {\n <div\n (click)=\"handleAppointmentEvent($event, allDayAppointments()[0])\"\n (dblclick)=\"handleAppointmentEvent($event, allDayAppointments()[0])\"\n (contextmenu)=\"handleAppointmentEvent($event, allDayAppointments()[0])\"\n [class.ax-draggable]=\"draggable()\"\n [title]=\"allDayAppointments()[0].title\"\n class=\"ax-scheduler-header-day-appointment\"\n [style.color]=\"allDayAppointments()[0].textColor\"\n [style.background-color]=\"allDayAppointments()[0].backgroundColor\"\n >\n <ax-title class=\"ax-scheduler-truncate\">{{ allDayAppointments()[0].title }}</ax-title>\n </div>\n }\n @if (allDayAppointments().length > 1) {\n <div\n #moreAppointments\n class=\"ax-scheduler-day-header-more-tag\"\n [style.color]=\"allDayAppointments()[1].textColor\"\n [style.background-color]=\"allDayAppointments()[1].backgroundColor\"\n >\n {{ 'more-items' | translate: { params: { number: allDayAppointments().length - 1 } } | async }}\n </div>\n <ax-popover [target]=\"moreAppointments\" [placement]=\"'bottom'\">\n <div class=\"ax-overlay-pane ax-scheduler-popover\" [class.ax-state-readonly]=\"readonly()\">\n @for (appointment of allDayAppointments(); track appointment.key; let first = $first) {\n @if (!first) {\n <div\n (click)=\"handleAppointmentEvent($event, appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, appointment)\"\n [title]=\"appointment.title\"\n [class.ax-draggable]=\"draggable()\"\n class=\"ax-scheduler-popover-appointment\"\n [style.color]=\"appointment.textColor\"\n [style.background-color]=\"appointment.backgroundColor\"\n >\n <ax-title class=\"ax-scheduler-truncate\">{{ appointment.title }}</ax-title>\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.key) {\n <div\n (click)=\"handleAppointmentEvent($event, appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, appointment)\"\n [title]=\"appointment.title\"\n [class.ax-draggable]=\"draggable()\"\n class=\"ax-scheduler-day-appointment\"\n [style.color]=\"appointment.textColor\"\n [style.width]=\"getAppointmentWidth(appointment.key)\"\n [style.height]=\"getAppointmentHeight(appointment.key)\"\n [style.background-color]=\"appointment.backgroundColor\"\n [style.inset-block-start]=\"getAppointmentTop(appointment.key)\"\n [style.inset-inline-start]=\"getAppointmentLeft(appointment.key)\"\n >\n <ax-title class=\"ax-scheduler-truncate\">{{ appointment.title }}</ax-title>\n <ax-subtitle>\n {{ appointment.startDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }} -\n {{ appointment.endDate | format: 'time' : { format: 'HH:mm', 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 (click)=\"handleSingleSlotEvent($event, time, 0)\"\n (dblclick)=\"handleSingleSlotEvent($event, time, 0)\"\n (contextmenu)=\"handleSingleSlotEvent($event, time, 0)\"\n ></div>\n <div\n (click)=\"handleSingleSlotEvent($event, time, 1)\"\n (dblclick)=\"handleSingleSlotEvent($event, time, 1)\"\n (contextmenu)=\"handleSingleSlotEvent($event, time, 1)\"\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: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-day-view .ax-scheduler-day-header .ax-scheduler-day-header-table{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: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-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%;overflow:hidden;padding-inline:.5rem;color:rgba(var(--ax-sys-color-on-primary-surface));border-radius:calc(var(--ax-sys-border-radius) / 2);background-color:rgba(var(--ax-sys-color-primary-surface))}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{cursor:pointer;text-wrap:nowrap;padding-inline:.5rem;border-radius:var(--ax-sys-border-radius);color:rgba(var(--ax-sys-color-on-primary-surface));background-color:rgba(var(--ax-sys-color-primary-surface))}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:1;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;color:rgba(var(--ax-sys-color-on-primary-surface));border-radius:calc(var(--ax-sys-border-radius) / 2);background-color:rgba(var(--ax-sys-color-primary-surface))}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))}\n"], dependencies: [{ 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: AXTranslatorPipe, name: "translate" }, { kind: "component", type: AXPopoverComponent, selector: "ax-popover", inputs: ["offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "pipe", type: AXFormatPipe, name: "format" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
640
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.9", ngImport: i0, type: AXSchedulerDayViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
641
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.9", 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 }, calendar: { classPropertyName: "calendar", publicName: "calendar", isSignal: true, isRequired: false, transformFunction: null }, endHour: { classPropertyName: "endHour", publicName: "endHour", isSignal: true, isRequired: true, transformFunction: null }, date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: true, transformFunction: null }, startHour: { classPropertyName: "startHour", publicName: "startHour", isSignal: true, isRequired: true, transformFunction: null }, appointments: { classPropertyName: "appointments", publicName: "appointments", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { slotClickedInternal: "slotClickedInternal", slotDblClickedInternal: "slotDblClickedInternal", slotRightClickedInternal: "slotRightClickedInternal", appointmentClickedInternal: "appointmentClickedInternal", appointmentDblClickedInternal: "appointmentDblClickedInternal", appointmentRightClickedInternal: "appointmentRightClickedInternal" }, host: { properties: { "class.ax-state-readonly": "this.isReadonly" } }, 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 {{ 'dateTime.duration.all-day' | translate | async }}\n </div>\n </div>\n <div\n class=\"ax-scheduler-day-header-table-container\"\n (click)=\"handleAllDaySlotEvent($event)\"\n (dblclick)=\"handleAllDaySlotEvent($event)\"\n (contextmenu)=\"handleAllDaySlotEvent($event)\"\n >\n <div class=\"ax-scheduler-day-header-appointment-container\">\n @if (allDayAppointments().length) {\n <div\n (click)=\"handleAppointmentEvent($event, allDayAppointments()[0])\"\n (dblclick)=\"handleAppointmentEvent($event, allDayAppointments()[0])\"\n (contextmenu)=\"handleAppointmentEvent($event, allDayAppointments()[0])\"\n [class.ax-draggable]=\"draggable()\"\n [title]=\"allDayAppointments()[0].title\"\n class=\"ax-scheduler-header-day-appointment\"\n [style.color]=\"allDayAppointments()[0].textColor\"\n [style.background-color]=\"allDayAppointments()[0].backgroundColor\"\n >\n <ax-title class=\"ax-scheduler-truncate\">{{ allDayAppointments()[0].title }}</ax-title>\n </div>\n }\n @if (allDayAppointments().length > 1) {\n <div\n #moreAppointments\n class=\"ax-scheduler-day-header-more-tag\"\n [style.color]=\"allDayAppointments()[1].textColor\"\n [style.background-color]=\"allDayAppointments()[1].backgroundColor\"\n >\n {{ 'more-items' | translate: { params: { number: allDayAppointments().length - 1 } } | async }}\n </div>\n <ax-popover [target]=\"moreAppointments\" [placement]=\"'bottom'\">\n <div class=\"ax-overlay-pane ax-scheduler-popover\" [class.ax-state-readonly]=\"readonly()\">\n @for (appointment of allDayAppointments(); track appointment.key; let first = $first) {\n @if (!first) {\n <div\n (click)=\"handleAppointmentEvent($event, appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, appointment)\"\n [title]=\"appointment.title\"\n [class.ax-draggable]=\"draggable()\"\n class=\"ax-scheduler-popover-appointment\"\n [style.color]=\"appointment.textColor\"\n [style.background-color]=\"appointment.backgroundColor\"\n >\n <ax-title class=\"ax-scheduler-truncate\">{{ appointment.title }}</ax-title>\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.key) {\n <div\n (click)=\"handleAppointmentEvent($event, appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, appointment)\"\n [title]=\"appointment.title\"\n [class.ax-draggable]=\"draggable()\"\n class=\"ax-scheduler-day-appointment\"\n [style.color]=\"appointment.textColor\"\n [style.width]=\"getAppointmentWidth(appointment.key)\"\n [style.height]=\"getAppointmentHeight(appointment.key)\"\n [style.background-color]=\"appointment.backgroundColor\"\n [style.inset-block-start]=\"getAppointmentTop(appointment.key)\"\n [style.inset-inline-start]=\"getAppointmentLeft(appointment.key)\"\n >\n <ax-title class=\"ax-scheduler-truncate\">{{ appointment.title }}</ax-title>\n <ax-subtitle>\n {{ appointment.startDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }} -\n {{ appointment.endDate | format: 'time' : { format: 'HH:mm', 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 (click)=\"handleSingleSlotEvent($event, time, 0)\"\n (dblclick)=\"handleSingleSlotEvent($event, time, 0)\"\n (contextmenu)=\"handleSingleSlotEvent($event, time, 0)\"\n ></div>\n <div\n (click)=\"handleSingleSlotEvent($event, time, 1)\"\n (dblclick)=\"handleSingleSlotEvent($event, time, 1)\"\n (contextmenu)=\"handleSingleSlotEvent($event, time, 1)\"\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: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-day-view .ax-scheduler-day-header .ax-scheduler-day-header-table{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: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-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%;overflow:hidden;padding-inline:.5rem;color:rgba(var(--ax-sys-color-on-primary-surface));border-radius:calc(var(--ax-sys-border-radius) / 2);background-color:rgba(var(--ax-sys-color-primary-surface))}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{cursor:pointer;text-wrap:nowrap;padding-inline:.5rem;border-radius:var(--ax-sys-border-radius);color:rgba(var(--ax-sys-color-on-primary-surface));background-color:rgba(var(--ax-sys-color-primary-surface))}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:1;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;color:rgba(var(--ax-sys-color-on-primary-surface));border-radius:calc(var(--ax-sys-border-radius) / 2);background-color:rgba(var(--ax-sys-color-primary-surface))}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))}\n"], dependencies: [{ 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: AXTranslatorPipe, name: "translate" }, { kind: "component", type: AXPopoverComponent, selector: "ax-popover", inputs: ["offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "pipe", type: AXFormatPipe, name: "format" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
642
642
|
}
|
643
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
643
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.9", ngImport: i0, type: AXSchedulerDayViewComponent, decorators: [{
|
644
644
|
type: Component,
|
645
645
|
args: [{ selector: 'ax-scheduler-day-view', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [AXDecoratorGenericComponent, AsyncPipe, AXTranslatorPipe, AXPopoverComponent, AXFormatPipe], template: "<div class=\"ax-scheduler-day-header\">\n <div class=\"ax-scheduler-day-header-table\" aria-hidden=\"true\">\n <div>\n {{ 'dateTime.duration.all-day' | translate | async }}\n </div>\n </div>\n <div\n class=\"ax-scheduler-day-header-table-container\"\n (click)=\"handleAllDaySlotEvent($event)\"\n (dblclick)=\"handleAllDaySlotEvent($event)\"\n (contextmenu)=\"handleAllDaySlotEvent($event)\"\n >\n <div class=\"ax-scheduler-day-header-appointment-container\">\n @if (allDayAppointments().length) {\n <div\n (click)=\"handleAppointmentEvent($event, allDayAppointments()[0])\"\n (dblclick)=\"handleAppointmentEvent($event, allDayAppointments()[0])\"\n (contextmenu)=\"handleAppointmentEvent($event, allDayAppointments()[0])\"\n [class.ax-draggable]=\"draggable()\"\n [title]=\"allDayAppointments()[0].title\"\n class=\"ax-scheduler-header-day-appointment\"\n [style.color]=\"allDayAppointments()[0].textColor\"\n [style.background-color]=\"allDayAppointments()[0].backgroundColor\"\n >\n <ax-title class=\"ax-scheduler-truncate\">{{ allDayAppointments()[0].title }}</ax-title>\n </div>\n }\n @if (allDayAppointments().length > 1) {\n <div\n #moreAppointments\n class=\"ax-scheduler-day-header-more-tag\"\n [style.color]=\"allDayAppointments()[1].textColor\"\n [style.background-color]=\"allDayAppointments()[1].backgroundColor\"\n >\n {{ 'more-items' | translate: { params: { number: allDayAppointments().length - 1 } } | async }}\n </div>\n <ax-popover [target]=\"moreAppointments\" [placement]=\"'bottom'\">\n <div class=\"ax-overlay-pane ax-scheduler-popover\" [class.ax-state-readonly]=\"readonly()\">\n @for (appointment of allDayAppointments(); track appointment.key; let first = $first) {\n @if (!first) {\n <div\n (click)=\"handleAppointmentEvent($event, appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, appointment)\"\n [title]=\"appointment.title\"\n [class.ax-draggable]=\"draggable()\"\n class=\"ax-scheduler-popover-appointment\"\n [style.color]=\"appointment.textColor\"\n [style.background-color]=\"appointment.backgroundColor\"\n >\n <ax-title class=\"ax-scheduler-truncate\">{{ appointment.title }}</ax-title>\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.key) {\n <div\n (click)=\"handleAppointmentEvent($event, appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, appointment)\"\n [title]=\"appointment.title\"\n [class.ax-draggable]=\"draggable()\"\n class=\"ax-scheduler-day-appointment\"\n [style.color]=\"appointment.textColor\"\n [style.width]=\"getAppointmentWidth(appointment.key)\"\n [style.height]=\"getAppointmentHeight(appointment.key)\"\n [style.background-color]=\"appointment.backgroundColor\"\n [style.inset-block-start]=\"getAppointmentTop(appointment.key)\"\n [style.inset-inline-start]=\"getAppointmentLeft(appointment.key)\"\n >\n <ax-title class=\"ax-scheduler-truncate\">{{ appointment.title }}</ax-title>\n <ax-subtitle>\n {{ appointment.startDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }} -\n {{ appointment.endDate | format: 'time' : { format: 'HH:mm', 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 (click)=\"handleSingleSlotEvent($event, time, 0)\"\n (dblclick)=\"handleSingleSlotEvent($event, time, 0)\"\n (contextmenu)=\"handleSingleSlotEvent($event, time, 0)\"\n ></div>\n <div\n (click)=\"handleSingleSlotEvent($event, time, 1)\"\n (dblclick)=\"handleSingleSlotEvent($event, time, 1)\"\n (contextmenu)=\"handleSingleSlotEvent($event, time, 1)\"\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: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-day-view .ax-scheduler-day-header .ax-scheduler-day-header-table{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: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-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%;overflow:hidden;padding-inline:.5rem;color:rgba(var(--ax-sys-color-on-primary-surface));border-radius:calc(var(--ax-sys-border-radius) / 2);background-color:rgba(var(--ax-sys-color-primary-surface))}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{cursor:pointer;text-wrap:nowrap;padding-inline:.5rem;border-radius:var(--ax-sys-border-radius);color:rgba(var(--ax-sys-color-on-primary-surface));background-color:rgba(var(--ax-sys-color-primary-surface))}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:1;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;color:rgba(var(--ax-sys-color-on-primary-surface));border-radius:calc(var(--ax-sys-border-radius) / 2);background-color:rgba(var(--ax-sys-color-primary-surface))}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))}\n"] }]
|
646
646
|
}], propDecorators: { isReadonly: [{
|
@@ -803,10 +803,10 @@ class AXSchedulerMonthViewComponent extends MXBaseComponent {
|
|
803
803
|
get isReadonly() {
|
804
804
|
return this.readonly();
|
805
805
|
}
|
806
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
807
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.
|
806
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.9", ngImport: i0, type: AXSchedulerMonthViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
807
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.9", type: AXSchedulerMonthViewComponent, isStandalone: true, selector: "ax-scheduler-month-view", inputs: { readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, draggable: { classPropertyName: "draggable", publicName: "draggable", isSignal: true, isRequired: false, transformFunction: null }, 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 } }, outputs: { slotClickedInternal: "slotClickedInternal", slotDblClickedInternal: "slotDblClickedInternal", slotRightClickedInternal: "slotRightClickedInternal", appointmentClickedInternal: "appointmentClickedInternal", appointmentDblClickedInternal: "appointmentDblClickedInternal", appointmentRightClickedInternal: "appointmentRightClickedInternal" }, host: { properties: { "class.ax-state-readonly": "this.isReadonly" } }, usesInheritance: true, ngImport: i0, template: "<div class=\"ax-scheduler-month-container\">\n <!-- Weekday Header -->\n <div class=\"ax-scheduler-month-weekdays\">\n <!-- Use daysArray for header, assuming it provides correct names/order -->\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 - Add dynamic style -->\n <div class=\"ax-scheduler-month-grid\" [style.gridTemplateRows]=\"gridTemplateRowsStyle()\">\n <!-- Iterate over the final layout data -->\n @for (dayCell of dayCellLayouts(); track dayCell.date.date.getTime()) {\n <div\n (click)=\"handleSlotEvent($event, dayCell.date)\"\n (dblclick)=\"handleSlotEvent($event, dayCell.date)\"\n (contextmenu)=\"handleSlotEvent($event, dayCell.date)\"\n [class.ax-today]=\"dayCell.isToday\"\n class=\"ax-scheduler-month-day-cell\"\n [class.ax-other-month]=\"!dayCell.isCurrentMonth\"\n >\n <div class=\"ax-scheduler-month-day-header\">\n <span class=\"ax-scheduler-month-day-number\">{{ dayCell.date.dayOfMonth }}</span>\n </div>\n <div class=\"ax-scheduler-month-day-appointments\">\n <!-- Visible Appointment Chips -->\n @for (appointment of dayCell.visibleAppointments; track appointment.key) {\n <div\n (click)=\"handleAppointmentEvent($event, appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, appointment)\"\n [title]=\"appointment.title\"\n [class.ax-draggable]=\"draggable()\"\n [style.color]=\"appointment.textColor\"\n class=\"ax-scheduler-month-appointment-chip\"\n [style.background-color]=\"appointment.backgroundColor\"\n >\n <!-- Optionally show time for non-all-day appointments -->\n <!-- @if (!appointment.allDay) {\n <span class=\"ax-appointment-chip-time\">\n {{ appointment.startDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}\n </span>\n } -->\n <span class=\"ax-appointment-chip-title ax-scheduler-truncate\">{{ appointment.title }}</span>\n </div>\n }\n @if (dayCell.overflowCount > 0) {\n <div #moreAppointments class=\"ax-scheduler-month-overflow-badge\">\n +{{ 'more-items' | translate: { params: { number: dayCell.overflowCount } } | async }}\n </div>\n <ax-popover [target]=\"moreAppointments\" [placement]=\"'bottom'\">\n <div\n [class.ax-state-readonly]=\"readonly()\"\n class=\"ax-overlay-pane ax-scheduler-popover ax-scheduler-month-popover-appointment\"\n >\n @for (appointment of dayCell.hiddenAppointments; track appointment.key) {\n <div\n (click)=\"handleAppointmentEvent($event, appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, appointment)\"\n [title]=\"appointment.title\"\n [class.ax-draggable]=\"draggable()\"\n class=\"ax-scheduler-popover-appointment\"\n [style.color]=\"appointment.textColor\"\n [style.background-color]=\"appointment.backgroundColor\"\n >\n <span class=\"ax-appointment-chip-title ax-scheduler-truncate\">{{ appointment.title }}</span>\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:1;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-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-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-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{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;color:rgba(var(--ax-sys-color-on-primary-surface));background-color:rgba(var(--ax-sys-color-primary-surface))}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell .ax-scheduler-month-day-appointments .ax-scheduler-month-appointment-chip.ax-draggable{cursor:grab}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;color:rgba(var(--ax-sys-color-primary-text))}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))}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }, { kind: "component", type: AXPopoverComponent, selector: "ax-popover", inputs: ["offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "pipe", type: AXFormatPipe, name: "format" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
808
808
|
}
|
809
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
809
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.9", ngImport: i0, type: AXSchedulerMonthViewComponent, decorators: [{
|
810
810
|
type: Component,
|
811
811
|
args: [{ selector: 'ax-scheduler-month-view', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [AsyncPipe, AXTranslatorPipe, AXPopoverComponent, AXFormatPipe, AsyncPipe], template: "<div class=\"ax-scheduler-month-container\">\n <!-- Weekday Header -->\n <div class=\"ax-scheduler-month-weekdays\">\n <!-- Use daysArray for header, assuming it provides correct names/order -->\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 - Add dynamic style -->\n <div class=\"ax-scheduler-month-grid\" [style.gridTemplateRows]=\"gridTemplateRowsStyle()\">\n <!-- Iterate over the final layout data -->\n @for (dayCell of dayCellLayouts(); track dayCell.date.date.getTime()) {\n <div\n (click)=\"handleSlotEvent($event, dayCell.date)\"\n (dblclick)=\"handleSlotEvent($event, dayCell.date)\"\n (contextmenu)=\"handleSlotEvent($event, dayCell.date)\"\n [class.ax-today]=\"dayCell.isToday\"\n class=\"ax-scheduler-month-day-cell\"\n [class.ax-other-month]=\"!dayCell.isCurrentMonth\"\n >\n <div class=\"ax-scheduler-month-day-header\">\n <span class=\"ax-scheduler-month-day-number\">{{ dayCell.date.dayOfMonth }}</span>\n </div>\n <div class=\"ax-scheduler-month-day-appointments\">\n <!-- Visible Appointment Chips -->\n @for (appointment of dayCell.visibleAppointments; track appointment.key) {\n <div\n (click)=\"handleAppointmentEvent($event, appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, appointment)\"\n [title]=\"appointment.title\"\n [class.ax-draggable]=\"draggable()\"\n [style.color]=\"appointment.textColor\"\n class=\"ax-scheduler-month-appointment-chip\"\n [style.background-color]=\"appointment.backgroundColor\"\n >\n <!-- Optionally show time for non-all-day appointments -->\n <!-- @if (!appointment.allDay) {\n <span class=\"ax-appointment-chip-time\">\n {{ appointment.startDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}\n </span>\n } -->\n <span class=\"ax-appointment-chip-title ax-scheduler-truncate\">{{ appointment.title }}</span>\n </div>\n }\n @if (dayCell.overflowCount > 0) {\n <div #moreAppointments class=\"ax-scheduler-month-overflow-badge\">\n +{{ 'more-items' | translate: { params: { number: dayCell.overflowCount } } | async }}\n </div>\n <ax-popover [target]=\"moreAppointments\" [placement]=\"'bottom'\">\n <div\n [class.ax-state-readonly]=\"readonly()\"\n class=\"ax-overlay-pane ax-scheduler-popover ax-scheduler-month-popover-appointment\"\n >\n @for (appointment of dayCell.hiddenAppointments; track appointment.key) {\n <div\n (click)=\"handleAppointmentEvent($event, appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, appointment)\"\n [title]=\"appointment.title\"\n [class.ax-draggable]=\"draggable()\"\n class=\"ax-scheduler-popover-appointment\"\n [style.color]=\"appointment.textColor\"\n [style.background-color]=\"appointment.backgroundColor\"\n >\n <span class=\"ax-appointment-chip-title ax-scheduler-truncate\">{{ appointment.title }}</span>\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:1;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-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-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-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{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;color:rgba(var(--ax-sys-color-on-primary-surface));background-color:rgba(var(--ax-sys-color-primary-surface))}ax-scheduler-month-view .ax-scheduler-month-grid .ax-scheduler-month-day-cell .ax-scheduler-month-day-appointments .ax-scheduler-month-appointment-chip.ax-draggable{cursor:grab}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;color:rgba(var(--ax-sys-color-primary-text))}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))}\n"] }]
|
812
812
|
}], propDecorators: { isReadonly: [{
|
@@ -936,10 +936,10 @@ class AXSchedulerTimelineDayViewComponent extends MXBaseComponent {
|
|
936
936
|
get isReadonly() {
|
937
937
|
return this.readonly();
|
938
938
|
}
|
939
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
940
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.
|
939
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.9", ngImport: i0, type: AXSchedulerTimelineDayViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
940
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.9", type: AXSchedulerTimelineDayViewComponent, isStandalone: true, selector: "ax-scheduler-timeline-day-view", inputs: { readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, draggable: { classPropertyName: "draggable", publicName: "draggable", isSignal: true, isRequired: false, transformFunction: null }, calendar: { classPropertyName: "calendar", publicName: "calendar", isSignal: true, isRequired: false, transformFunction: null }, endHour: { classPropertyName: "endHour", publicName: "endHour", isSignal: true, isRequired: true, transformFunction: null }, date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: true, transformFunction: null }, startHour: { classPropertyName: "startHour", publicName: "startHour", isSignal: true, isRequired: true, transformFunction: null }, appointments: { classPropertyName: "appointments", publicName: "appointments", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { slotClickedInternal: "slotClickedInternal", slotDblClickedInternal: "slotDblClickedInternal", slotRightClickedInternal: "slotRightClickedInternal", appointmentClickedInternal: "appointmentClickedInternal", appointmentDblClickedInternal: "appointmentDblClickedInternal", appointmentRightClickedInternal: "appointmentRightClickedInternal" }, host: { properties: { "class.ax-state-readonly": "this.isReadonly" } }, 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.key) {\n <div\n (click)=\"handleAppointmentEvent($event, layout.appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, layout.appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, layout.appointment)\"\n [title]=\"layout.appointment.title\"\n [class.ax-draggable]=\"draggable()\"\n [style.width]=\"layout.layoutWidth\"\n [style.height]=\"layout.layoutHeight\"\n class=\"ax-scheduler-timeline-appointment\"\n [style.insetBlockStart]=\"layout.layoutTop\"\n [style.color]=\"layout.appointment.textColor\"\n [style.insetInlineStart]=\"layout.layoutLeft\"\n [style.background-color]=\"layout.appointment.backgroundColor\"\n >\n <ax-title class=\"ax-scheduler-truncate\">{{ layout.appointment.title }}</ax-title>\n <ax-subtitle>\n {{ layout.appointment.startDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }} -\n {{ layout.appointment.endDate | 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 class=\"ax-scheduler-timeline-slot-cell\"\n (click)=\"handleSlotEvent($event, time)\"\n (dblclick)=\"handleSlotEvent($event, time)\"\n (contextmenu)=\"handleSlotEvent($event, time)\"\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;color:rgba(var(--ax-sys-color-on-primary-surface));border-radius:calc(var(--ax-sys-border-radius) / 2);background-color:rgba(var(--ax-sys-color-primary-surface))}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))}\n"], dependencies: [{ 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: AXFormatPipe, name: "format" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
941
941
|
}
|
942
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
942
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.9", ngImport: i0, type: AXSchedulerTimelineDayViewComponent, decorators: [{
|
943
943
|
type: Component,
|
944
944
|
args: [{ selector: 'ax-scheduler-timeline-day-view', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [AXDecoratorGenericComponent, AXFormatPipe, AsyncPipe], 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.key) {\n <div\n (click)=\"handleAppointmentEvent($event, layout.appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, layout.appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, layout.appointment)\"\n [title]=\"layout.appointment.title\"\n [class.ax-draggable]=\"draggable()\"\n [style.width]=\"layout.layoutWidth\"\n [style.height]=\"layout.layoutHeight\"\n class=\"ax-scheduler-timeline-appointment\"\n [style.insetBlockStart]=\"layout.layoutTop\"\n [style.color]=\"layout.appointment.textColor\"\n [style.insetInlineStart]=\"layout.layoutLeft\"\n [style.background-color]=\"layout.appointment.backgroundColor\"\n >\n <ax-title class=\"ax-scheduler-truncate\">{{ layout.appointment.title }}</ax-title>\n <ax-subtitle>\n {{ layout.appointment.startDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }} -\n {{ layout.appointment.endDate | 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 class=\"ax-scheduler-timeline-slot-cell\"\n (click)=\"handleSlotEvent($event, time)\"\n (dblclick)=\"handleSlotEvent($event, time)\"\n (contextmenu)=\"handleSlotEvent($event, time)\"\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;color:rgba(var(--ax-sys-color-on-primary-surface));border-radius:calc(var(--ax-sys-border-radius) / 2);background-color:rgba(var(--ax-sys-color-primary-surface))}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))}\n"] }]
|
945
945
|
}], propDecorators: { isReadonly: [{
|
@@ -1022,10 +1022,10 @@ class AXSchedulerTimelineMonthViewComponent extends MXBaseComponent {
|
|
1022
1022
|
get isReadonly() {
|
1023
1023
|
return this.readonly();
|
1024
1024
|
}
|
1025
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
1026
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.8", type: AXSchedulerTimelineMonthViewComponent, isStandalone: true, selector: "ax-scheduler-timeline-month-view", inputs: { readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, draggable: { classPropertyName: "draggable", publicName: "draggable", isSignal: true, isRequired: false, transformFunction: null }, calendar: { classPropertyName: "calendar", publicName: "calendar", isSignal: true, isRequired: false, transformFunction: null }, endHour: { classPropertyName: "endHour", publicName: "endHour", isSignal: true, isRequired: true, transformFunction: null }, date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: true, transformFunction: null }, startHour: { classPropertyName: "startHour", publicName: "startHour", isSignal: true, isRequired: true, transformFunction: null }, appointments: { classPropertyName: "appointments", publicName: "appointments", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { slotClickedInternal: "slotClickedInternal", slotDblClickedInternal: "slotDblClickedInternal", slotRightClickedInternal: "slotRightClickedInternal", appointmentClickedInternal: "appointmentClickedInternal", appointmentDblClickedInternal: "appointmentDblClickedInternal", appointmentRightClickedInternal: "appointmentRightClickedInternal" }, host: { properties: { "class.ax-state-readonly": "this.isReadonly" } }, usesInheritance: true, ngImport: i0, template: "<div class=\"ax-scheduler-timeline-month-container\">\n @for (appt of monthAppointments(); track appt.visibleAppointments) {\n <div>\n <div class=\"ax-scheduler-timeline-header\">\n <div class=\"ax-scheduler-month-header-date-day\" [class.ax-today]=\"isToday(appt.date)\">\n <span class=\"ax-scheduler-month-header-date-day-char\">\n {{ appt.date | format: 'date' : { format: 'dddd', calendar: calendar() } | async }}\n </span>\n <span class=\"ax-scheduler-month-header-date-day-num\">\n {{ appt.date | format: 'date' : { format: 'DD', calendar: calendar() } | async }}\n </span>\n </div>\n </div>\n\n <div\n class=\"ax-scheduler-timeline-content\"\n (click)=\"handleSlotEvent($event, appt.date)\"\n (dblclick)=\"handleSlotEvent($event, appt.date)\"\n (contextmenu)=\"handleSlotEvent($event, appt.date)\"\n >\n <div class=\"ax-scheduler-timeline-appointment-container\">\n @for (appointment of appt.visibleAppointments; track appointment.key) {\n <div\n (click)=\"handleAppointmentEvent($event, appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, appointment)\"\n [title]=\"appointment.title\"\n [class.ax-draggable]=\"draggable()\"\n [style.color]=\"appointment.textColor\"\n class=\"ax-scheduler-timeline-appointment\"\n [style.background-color]=\"appointment.backgroundColor\"\n >\n <ax-title class=\"ax-scheduler-truncate\">{{ appointment.title }}</ax-title>\n <ax-subtitle>\n {{ appointment.startDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }} -\n {{ appointment.endDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}\n </ax-subtitle>\n </div>\n }\n @if (appt.moreCount > 0) {\n <div #moreAppointments class=\"ax-scheduler-month-overflow-badge\">\n +{{ 'more-items' | translate: { params: { number: appt.moreCount } } | async }}\n </div>\n <ax-popover [target]=\"moreAppointments\" [placement]=\"'bottom'\">\n <div\n [class.ax-state-readonly]=\"readonly()\"\n class=\"ax-overlay-pane ax-scheduler-popover ax-scheduler-month-popover-appointment\"\n >\n @for (appointment of appt.hiddenAppointments; track appointment.key) {\n <div\n (click)=\"handleAppointmentEvent($event, appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, appointment)\"\n [title]=\"appointment.title\"\n [class.ax-draggable]=\"draggable()\"\n [style.color]=\"appointment.textColor\"\n class=\"ax-scheduler-popover-appointment\"\n [style.background-color]=\"appointment.backgroundColor\"\n >\n <span class=\"ax-appointment-chip-title ax-scheduler-truncate\">{{ appointment.title }}</span>\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-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-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-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-scheduler-month-header-date-day-char{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;color:rgba(var(--ax-sys-color-on-primary-surface));border-radius:calc(var(--ax-sys-border-radius) / 2);background-color:rgba(var(--ax-sys-color-primary-surface))}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;color:rgba(var(--ax-sys-color-primary-text))}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))}\n"], dependencies: [{ 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: AXFormatPipe, name: "format" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }, { kind: "component", type: AXPopoverComponent, selector: "ax-popover", inputs: ["offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
1025
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.9", ngImport: i0, type: AXSchedulerTimelineMonthViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
1026
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.9", type: AXSchedulerTimelineMonthViewComponent, isStandalone: true, selector: "ax-scheduler-timeline-month-view", inputs: { readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, draggable: { classPropertyName: "draggable", publicName: "draggable", isSignal: true, isRequired: false, transformFunction: null }, calendar: { classPropertyName: "calendar", publicName: "calendar", isSignal: true, isRequired: false, transformFunction: null }, endHour: { classPropertyName: "endHour", publicName: "endHour", isSignal: true, isRequired: true, transformFunction: null }, date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: true, transformFunction: null }, startHour: { classPropertyName: "startHour", publicName: "startHour", isSignal: true, isRequired: true, transformFunction: null }, appointments: { classPropertyName: "appointments", publicName: "appointments", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { slotClickedInternal: "slotClickedInternal", slotDblClickedInternal: "slotDblClickedInternal", slotRightClickedInternal: "slotRightClickedInternal", appointmentClickedInternal: "appointmentClickedInternal", appointmentDblClickedInternal: "appointmentDblClickedInternal", appointmentRightClickedInternal: "appointmentRightClickedInternal" }, host: { properties: { "class.ax-state-readonly": "this.isReadonly" } }, usesInheritance: true, ngImport: i0, template: "<div class=\"ax-scheduler-timeline-month-container\">\n @for (appt of monthAppointments(); track appt.visibleAppointments) {\n <div>\n <div class=\"ax-scheduler-timeline-header\">\n <div class=\"ax-scheduler-month-header-date-day\" [class.ax-today]=\"isToday(appt.date)\">\n <span class=\"ax-scheduler-month-header-date-day-char\">\n {{ appt.date | format: 'date' : { format: 'dddd', calendar: calendar() } | async }}\n </span>\n <span class=\"ax-scheduler-month-header-date-day-num\">\n {{ appt.date | format: 'date' : { format: 'DD', calendar: calendar() } | async }}\n </span>\n </div>\n </div>\n\n <div\n class=\"ax-scheduler-timeline-content\"\n (click)=\"handleSlotEvent($event, appt.date)\"\n (dblclick)=\"handleSlotEvent($event, appt.date)\"\n (contextmenu)=\"handleSlotEvent($event, appt.date)\"\n >\n <div class=\"ax-scheduler-timeline-appointment-container\">\n @for (appointment of appt.visibleAppointments; track appointment.key) {\n <div\n (click)=\"handleAppointmentEvent($event, appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, appointment)\"\n [title]=\"appointment.title\"\n [class.ax-draggable]=\"draggable()\"\n [style.color]=\"appointment.textColor\"\n class=\"ax-scheduler-timeline-appointment\"\n [style.background-color]=\"appointment.backgroundColor\"\n >\n <ax-title class=\"ax-scheduler-truncate\">{{ appointment.title }}</ax-title>\n <ax-subtitle>\n {{ appointment.startDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }} -\n {{ appointment.endDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}\n </ax-subtitle>\n </div>\n }\n @if (appt.moreCount > 0) {\n <div #moreAppointments class=\"ax-scheduler-month-overflow-badge\">\n +{{ 'more-items' | translate: { params: { number: appt.moreCount } } | async }}\n </div>\n <ax-popover [target]=\"moreAppointments\" [placement]=\"'bottom'\">\n <div\n [class.ax-state-readonly]=\"readonly()\"\n class=\"ax-overlay-pane ax-scheduler-popover ax-scheduler-month-popover-appointment\"\n >\n @for (appointment of appt.hiddenAppointments; track appointment.key) {\n <div\n (click)=\"handleAppointmentEvent($event, appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, appointment)\"\n [title]=\"appointment.title\"\n [class.ax-draggable]=\"draggable()\"\n [style.color]=\"appointment.textColor\"\n class=\"ax-scheduler-popover-appointment\"\n [style.background-color]=\"appointment.backgroundColor\"\n >\n <span class=\"ax-appointment-chip-title ax-scheduler-truncate\">{{ appointment.title }}</span>\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-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-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-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-scheduler-month-header-date-day-char{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;color:rgba(var(--ax-sys-color-on-primary-surface));border-radius:calc(var(--ax-sys-border-radius) / 2);background-color:rgba(var(--ax-sys-color-primary-surface))}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;color:rgba(var(--ax-sys-color-primary-text))}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))}\n"], dependencies: [{ 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: AXFormatPipe, name: "format" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }, { kind: "component", type: AXPopoverComponent, selector: "ax-popover", inputs: ["offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
1027
1027
|
}
|
1028
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
1028
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.9", ngImport: i0, type: AXSchedulerTimelineMonthViewComponent, decorators: [{
|
1029
1029
|
type: Component,
|
1030
1030
|
args: [{ selector: 'ax-scheduler-timeline-month-view', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [AXDecoratorGenericComponent, AXFormatPipe, AsyncPipe, AXTranslatorPipe, AXPopoverComponent], template: "<div class=\"ax-scheduler-timeline-month-container\">\n @for (appt of monthAppointments(); track appt.visibleAppointments) {\n <div>\n <div class=\"ax-scheduler-timeline-header\">\n <div class=\"ax-scheduler-month-header-date-day\" [class.ax-today]=\"isToday(appt.date)\">\n <span class=\"ax-scheduler-month-header-date-day-char\">\n {{ appt.date | format: 'date' : { format: 'dddd', calendar: calendar() } | async }}\n </span>\n <span class=\"ax-scheduler-month-header-date-day-num\">\n {{ appt.date | format: 'date' : { format: 'DD', calendar: calendar() } | async }}\n </span>\n </div>\n </div>\n\n <div\n class=\"ax-scheduler-timeline-content\"\n (click)=\"handleSlotEvent($event, appt.date)\"\n (dblclick)=\"handleSlotEvent($event, appt.date)\"\n (contextmenu)=\"handleSlotEvent($event, appt.date)\"\n >\n <div class=\"ax-scheduler-timeline-appointment-container\">\n @for (appointment of appt.visibleAppointments; track appointment.key) {\n <div\n (click)=\"handleAppointmentEvent($event, appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, appointment)\"\n [title]=\"appointment.title\"\n [class.ax-draggable]=\"draggable()\"\n [style.color]=\"appointment.textColor\"\n class=\"ax-scheduler-timeline-appointment\"\n [style.background-color]=\"appointment.backgroundColor\"\n >\n <ax-title class=\"ax-scheduler-truncate\">{{ appointment.title }}</ax-title>\n <ax-subtitle>\n {{ appointment.startDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }} -\n {{ appointment.endDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}\n </ax-subtitle>\n </div>\n }\n @if (appt.moreCount > 0) {\n <div #moreAppointments class=\"ax-scheduler-month-overflow-badge\">\n +{{ 'more-items' | translate: { params: { number: appt.moreCount } } | async }}\n </div>\n <ax-popover [target]=\"moreAppointments\" [placement]=\"'bottom'\">\n <div\n [class.ax-state-readonly]=\"readonly()\"\n class=\"ax-overlay-pane ax-scheduler-popover ax-scheduler-month-popover-appointment\"\n >\n @for (appointment of appt.hiddenAppointments; track appointment.key) {\n <div\n (click)=\"handleAppointmentEvent($event, appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, appointment)\"\n [title]=\"appointment.title\"\n [class.ax-draggable]=\"draggable()\"\n [style.color]=\"appointment.textColor\"\n class=\"ax-scheduler-popover-appointment\"\n [style.background-color]=\"appointment.backgroundColor\"\n >\n <span class=\"ax-appointment-chip-title ax-scheduler-truncate\">{{ appointment.title }}</span>\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-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-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-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-scheduler-month-header-date-day-char{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;color:rgba(var(--ax-sys-color-on-primary-surface));border-radius:calc(var(--ax-sys-border-radius) / 2);background-color:rgba(var(--ax-sys-color-primary-surface))}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;color:rgba(var(--ax-sys-color-primary-text))}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))}\n"] }]
|
1031
1031
|
}], propDecorators: { isReadonly: [{
|
@@ -1076,10 +1076,10 @@ class AXSchedulerTimelineMultiDayViewComponent extends MXBaseComponent {
|
|
1076
1076
|
const today = this.calendarService.create(new Date());
|
1077
1077
|
return date.equal(today, 'day');
|
1078
1078
|
}
|
1079
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
1080
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.
|
1079
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.9", ngImport: i0, type: AXSchedulerTimelineMultiDayViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
1080
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.9", 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 }, calendar: { classPropertyName: "calendar", publicName: "calendar", isSignal: true, isRequired: false, transformFunction: null }, endHour: { classPropertyName: "endHour", publicName: "endHour", isSignal: true, isRequired: true, transformFunction: null }, date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: true, transformFunction: null }, startHour: { classPropertyName: "startHour", publicName: "startHour", isSignal: true, isRequired: true, transformFunction: null }, appointments: { classPropertyName: "appointments", publicName: "appointments", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { slotClickedInternal: "slotClickedInternal", slotDblClickedInternal: "slotDblClickedInternal", slotRightClickedInternal: "slotRightClickedInternal", appointmentClickedInternal: "appointmentClickedInternal", appointmentDblClickedInternal: "appointmentDblClickedInternal", appointmentRightClickedInternal: "appointmentRightClickedInternal" }, usesInheritance: true, ngImport: i0, template: "<div class=\"ax-scheduler-timeline-day-view-container\">\n @for (appt of multiDayAppointments(); track appt.appointments) {\n <div>\n <div class=\"ax-scheduler-week-header-date-day\" [class.ax-today]=\"isToday(appt.date)\">\n <span class=\"ax-scheduler-week-header-date-day-char\">\n {{ appt.date | format: 'date' : { format: 'dddd', calendar: calendar() } | async }}\n </span>\n <span class=\"ax-scheduler-week-header-date-day-num\">\n {{ appt.date | format: 'date' : { format: 'DD', calendar: calendar() } | async }}\n </span>\n </div>\n <ax-scheduler-timeline-day-view\n [date]=\"appt.date\"\n [endHour]=\"endHour()\"\n [readonly]=\"readonly()\"\n [startHour]=\"startHour()\"\n [draggable]=\"draggable()\"\n [appointments]=\"appt.appointments\"\n (slotClickedInternal)=\"slotClickedInternal.emit($event)\"\n (slotDblClickedInternal)=\"slotDblClickedInternal.emit($event)\"\n (slotRightClickedInternal)=\"slotRightClickedInternal.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-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-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-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-scheduler-week-header-date-day-char{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", "calendar", "endHour", "date", "startHour", "appointments"], outputs: ["slotClickedInternal", "slotDblClickedInternal", "slotRightClickedInternal", "appointmentClickedInternal", "appointmentDblClickedInternal", "appointmentRightClickedInternal"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXFormatPipe, name: "format" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
1081
1081
|
}
|
1082
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
1082
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.9", ngImport: i0, type: AXSchedulerTimelineMultiDayViewComponent, decorators: [{
|
1083
1083
|
type: Component,
|
1084
1084
|
args: [{ selector: 'ax-scheduler-timeline-multi-day-view', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [AXSchedulerTimelineDayViewComponent, AsyncPipe, AXFormatPipe], template: "<div class=\"ax-scheduler-timeline-day-view-container\">\n @for (appt of multiDayAppointments(); track appt.appointments) {\n <div>\n <div class=\"ax-scheduler-week-header-date-day\" [class.ax-today]=\"isToday(appt.date)\">\n <span class=\"ax-scheduler-week-header-date-day-char\">\n {{ appt.date | format: 'date' : { format: 'dddd', calendar: calendar() } | async }}\n </span>\n <span class=\"ax-scheduler-week-header-date-day-num\">\n {{ appt.date | format: 'date' : { format: 'DD', calendar: calendar() } | async }}\n </span>\n </div>\n <ax-scheduler-timeline-day-view\n [date]=\"appt.date\"\n [endHour]=\"endHour()\"\n [readonly]=\"readonly()\"\n [startHour]=\"startHour()\"\n [draggable]=\"draggable()\"\n [appointments]=\"appt.appointments\"\n (slotClickedInternal)=\"slotClickedInternal.emit($event)\"\n (slotDblClickedInternal)=\"slotDblClickedInternal.emit($event)\"\n (slotRightClickedInternal)=\"slotRightClickedInternal.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-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-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-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-scheduler-week-header-date-day-char{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"] }]
|
1085
1085
|
}] });
|
@@ -1388,10 +1388,10 @@ class AXSchedulerWeekViewComponent extends MXBaseComponent {
|
|
1388
1388
|
get isReadonly() {
|
1389
1389
|
return this.readonly();
|
1390
1390
|
}
|
1391
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
1392
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.8", type: AXSchedulerWeekViewComponent, isStandalone: true, selector: "ax-scheduler-week-view", inputs: { readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, draggable: { classPropertyName: "draggable", publicName: "draggable", isSignal: true, isRequired: false, transformFunction: null }, calendar: { classPropertyName: "calendar", publicName: "calendar", isSignal: true, isRequired: false, transformFunction: null }, endHour: { classPropertyName: "endHour", publicName: "endHour", isSignal: true, isRequired: true, transformFunction: null }, date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: true, transformFunction: null }, startHour: { classPropertyName: "startHour", publicName: "startHour", isSignal: true, isRequired: true, transformFunction: null }, appointments: { classPropertyName: "appointments", publicName: "appointments", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { slotClickedInternal: "slotClickedInternal", slotDblClickedInternal: "slotDblClickedInternal", slotRightClickedInternal: "slotRightClickedInternal", appointmentClickedInternal: "appointmentClickedInternal", appointmentDblClickedInternal: "appointmentDblClickedInternal", appointmentRightClickedInternal: "appointmentRightClickedInternal" }, host: { properties: { "class.ax-state-readonly": "this.isReadonly" } }, 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.getTime()) {\n <div class=\"ax-scheduler-week-header-date-day\" [class.ax-today]=\"isToday(day)\">\n <span class=\"ax-scheduler-week-header-date-day-char\">\n {{ day | format: 'date' : { format: 'dddd', calendar: calendar() } | async }}\n </span>\n <span class=\"ax-scheduler-week-header-date-day-num\">\n {{ day | 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\">{{ '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 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 (click)=\"handleAppointmentEvent($event, slotData.appointments[0])\"\n (dblclick)=\"handleAppointmentEvent($event, slotData.appointments[0])\"\n (contextmenu)=\"handleAppointmentEvent($event, slotData.appointments[0])\"\n [title]=\"slotData.appointments[0].title\"\n class=\"ax-scheduler-header-week-appointment\"\n [style.color]=\"slotData.appointments[0].textColor\"\n [style.background-color]=\"slotData.appointments[0].backgroundColor\"\n >\n <ax-title class=\"ax-scheduler-truncate\">{{ slotData.appointments[0].title }}</ax-title>\n </div>\n }\n @if (slotData.appointments.length > 1) {\n <div #moreAppointments class=\"ax-scheduler-appointment-badge\">+{{ slotData.appointments.length - 1 }}</div>\n <ax-popover [target]=\"moreAppointments\" [placement]=\"'bottom'\">\n <div class=\"ax-overlay-pane ax-scheduler-popover\" [class.ax-state-readonly]=\"readonly()\">\n @for (appointment of slotData.appointments; track appointment.key; let first = $first) {\n @if (!first) {\n <div\n (click)=\"handleAppointmentEvent($event, appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, appointment)\"\n [title]=\"appointment.title\"\n [class.ax-draggable]=\"draggable()\"\n class=\"ax-scheduler-popover-appointment\"\n [style.color]=\"appointment.textColor\"\n [style.background-color]=\"appointment.backgroundColor\"\n >\n <ax-title class=\"ax-scheduler-truncate\">{{ appointment.title }}</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.key) {\n <div\n (click)=\"handleAppointmentEvent($event, appt.appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, appt.appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, appt.appointment)\"\n [title]=\"appt.appointment.title\"\n [class.ax-draggable]=\"draggable()\"\n [style.height]=\"appt.layoutHeight\"\n class=\"ax-scheduler-week-appointment\"\n [style.color]=\"appt.appointment.textColor\"\n [style.inset-block-start]=\"appt.layoutTop\"\n [style.inset-inline-start]=\"appt.layoutLeft\"\n [style.background-color]=\"appt.appointment.backgroundColor\"\n >\n <ax-title class=\"ax-scheduler-truncate\">{{ appt.appointment.title }}</ax-title>\n <ax-subtitle>\n {{ appt.appointment.startDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }} -\n {{ appt.appointment.endDate | 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 #actionButton class=\"ax-scheduler-appointment-badge\">+{{ badge.count }}</div>\n <!-- The Popover -->\n <ax-popover [target]=\"actionButton\" [placement]=\"'bottom'\">\n <div class=\"ax-overlay-pane ax-scheduler-popover\">\n @for (appointment of badge.hiddenAppointments; track appointment.key) {\n <div\n (click)=\"handleAppointmentEvent($event, appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, appointment)\"\n [title]=\"appointment.title\"\n [class.ax-draggable]=\"draggable()\"\n [style.color]=\"appointment.textColor\"\n class=\"ax-scheduler-popover-appointment\"\n [style.background-color]=\"appointment.backgroundColor\"\n >\n <ax-title class=\"ax-scheduler-truncate\">{{ appointment.title }}</ax-title>\n <ax-subtitle>\n {{ appointment.startDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }} -\n {{ appointment.endDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}\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.getTime()) {\n <td\n (click)=\"handleSingleSlotEvent($event, time, day, 0)\"\n (dblclick)=\"handleSingleSlotEvent($event, time, day, 0)\"\n (contextmenu)=\"handleSingleSlotEvent($event, time, day, 0)\"\n ></td>\n }\n </tr>\n <tr>\n @for (day of daysArray(); track day.date.getTime()) {\n <td\n (click)=\"handleSingleSlotEvent($event, time, day, 1)\"\n (dblclick)=\"handleSingleSlotEvent($event, time, day, 1)\"\n (contextmenu)=\"handleSingleSlotEvent($event, time, day, 1)\"\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;height:1.5rem;cursor:pointer;font-size:.75rem;align-items:center;border-radius:9999px;justify-content:center;width:1.5rem!important;color:rgba(var(--ax-sys-color-on-primary-surface));background-color:rgba(var(--ax-sys-color-primary-surface))}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{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:100%;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:flex;align-items:center;flex-direction:column;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-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-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-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-scheduler-week-header-date-day-char{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:calc(100% - 2rem);color:rgba(var(--ax-sys-color-on-primary-surface));border-radius:calc(var(--ax-sys-border-radius) / 2);background-color:rgba(var(--ax-sys-color-primary-surface))}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;width:calc(14.2857142857% - 2rem);color:rgba(var(--ax-sys-color-on-primary-surface));border-radius:calc(var(--ax-sys-border-radius) / 2);background-color:rgba(var(--ax-sys-color-primary-surface))}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))}\n"], dependencies: [{ 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: AXTranslatorPipe, name: "translate" }, { kind: "component", type: AXPopoverComponent, selector: "ax-popover", inputs: ["offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "pipe", type: AXFormatPipe, name: "format" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
1391
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.9", ngImport: i0, type: AXSchedulerWeekViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
1392
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.9", type: AXSchedulerWeekViewComponent, isStandalone: true, selector: "ax-scheduler-week-view", inputs: { readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, draggable: { classPropertyName: "draggable", publicName: "draggable", isSignal: true, isRequired: false, transformFunction: null }, calendar: { classPropertyName: "calendar", publicName: "calendar", isSignal: true, isRequired: false, transformFunction: null }, endHour: { classPropertyName: "endHour", publicName: "endHour", isSignal: true, isRequired: true, transformFunction: null }, date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: true, transformFunction: null }, startHour: { classPropertyName: "startHour", publicName: "startHour", isSignal: true, isRequired: true, transformFunction: null }, appointments: { classPropertyName: "appointments", publicName: "appointments", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { slotClickedInternal: "slotClickedInternal", slotDblClickedInternal: "slotDblClickedInternal", slotRightClickedInternal: "slotRightClickedInternal", appointmentClickedInternal: "appointmentClickedInternal", appointmentDblClickedInternal: "appointmentDblClickedInternal", appointmentRightClickedInternal: "appointmentRightClickedInternal" }, host: { properties: { "class.ax-state-readonly": "this.isReadonly" } }, 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.getTime()) {\n <div class=\"ax-scheduler-week-header-date-day\" [class.ax-today]=\"isToday(day)\">\n <span class=\"ax-scheduler-week-header-date-day-char\">\n {{ day | format: 'date' : { format: 'dddd', calendar: calendar() } | async }}\n </span>\n <span class=\"ax-scheduler-week-header-date-day-num\">\n {{ day | 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\">{{ '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 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 (click)=\"handleAppointmentEvent($event, slotData.appointments[0])\"\n (dblclick)=\"handleAppointmentEvent($event, slotData.appointments[0])\"\n (contextmenu)=\"handleAppointmentEvent($event, slotData.appointments[0])\"\n [title]=\"slotData.appointments[0].title\"\n class=\"ax-scheduler-header-week-appointment\"\n [style.color]=\"slotData.appointments[0].textColor\"\n [style.background-color]=\"slotData.appointments[0].backgroundColor\"\n >\n <ax-title class=\"ax-scheduler-truncate\">{{ slotData.appointments[0].title }}</ax-title>\n </div>\n }\n @if (slotData.appointments.length > 1) {\n <div #moreAppointments class=\"ax-scheduler-appointment-badge\">+{{ slotData.appointments.length - 1 }}</div>\n <ax-popover [target]=\"moreAppointments\" [placement]=\"'bottom'\">\n <div class=\"ax-overlay-pane ax-scheduler-popover\" [class.ax-state-readonly]=\"readonly()\">\n @for (appointment of slotData.appointments; track appointment.key; let first = $first) {\n @if (!first) {\n <div\n (click)=\"handleAppointmentEvent($event, appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, appointment)\"\n [title]=\"appointment.title\"\n [class.ax-draggable]=\"draggable()\"\n class=\"ax-scheduler-popover-appointment\"\n [style.color]=\"appointment.textColor\"\n [style.background-color]=\"appointment.backgroundColor\"\n >\n <ax-title class=\"ax-scheduler-truncate\">{{ appointment.title }}</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.key) {\n <div\n (click)=\"handleAppointmentEvent($event, appt.appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, appt.appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, appt.appointment)\"\n [title]=\"appt.appointment.title\"\n [class.ax-draggable]=\"draggable()\"\n [style.height]=\"appt.layoutHeight\"\n class=\"ax-scheduler-week-appointment\"\n [style.color]=\"appt.appointment.textColor\"\n [style.inset-block-start]=\"appt.layoutTop\"\n [style.inset-inline-start]=\"appt.layoutLeft\"\n [style.background-color]=\"appt.appointment.backgroundColor\"\n >\n <ax-title class=\"ax-scheduler-truncate\">{{ appt.appointment.title }}</ax-title>\n <ax-subtitle>\n {{ appt.appointment.startDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }} -\n {{ appt.appointment.endDate | 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 #actionButton class=\"ax-scheduler-appointment-badge\">+{{ badge.count }}</div>\n <!-- The Popover -->\n <ax-popover [target]=\"actionButton\" [placement]=\"'bottom'\">\n <div class=\"ax-overlay-pane ax-scheduler-popover\">\n @for (appointment of badge.hiddenAppointments; track appointment.key) {\n <div\n (click)=\"handleAppointmentEvent($event, appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, appointment)\"\n [title]=\"appointment.title\"\n [class.ax-draggable]=\"draggable()\"\n [style.color]=\"appointment.textColor\"\n class=\"ax-scheduler-popover-appointment\"\n [style.background-color]=\"appointment.backgroundColor\"\n >\n <ax-title class=\"ax-scheduler-truncate\">{{ appointment.title }}</ax-title>\n <ax-subtitle>\n {{ appointment.startDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }} -\n {{ appointment.endDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}\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.getTime()) {\n <td\n (click)=\"handleSingleSlotEvent($event, time, day, 0)\"\n (dblclick)=\"handleSingleSlotEvent($event, time, day, 0)\"\n (contextmenu)=\"handleSingleSlotEvent($event, time, day, 0)\"\n ></td>\n }\n </tr>\n <tr>\n @for (day of daysArray(); track day.date.getTime()) {\n <td\n (click)=\"handleSingleSlotEvent($event, time, day, 1)\"\n (dblclick)=\"handleSingleSlotEvent($event, time, day, 1)\"\n (contextmenu)=\"handleSingleSlotEvent($event, time, day, 1)\"\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;height:1.5rem;cursor:pointer;font-size:.75rem;align-items:center;border-radius:9999px;justify-content:center;width:1.5rem!important;color:rgba(var(--ax-sys-color-on-primary-surface));background-color:rgba(var(--ax-sys-color-primary-surface))}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{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:100%;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:flex;align-items:center;flex-direction:column;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-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-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-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-scheduler-week-header-date-day-char{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:calc(100% - 2rem);color:rgba(var(--ax-sys-color-on-primary-surface));border-radius:calc(var(--ax-sys-border-radius) / 2);background-color:rgba(var(--ax-sys-color-primary-surface))}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;width:calc(14.2857142857% - 2rem);color:rgba(var(--ax-sys-color-on-primary-surface));border-radius:calc(var(--ax-sys-border-radius) / 2);background-color:rgba(var(--ax-sys-color-primary-surface))}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))}\n"], dependencies: [{ 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: AXTranslatorPipe, name: "translate" }, { kind: "component", type: AXPopoverComponent, selector: "ax-popover", inputs: ["offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "pipe", type: AXFormatPipe, name: "format" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
1393
1393
|
}
|
1394
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
1394
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.9", ngImport: i0, type: AXSchedulerWeekViewComponent, decorators: [{
|
1395
1395
|
type: Component,
|
1396
1396
|
args: [{ selector: 'ax-scheduler-week-view', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [AXDecoratorGenericComponent, AsyncPipe, AXTranslatorPipe, AXPopoverComponent, AXFormatPipe], 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.getTime()) {\n <div class=\"ax-scheduler-week-header-date-day\" [class.ax-today]=\"isToday(day)\">\n <span class=\"ax-scheduler-week-header-date-day-char\">\n {{ day | format: 'date' : { format: 'dddd', calendar: calendar() } | async }}\n </span>\n <span class=\"ax-scheduler-week-header-date-day-num\">\n {{ day | 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\">{{ '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 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 (click)=\"handleAppointmentEvent($event, slotData.appointments[0])\"\n (dblclick)=\"handleAppointmentEvent($event, slotData.appointments[0])\"\n (contextmenu)=\"handleAppointmentEvent($event, slotData.appointments[0])\"\n [title]=\"slotData.appointments[0].title\"\n class=\"ax-scheduler-header-week-appointment\"\n [style.color]=\"slotData.appointments[0].textColor\"\n [style.background-color]=\"slotData.appointments[0].backgroundColor\"\n >\n <ax-title class=\"ax-scheduler-truncate\">{{ slotData.appointments[0].title }}</ax-title>\n </div>\n }\n @if (slotData.appointments.length > 1) {\n <div #moreAppointments class=\"ax-scheduler-appointment-badge\">+{{ slotData.appointments.length - 1 }}</div>\n <ax-popover [target]=\"moreAppointments\" [placement]=\"'bottom'\">\n <div class=\"ax-overlay-pane ax-scheduler-popover\" [class.ax-state-readonly]=\"readonly()\">\n @for (appointment of slotData.appointments; track appointment.key; let first = $first) {\n @if (!first) {\n <div\n (click)=\"handleAppointmentEvent($event, appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, appointment)\"\n [title]=\"appointment.title\"\n [class.ax-draggable]=\"draggable()\"\n class=\"ax-scheduler-popover-appointment\"\n [style.color]=\"appointment.textColor\"\n [style.background-color]=\"appointment.backgroundColor\"\n >\n <ax-title class=\"ax-scheduler-truncate\">{{ appointment.title }}</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.key) {\n <div\n (click)=\"handleAppointmentEvent($event, appt.appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, appt.appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, appt.appointment)\"\n [title]=\"appt.appointment.title\"\n [class.ax-draggable]=\"draggable()\"\n [style.height]=\"appt.layoutHeight\"\n class=\"ax-scheduler-week-appointment\"\n [style.color]=\"appt.appointment.textColor\"\n [style.inset-block-start]=\"appt.layoutTop\"\n [style.inset-inline-start]=\"appt.layoutLeft\"\n [style.background-color]=\"appt.appointment.backgroundColor\"\n >\n <ax-title class=\"ax-scheduler-truncate\">{{ appt.appointment.title }}</ax-title>\n <ax-subtitle>\n {{ appt.appointment.startDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }} -\n {{ appt.appointment.endDate | 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 #actionButton class=\"ax-scheduler-appointment-badge\">+{{ badge.count }}</div>\n <!-- The Popover -->\n <ax-popover [target]=\"actionButton\" [placement]=\"'bottom'\">\n <div class=\"ax-overlay-pane ax-scheduler-popover\">\n @for (appointment of badge.hiddenAppointments; track appointment.key) {\n <div\n (click)=\"handleAppointmentEvent($event, appointment)\"\n (dblclick)=\"handleAppointmentEvent($event, appointment)\"\n (contextmenu)=\"handleAppointmentEvent($event, appointment)\"\n [title]=\"appointment.title\"\n [class.ax-draggable]=\"draggable()\"\n [style.color]=\"appointment.textColor\"\n class=\"ax-scheduler-popover-appointment\"\n [style.background-color]=\"appointment.backgroundColor\"\n >\n <ax-title class=\"ax-scheduler-truncate\">{{ appointment.title }}</ax-title>\n <ax-subtitle>\n {{ appointment.startDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }} -\n {{ appointment.endDate | format: 'time' : { format: 'HH:mm', calendar: calendar() } | async }}\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.getTime()) {\n <td\n (click)=\"handleSingleSlotEvent($event, time, day, 0)\"\n (dblclick)=\"handleSingleSlotEvent($event, time, day, 0)\"\n (contextmenu)=\"handleSingleSlotEvent($event, time, day, 0)\"\n ></td>\n }\n </tr>\n <tr>\n @for (day of daysArray(); track day.date.getTime()) {\n <td\n (click)=\"handleSingleSlotEvent($event, time, day, 1)\"\n (dblclick)=\"handleSingleSlotEvent($event, time, day, 1)\"\n (contextmenu)=\"handleSingleSlotEvent($event, time, day, 1)\"\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;height:1.5rem;cursor:pointer;font-size:.75rem;align-items:center;border-radius:9999px;justify-content:center;width:1.5rem!important;color:rgba(var(--ax-sys-color-on-primary-surface));background-color:rgba(var(--ax-sys-color-primary-surface))}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{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:100%;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:flex;align-items:center;flex-direction:column;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-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-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-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-scheduler-week-header-date-day-char{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:calc(100% - 2rem);color:rgba(var(--ax-sys-color-on-primary-surface));border-radius:calc(var(--ax-sys-border-radius) / 2);background-color:rgba(var(--ax-sys-color-primary-surface))}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;width:calc(14.2857142857% - 2rem);color:rgba(var(--ax-sys-color-on-primary-surface));border-radius:calc(var(--ax-sys-border-radius) / 2);background-color:rgba(var(--ax-sys-color-primary-surface))}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))}\n"] }]
|
1397
1397
|
}], propDecorators: { isReadonly: [{
|
@@ -1760,10 +1760,10 @@ class AXSchedulerComponent extends MXBaseComponent {
|
|
1760
1760
|
this.getHostElement().classList.remove('ax-full-screen-container');
|
1761
1761
|
this.isFullScreen.set(!this.isFullScreen());
|
1762
1762
|
}
|
1763
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
1764
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.8", type: AXSchedulerComponent, isStandalone: true, selector: "ax-scheduler", inputs: { calendar: { classPropertyName: "calendar", publicName: "calendar", isSignal: true, isRequired: false, transformFunction: null }, startingDate: { classPropertyName: "startingDate", publicName: "startingDate", isSignal: true, isRequired: false, transformFunction: null }, endHour: { classPropertyName: "endHour", publicName: "endHour", isSignal: true, isRequired: false, transformFunction: null }, startHour: { classPropertyName: "startHour", publicName: "startHour", isSignal: true, isRequired: false, transformFunction: null }, keyField: { classPropertyName: "keyField", publicName: "keyField", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, titleField: { classPropertyName: "titleField", publicName: "titleField", isSignal: true, isRequired: false, transformFunction: null }, allDayField: { classPropertyName: "allDayField", publicName: "allDayField", isSignal: true, isRequired: false, transformFunction: null }, allowFullScreen: { classPropertyName: "allowFullScreen", publicName: "allowFullScreen", isSignal: true, isRequired: false, transformFunction: null }, endDateField: { classPropertyName: "endDateField", publicName: "endDateField", isSignal: true, isRequired: false, transformFunction: null }, multiDayViewDaysCount: { classPropertyName: "multiDayViewDaysCount", publicName: "multiDayViewDaysCount", isSignal: true, isRequired: false, transformFunction: null }, readonlyField: { classPropertyName: "readonlyField", publicName: "readonlyField", isSignal: true, isRequired: false, transformFunction: null }, startDateField: { classPropertyName: "startDateField", publicName: "startDateField", isSignal: true, isRequired: false, transformFunction: null }, textColorField: { classPropertyName: "textColorField", publicName: "textColorField", isSignal: true, isRequired: false, transformFunction: null }, descriptionField: { classPropertyName: "descriptionField", publicName: "descriptionField", isSignal: true, isRequired: false, transformFunction: null }, backgroundColorField: { classPropertyName: "backgroundColorField", publicName: "backgroundColorField", isSignal: true, isRequired: false, transformFunction: null }, dataSource: { classPropertyName: "dataSource", publicName: "dataSource", 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", onSlotClicked: "onSlotClicked", onSlotDblClicked: "onSlotDblClicked", onSlotRightClick: "onSlotRightClick", onAppointmentClicked: "onAppointmentClicked", onAppointmentDblClicked: "onAppointmentDblClicked", onAppointmentRightClick: "onAppointmentRightClick" }, providers: [AXUnsubscriber], viewQueries: [{ propertyName: "viewModeSelectbox", first: true, predicate: AXSelectBoxComponent, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"ax-scheduler-container\">\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\" [placement]=\"'bottom'\">\n <div class=\"ax-overlay-pane\">\n <ax-calendar\n [type]=\"calendarType()\"\n [depth]=\"calendarDepth()\"\n [ngModel]=\"currentDate()\"\n (ngModelChange)=\"calendarDateChanged($event)\"\n ></ax-calendar>\n </div>\n </ax-popover>\n </div>\n <div class=\"ax-scheduler-actions\">\n <ax-select-box\n [dropdownWidth]=\"200\"\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 <div class=\"ax-scheduler-views-container\">\n @switch (selectedView()) {\n @case ('day') {\n <ax-scheduler-day-view\n [endHour]=\"endHour()\"\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [startHour]=\"startHour()\"\n [draggable]=\"draggable()\"\n [calendar]=\"calendarType()\"\n [appointments]=\"viewAppointments()\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($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 [endHour]=\"endHour()\"\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [startHour]=\"startHour()\"\n [draggable]=\"draggable()\"\n [calendar]=\"calendarType()\"\n [appointments]=\"viewAppointments()\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($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 [firstDayOfWeek]=\"firstDayOfWeek()\"\n [appointments]=\"viewAppointments()\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($event)\"\n (appointmentClickedInternal)=\"handleAppointmentClickInternal($event)\"\n (appointmentDblClickedInternal)=\"handleAppointmentDblClickInternal($event)\"\n (appointmentRightClickedInternal)=\"handleAppointmentRightClickInternal($event)\"\n ></ax-scheduler-month-view>\n }\n @case ('timelineDay') {\n <ax-scheduler-timeline-day-view\n [endHour]=\"endHour()\"\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [startHour]=\"startHour()\"\n [draggable]=\"draggable()\"\n [calendar]=\"calendarType()\"\n [appointments]=\"viewAppointments()\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($event)\"\n (appointmentClickedInternal)=\"handleAppointmentClickInternal($event)\"\n (appointmentDblClickedInternal)=\"handleAppointmentDblClickInternal($event)\"\n (appointmentRightClickedInternal)=\"handleAppointmentRightClickInternal($event)\"\n >\n </ax-scheduler-timeline-day-view>\n }\n @case ('timelineMultiDay') {\n <ax-scheduler-timeline-multi-day-view\n [endHour]=\"endHour()\"\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [startHour]=\"startHour()\"\n [draggable]=\"draggable()\"\n [calendar]=\"calendarType()\"\n [appointments]=\"viewAppointments()\"\n [daysCount]=\"multiDayViewDaysCount()\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($event)\"\n (appointmentClickedInternal)=\"handleAppointmentClickInternal($event)\"\n (appointmentDblClickedInternal)=\"handleAppointmentDblClickInternal($event)\"\n (appointmentRightClickedInternal)=\"handleAppointmentRightClickInternal($event)\"\n >\n </ax-scheduler-timeline-multi-day-view>\n }\n @case ('timelineMonth') {\n <ax-scheduler-timeline-month-view\n [endHour]=\"endHour()\"\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [startHour]=\"startHour()\"\n [draggable]=\"draggable()\"\n [calendar]=\"calendarType()\"\n [appointments]=\"viewAppointments()\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($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 [endHour]=\"endHour()\"\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [startHour]=\"startHour()\"\n [draggable]=\"draggable()\"\n [calendar]=\"calendarType()\"\n [appointments]=\"viewAppointments()\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($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: ["ax-scheduler{--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;width:100%;height:100%;display:block;overflow:hidden;-webkit-user-select:none;user-select:none;border-width:1px;font-size:.875rem;border-radius:.75rem;background-color:inherit}ax-scheduler.ax-full-screen-container{top:0;left:0;z-index:50;width:100vw;height:100vh;position:fixed}ax-scheduler .ax-scheduler-container{height:100%;display:flex;flex-direction:column;background-color:inherit}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-draggable{cursor:grab}ax-scheduler .ax-scheduler-container .ax-draggable:active{cursor:grabbing}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-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;color:rgba(var(--ax-sys-color-on-primary-surface));border-radius:calc(var(--ax-sys-border-radius) / 2);background-color:rgba(var(--ax-sys-color-primary-surface))}.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}\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", "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: ["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"], 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", "calendar", "endHour", "date", "startHour", "appointments"], outputs: ["slotClickedInternal", "slotDblClickedInternal", "slotRightClickedInternal", "appointmentClickedInternal", "appointmentDblClickedInternal", "appointmentRightClickedInternal"] }, { kind: "component", type: AXSchedulerWeekViewComponent, selector: "ax-scheduler-week-view", inputs: ["readonly", "draggable", "calendar", "endHour", "date", "startHour", "appointments"], outputs: ["slotClickedInternal", "slotDblClickedInternal", "slotRightClickedInternal", "appointmentClickedInternal", "appointmentDblClickedInternal", "appointmentRightClickedInternal"] }, { kind: "component", type: AXSchedulerMonthViewComponent, selector: "ax-scheduler-month-view", inputs: ["readonly", "draggable", "calendar", "date", "appointments", "firstDayOfWeek"], outputs: ["slotClickedInternal", "slotDblClickedInternal", "slotRightClickedInternal", "appointmentClickedInternal", "appointmentDblClickedInternal", "appointmentRightClickedInternal"] }, { kind: "component", type: AXSchedulerTimelineDayViewComponent, selector: "ax-scheduler-timeline-day-view", inputs: ["readonly", "draggable", "calendar", "endHour", "date", "startHour", "appointments"], outputs: ["slotClickedInternal", "slotDblClickedInternal", "slotRightClickedInternal", "appointmentClickedInternal", "appointmentDblClickedInternal", "appointmentRightClickedInternal"] }, { kind: "component", type: AXSchedulerTimelineMultiDayViewComponent, selector: "ax-scheduler-timeline-multi-day-view", inputs: ["daysCount", "readonly", "draggable", "calendar", "endHour", "date", "startHour", "appointments"], outputs: ["slotClickedInternal", "slotDblClickedInternal", "slotRightClickedInternal", "appointmentClickedInternal", "appointmentDblClickedInternal", "appointmentRightClickedInternal"] }, { kind: "component", type: AXSchedulerTimelineMonthViewComponent, selector: "ax-scheduler-timeline-month-view", inputs: ["readonly", "draggable", "calendar", "endHour", "date", "startHour", "appointments"], outputs: ["slotClickedInternal", "slotDblClickedInternal", "slotRightClickedInternal", "appointmentClickedInternal", "appointmentDblClickedInternal", "appointmentRightClickedInternal"] }, { kind: "component", type: AXSchedulerAgendaViewComponent, selector: "ax-scheduler-agenda-view", inputs: ["daysCount", "readonly", "draggable", "calendar", "endHour", "date", "startHour", "appointments"], outputs: ["slotClickedInternal", "slotDblClickedInternal", "slotRightClickedInternal", "appointmentClickedInternal", "appointmentDblClickedInternal", "appointmentRightClickedInternal"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
1763
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.9", ngImport: i0, type: AXSchedulerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
1764
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.9", type: AXSchedulerComponent, isStandalone: true, selector: "ax-scheduler", inputs: { calendar: { classPropertyName: "calendar", publicName: "calendar", isSignal: true, isRequired: false, transformFunction: null }, startingDate: { classPropertyName: "startingDate", publicName: "startingDate", isSignal: true, isRequired: false, transformFunction: null }, endHour: { classPropertyName: "endHour", publicName: "endHour", isSignal: true, isRequired: false, transformFunction: null }, startHour: { classPropertyName: "startHour", publicName: "startHour", isSignal: true, isRequired: false, transformFunction: null }, keyField: { classPropertyName: "keyField", publicName: "keyField", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, titleField: { classPropertyName: "titleField", publicName: "titleField", isSignal: true, isRequired: false, transformFunction: null }, allDayField: { classPropertyName: "allDayField", publicName: "allDayField", isSignal: true, isRequired: false, transformFunction: null }, allowFullScreen: { classPropertyName: "allowFullScreen", publicName: "allowFullScreen", isSignal: true, isRequired: false, transformFunction: null }, endDateField: { classPropertyName: "endDateField", publicName: "endDateField", isSignal: true, isRequired: false, transformFunction: null }, multiDayViewDaysCount: { classPropertyName: "multiDayViewDaysCount", publicName: "multiDayViewDaysCount", isSignal: true, isRequired: false, transformFunction: null }, readonlyField: { classPropertyName: "readonlyField", publicName: "readonlyField", isSignal: true, isRequired: false, transformFunction: null }, startDateField: { classPropertyName: "startDateField", publicName: "startDateField", isSignal: true, isRequired: false, transformFunction: null }, textColorField: { classPropertyName: "textColorField", publicName: "textColorField", isSignal: true, isRequired: false, transformFunction: null }, descriptionField: { classPropertyName: "descriptionField", publicName: "descriptionField", isSignal: true, isRequired: false, transformFunction: null }, backgroundColorField: { classPropertyName: "backgroundColorField", publicName: "backgroundColorField", isSignal: true, isRequired: false, transformFunction: null }, dataSource: { classPropertyName: "dataSource", publicName: "dataSource", 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", onSlotClicked: "onSlotClicked", onSlotDblClicked: "onSlotDblClicked", onSlotRightClick: "onSlotRightClick", onAppointmentClicked: "onAppointmentClicked", onAppointmentDblClicked: "onAppointmentDblClicked", onAppointmentRightClick: "onAppointmentRightClick" }, providers: [AXUnsubscriber], viewQueries: [{ propertyName: "viewModeSelectbox", first: true, predicate: AXSelectBoxComponent, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"ax-scheduler-container\">\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\" [placement]=\"'bottom'\">\n <div class=\"ax-overlay-pane\">\n <ax-calendar\n [type]=\"calendarType()\"\n [depth]=\"calendarDepth()\"\n [ngModel]=\"currentDate()\"\n (ngModelChange)=\"calendarDateChanged($event)\"\n ></ax-calendar>\n </div>\n </ax-popover>\n </div>\n <div class=\"ax-scheduler-actions\">\n <ax-select-box\n [dropdownWidth]=\"200\"\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 <div class=\"ax-scheduler-views-container\">\n @switch (selectedView()) {\n @case ('day') {\n <ax-scheduler-day-view\n [endHour]=\"endHour()\"\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [startHour]=\"startHour()\"\n [draggable]=\"draggable()\"\n [calendar]=\"calendarType()\"\n [appointments]=\"viewAppointments()\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($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 [endHour]=\"endHour()\"\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [startHour]=\"startHour()\"\n [draggable]=\"draggable()\"\n [calendar]=\"calendarType()\"\n [appointments]=\"viewAppointments()\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($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 [firstDayOfWeek]=\"firstDayOfWeek()\"\n [appointments]=\"viewAppointments()\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($event)\"\n (appointmentClickedInternal)=\"handleAppointmentClickInternal($event)\"\n (appointmentDblClickedInternal)=\"handleAppointmentDblClickInternal($event)\"\n (appointmentRightClickedInternal)=\"handleAppointmentRightClickInternal($event)\"\n ></ax-scheduler-month-view>\n }\n @case ('timelineDay') {\n <ax-scheduler-timeline-day-view\n [endHour]=\"endHour()\"\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [startHour]=\"startHour()\"\n [draggable]=\"draggable()\"\n [calendar]=\"calendarType()\"\n [appointments]=\"viewAppointments()\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($event)\"\n (appointmentClickedInternal)=\"handleAppointmentClickInternal($event)\"\n (appointmentDblClickedInternal)=\"handleAppointmentDblClickInternal($event)\"\n (appointmentRightClickedInternal)=\"handleAppointmentRightClickInternal($event)\"\n >\n </ax-scheduler-timeline-day-view>\n }\n @case ('timelineMultiDay') {\n <ax-scheduler-timeline-multi-day-view\n [endHour]=\"endHour()\"\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [startHour]=\"startHour()\"\n [draggable]=\"draggable()\"\n [calendar]=\"calendarType()\"\n [appointments]=\"viewAppointments()\"\n [daysCount]=\"multiDayViewDaysCount()\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($event)\"\n (appointmentClickedInternal)=\"handleAppointmentClickInternal($event)\"\n (appointmentDblClickedInternal)=\"handleAppointmentDblClickInternal($event)\"\n (appointmentRightClickedInternal)=\"handleAppointmentRightClickInternal($event)\"\n >\n </ax-scheduler-timeline-multi-day-view>\n }\n @case ('timelineMonth') {\n <ax-scheduler-timeline-month-view\n [endHour]=\"endHour()\"\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [startHour]=\"startHour()\"\n [draggable]=\"draggable()\"\n [calendar]=\"calendarType()\"\n [appointments]=\"viewAppointments()\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($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 [endHour]=\"endHour()\"\n [date]=\"currentDate()\"\n [readonly]=\"readonly()\"\n [startHour]=\"startHour()\"\n [draggable]=\"draggable()\"\n [calendar]=\"calendarType()\"\n [appointments]=\"viewAppointments()\"\n (slotClickedInternal)=\"handleSlotClickInternal($event)\"\n (slotDblClickedInternal)=\"handleSlotDblClickInternal($event)\"\n (slotRightClickedInternal)=\"handleSlotRightClickInternal($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: ["ax-scheduler{--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;width:100%;height:100%;display:block;overflow:hidden;-webkit-user-select:none;user-select:none;border-width:1px;font-size:.875rem;border-radius:.75rem;background-color:inherit}ax-scheduler.ax-full-screen-container{top:0;left:0;z-index:50;width:100vw;height:100vh;position:fixed}ax-scheduler .ax-scheduler-container{height:100%;display:flex;flex-direction:column;background-color:inherit}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-draggable{cursor:grab}ax-scheduler .ax-scheduler-container .ax-draggable:active{cursor:grabbing}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-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;color:rgba(var(--ax-sys-color-on-primary-surface));border-radius:calc(var(--ax-sys-border-radius) / 2);background-color:rgba(var(--ax-sys-color-primary-surface))}.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}\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", "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: ["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"], 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", "calendar", "endHour", "date", "startHour", "appointments"], outputs: ["slotClickedInternal", "slotDblClickedInternal", "slotRightClickedInternal", "appointmentClickedInternal", "appointmentDblClickedInternal", "appointmentRightClickedInternal"] }, { kind: "component", type: AXSchedulerWeekViewComponent, selector: "ax-scheduler-week-view", inputs: ["readonly", "draggable", "calendar", "endHour", "date", "startHour", "appointments"], outputs: ["slotClickedInternal", "slotDblClickedInternal", "slotRightClickedInternal", "appointmentClickedInternal", "appointmentDblClickedInternal", "appointmentRightClickedInternal"] }, { kind: "component", type: AXSchedulerMonthViewComponent, selector: "ax-scheduler-month-view", inputs: ["readonly", "draggable", "calendar", "date", "appointments", "firstDayOfWeek"], outputs: ["slotClickedInternal", "slotDblClickedInternal", "slotRightClickedInternal", "appointmentClickedInternal", "appointmentDblClickedInternal", "appointmentRightClickedInternal"] }, { kind: "component", type: AXSchedulerTimelineDayViewComponent, selector: "ax-scheduler-timeline-day-view", inputs: ["readonly", "draggable", "calendar", "endHour", "date", "startHour", "appointments"], outputs: ["slotClickedInternal", "slotDblClickedInternal", "slotRightClickedInternal", "appointmentClickedInternal", "appointmentDblClickedInternal", "appointmentRightClickedInternal"] }, { kind: "component", type: AXSchedulerTimelineMultiDayViewComponent, selector: "ax-scheduler-timeline-multi-day-view", inputs: ["daysCount", "readonly", "draggable", "calendar", "endHour", "date", "startHour", "appointments"], outputs: ["slotClickedInternal", "slotDblClickedInternal", "slotRightClickedInternal", "appointmentClickedInternal", "appointmentDblClickedInternal", "appointmentRightClickedInternal"] }, { kind: "component", type: AXSchedulerTimelineMonthViewComponent, selector: "ax-scheduler-timeline-month-view", inputs: ["readonly", "draggable", "calendar", "endHour", "date", "startHour", "appointments"], outputs: ["slotClickedInternal", "slotDblClickedInternal", "slotRightClickedInternal", "appointmentClickedInternal", "appointmentDblClickedInternal", "appointmentRightClickedInternal"] }, { kind: "component", type: AXSchedulerAgendaViewComponent, selector: "ax-scheduler-agenda-view", inputs: ["daysCount", "readonly", "draggable", "calendar", "endHour", "date", "startHour", "appointments"], outputs: ["slotClickedInternal", "slotDblClickedInternal", "slotRightClickedInternal", "appointmentClickedInternal", "appointmentDblClickedInternal", "appointmentRightClickedInternal"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
1765
1765
|
}
|
1766
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
1766
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.9", ngImport: i0, type: AXSchedulerComponent, decorators: [{
|
1767
1767
|
type: Component,
|
1768
1768
|
args: [{ selector: 'ax-scheduler', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [
|
1769
1769
|
FormsModule,
|
@@ -1791,8 +1791,8 @@ const COMPONENT = [
|
|
1791
1791
|
AXSchedulerTimelineDayViewComponent,
|
1792
1792
|
];
|
1793
1793
|
class AXSchedulerModule {
|
1794
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
1795
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.
|
1794
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.9", ngImport: i0, type: AXSchedulerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
1795
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.9", ngImport: i0, type: AXSchedulerModule, imports: [AXSchedulerComponent,
|
1796
1796
|
AXSchedulerDayViewComponent,
|
1797
1797
|
AXSchedulerWeekViewComponent,
|
1798
1798
|
AXSchedulerMonthViewComponent,
|
@@ -1801,9 +1801,9 @@ class AXSchedulerModule {
|
|
1801
1801
|
AXSchedulerWeekViewComponent,
|
1802
1802
|
AXSchedulerMonthViewComponent,
|
1803
1803
|
AXSchedulerTimelineDayViewComponent] }); }
|
1804
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.
|
1804
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.9", ngImport: i0, type: AXSchedulerModule, imports: [COMPONENT] }); }
|
1805
1805
|
}
|
1806
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
1806
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.9", ngImport: i0, type: AXSchedulerModule, decorators: [{
|
1807
1807
|
type: NgModule,
|
1808
1808
|
args: [{
|
1809
1809
|
imports: [...COMPONENT],
|