@indigina/ui-kit 1.1.394 → 1.1.396

package/fesm2022/indigina-ui-kit.mjs

@@ -10161,6 +10161,16 @@ class KitSchedulerComponent {
         this.agendaTimeTemplate = contentChild(KitSchedulerAgendaTimeTemplateDirective, { ...(ngDevMode ? { debugName: "agendaTimeTemplate" } : {}), read: TemplateRef });
         this.headerCellTemplate = contentChild(KitSchedulerMonthHeaderCellTemplateDirective, { ...(ngDevMode ? { debugName: "headerCellTemplate" } : {}), read: TemplateRef });
     }
+    getSlotClass(args) {
+        const date = args.start;
+        const currentDate = new Date();
+        if (date?.toLocaleDateString() === currentDate.toLocaleDateString()) {
+            return {
+                highlightDate: true,
+            };
+        }
+    }
+    ;
     onEventClick(event) {
         this.eventClicked.emit(event);
     }
@@ -10203,7 +10213,7 @@ class KitSchedulerComponent {
         return local.toISOString().split('T')[0];
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: KitSchedulerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: KitSchedulerComponent, isStandalone: true, selector: "kit-scheduler", inputs: { events: { classPropertyName: "events", publicName: "events", isSignal: true, isRequired: false, transformFunction: null }, selectedDate: { classPropertyName: "selectedDate", publicName: "selectedDate", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, timezone: { classPropertyName: "timezone", publicName: "timezone", isSignal: true, isRequired: false, transformFunction: null }, viewModes: { classPropertyName: "viewModes", publicName: "viewModes", isSignal: true, isRequired: false, transformFunction: null }, showTimePill: { classPropertyName: "showTimePill", publicName: "showTimePill", isSignal: true, isRequired: false, transformFunction: null }, monthEventHeight: { classPropertyName: "monthEventHeight", publicName: "monthEventHeight", isSignal: true, isRequired: false, transformFunction: null }, eventsPerDay: { classPropertyName: "eventsPerDay", publicName: "eventsPerDay", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, exportedFileName: { classPropertyName: "exportedFileName", publicName: "exportedFileName", isSignal: true, isRequired: false, transformFunction: null }, showExportButton: { classPropertyName: "showExportButton", publicName: "showExportButton", isSignal: true, isRequired: false, transformFunction: null }, freezeToolbar: { classPropertyName: "freezeToolbar", publicName: "freezeToolbar", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { eventClicked: "eventClicked", eventDblClicked: "eventDblClicked", slotClicked: "slotClicked", dateChanged: "dateChanged" }, queries: [{ propertyName: "customViewTemplate", first: true, predicate: KitSchedulerCustomViewTemplateDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "weekEventTemplate", first: true, predicate: KitSchedulerWeekEventTemplateDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "monthEventTemplate", first: true, predicate: KitSchedulerMonthEventTemplateDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "agendaTimeTemplate", first: true, predicate: KitSchedulerAgendaTimeTemplateDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "headerCellTemplate", first: true, predicate: KitSchedulerMonthHeaderCellTemplateDirective, descendants: true, read: TemplateRef, isSignal: true }], viewQueries: [{ propertyName: "scheduler", first: true, predicate: ["scheduler"], descendants: true, isSignal: true }], ngImport: i0, template: "<kendo-scheduler #scheduler\n                 class=\"kit-scheduler\"\n                 [ngClass]=\"{ 'freeze-toolbar': freezeToolbar() }\"\n                 [events]=\"events()\"\n                 [selectedDate]=\"selectedDate()\"\n                 [allDaySlot]=\"false\"\n                 [showFooter]=\"false\"\n                 [slotFill]=\"1\"\n                 [min]=\"min()\"\n                 [max]=\"max()\"\n                 [timezone]=\"timezone()\"\n                 [loading]=\"loading()\"\n                 (eventClick)=\"onEventClick($event)\"\n                 (slotClick)=\"onSlotClick($event)\"\n                 (navigate)=\"onNavigate($event)\"\n                 (eventDblClick)=\"eventDblClicked.emit($event)\"\n                 (dateChange)=\"dateChanged.emit($event)\">\n  <ng-template kendoSchedulerToolbarTemplate\n               let-selectedDate=\"selectedDate\"\n               let-selectedView=\"selectedView\"\n               let-views=\"views\">\n    <kit-scheduler-toolbar class=\"kit-scheduler-toolbar\"\n                           [selectedDate]=\"selectedDate\"\n                           [selectedView]=\"selectedView\"\n                           [views]=\"views\"\n                           [viewModes]=\"viewModes()\"\n                           [showTimePill]=\"showTimePill()\"\n                           [selectedViewIndex]=\"scheduler.selectedViewIndex\"\n                           [showExportButton]=\"showExportButton()\"\n                           [isLoading]=\"loading()\"\n                           (exportPDF)=\"exportPDF()\">\n    </kit-scheduler-toolbar>\n    <ng-content select=\"[toolbar]\"></ng-content>\n  </ng-template>\n\n  <ng-template kendoSchedulerDateHeaderTemplate\n               let-date=\"date\">\n    <ng-container *ngTemplateOutlet=\"weekDayTemplate; context: { date }\"\n    ></ng-container>\n  </ng-template>\n\n  <ng-template kendoSchedulerMajorTimeHeaderTemplate\n               let-date=\"date\">\n    {{ date | date:'h a' }}\n  </ng-template>\n\n  <ng-template kendoSchedulerTimeSlotTemplate let-date=\"date\">\n    <div [class.selected]=\"weekCellIsSelected(date)\"></div>\n  </ng-template>\n\n  <ng-template kendoSchedulerMonthDaySlotTemplate\n               let-date=\"date\">\n    <div class=\"month-day\"\n         [class.selected]=\"monthCellIsSelected(date)\">\n      @if (headerCellTemplate(); as template) {\n        <ng-container *ngTemplateOutlet=\"template; context: { date }\"\n        ></ng-container>\n      } @else {\n        <ng-container *ngTemplateOutlet=\"weekDayTemplate; context: { date }\"\n        ></ng-container>\n      }\n\n      @if (monthEventTemplate(); as template) {\n        <div class=\"month-day-events\">\n          <ng-container *ngTemplateOutlet=\"template; context: { date, events: getEventsForDate(date, events()) }\"\n          ></ng-container>\n        </div>\n      }\n    </div>\n  </ng-template>\n\n  @if (weekEventTemplate(); as template) {\n    <ng-template kendoSchedulerEventTemplate\n                 let-event=\"event\">\n      <ng-container *ngTemplateOutlet=\"template; context: { event }\"\n      ></ng-container>\n    </ng-template>\n  }\n\n  <kendo-scheduler-month-view [eventHeight]=\"monthEventHeight()\"\n                              [eventsPerDay]=\"eventsPerDay()\"\n  ></kendo-scheduler-month-view>\n\n  @if (viewModes()['week']) {\n    <kendo-scheduler-week-view\n    ></kendo-scheduler-week-view>\n  }\n\n  @if (viewModes()['agenda']) {\n    @for (agendaView of viewModes()['agenda']; track agendaView.title) {\n      <kendo-scheduler-agenda-view [numberOfDays]=\"agendaView.numberOfDays\"\n      ></kendo-scheduler-agenda-view>\n    }\n  }\n\n  @if (agendaTimeTemplate(); as template) {\n    <ng-template kendoSchedulerAgendaTimeTemplate\n                 let-start=\"start\">\n      <ng-container *ngTemplateOutlet=\"template; context: { start }\"\n      ></ng-container>\n    </ng-template>\n  }\n\n  @if (viewModes()['day']) {\n    <kendo-scheduler-day-view\n    ></kendo-scheduler-day-view>\n  }\n\n  @if (viewModes()['timeline']) {\n    <kendo-scheduler-timeline-view\n    ></kendo-scheduler-timeline-view>\n  }\n\n  @if (viewModes()['custom']) {\n    @if (customViewTemplate(); as template) {\n      <ng-template [kendoSchedulerView]=\"viewModes()['custom']?.title\">\n        <ng-container *ngTemplateOutlet=\"template\"\n        ></ng-container>\n      </ng-template>\n    }\n  }\n\n  <kendo-scheduler-pdf [fileName]=\"exportedFileName()\"></kendo-scheduler-pdf>\n</kendo-scheduler>\n\n<ng-template #weekDayTemplate\n             let-date=\"date\">\n  <div class=\"week-day\">\n    <div class=\"week-day-name\">\n      {{ date | date:'EEE' }}\n    </div>\n    <div class=\"week-day-date\">\n      {{ date | date:'dd' }}\n    </div>\n  </div>\n</ng-template>\n", styles: [".kit-scheduler{display:flex;flex-direction:column;border:none;background:none}.kit-scheduler-toolbar{flex:1}.kit-scheduler.freeze-toolbar{height:100%}.kit-scheduler.freeze-toolbar ::ng-deep month-view{flex:1;overflow-y:auto}.kit-scheduler ::ng-deep .k-scheduler-toolbar{padding:0 0 34px;border:none}.kit-scheduler ::ng-deep .k-scheduler-toolbar:before{display:none}.kit-scheduler ::ng-deep .k-scheduler-cell:has(.selected){background:var(--ui-kit-color-blue-1)}.kit-scheduler ::ng-deep .k-scheduler-table{border-color:var(--ui-kit-color-grey-11)}.kit-scheduler ::ng-deep .k-scheduler-table .k-middle-row .k-scheduler-cell{border-bottom:1px solid var(--ui-kit-color-grey-13)}.kit-scheduler ::ng-deep .k-scheduler-times{border:none}.kit-scheduler ::ng-deep .k-scheduler-times .k-scheduler-cell{color:var(--ui-kit-color-grey-18);font-size:12px;font-weight:500;border:none;background:none;text-align:left}.kit-scheduler ::ng-deep .k-scheduler-cell{background:var(--ui-kit-color-white);cursor:pointer}.kit-scheduler ::ng-deep .week-day{display:flex;flex-direction:column;font-weight:500;text-align:left}.kit-scheduler ::ng-deep .week-day-name{color:var(--ui-kit-color-grey-18);font-size:10px;line-height:16px;text-transform:uppercase}.kit-scheduler ::ng-deep .week-day-date{color:var(--ui-kit-color-grey-10);font-size:21px;line-height:30px}.kit-scheduler ::ng-deep .month-day{display:flex;flex-direction:column;margin-top:6px}.kit-scheduler ::ng-deep .month-day-events{display:flex;flex-direction:column;gap:8px;flex:1}.kit-scheduler ::ng-deep .month-day-event{color:var(--ui-kit-color-white);font-size:14px;border-radius:4px;background:var(--ui-kit-color-main);text-align:left;cursor:pointer}.kit-scheduler ::ng-deep .month-day-event:nth-child(n+5){display:none}.kit-scheduler ::ng-deep .month-day-event.k-selected{background:var(--ui-kit-color-active);box-shadow:none}.kit-scheduler ::ng-deep .month-day-event:hover{background:var(--ui-kit-color-hover)}.kit-scheduler ::ng-deep .k-scheduler-monthview .k-scheduler-head{display:none}.kit-scheduler ::ng-deep .k-scheduler-monthview .k-other-month{background:var(--ui-kit-color-grey-13)}.kit-scheduler ::ng-deep .k-scheduler-monthview:has(.month-day-events) .k-event,.kit-scheduler ::ng-deep .k-scheduler-monthview:has(.month-day-events) .k-more-events{display:none}.kit-scheduler ::ng-deep .k-more-events{color:var(--ui-kit-color-grey-14);border:none;border-radius:4px;background:var(--ui-kit-color-grey-13)}.kit-scheduler ::ng-deep .k-more-events:hover{color:var(--ui-kit-color-main)}.kit-scheduler ::ng-deep .k-event{color:var(--ui-kit-color-white);font-size:14px;border-radius:4px;background:var(--ui-kit-color-main);cursor:pointer;box-sizing:content-box;padding-inline-end:0}.kit-scheduler ::ng-deep .k-event-template{padding:0}.kit-scheduler ::ng-deep .k-event.k-selected{background:var(--ui-kit-color-active);box-shadow:none}.kit-scheduler ::ng-deep .k-event:hover{background:var(--ui-kit-color-hover)}.kit-scheduler ::ng-deep .k-event-actions{display:none}.kit-scheduler ::ng-deep .k-current-time{display:none}.kit-scheduler ::ng-deep .k-scheduler-agendaview .k-scheduler-timecolumn{text-align:center}\n"], dependencies: [{ kind: "component", type: i1$e.SchedulerComponent, selector: "kendo-scheduler", inputs: ["selectedViewIndex", "editable", "selectable", "min", "max", "eventHeight", "columnWidth", "showWorkHours", "startTime", "endTime", "workDayStart", "workDayEnd", "workWeekStart", "workWeekEnd", "weekStart", "slotDuration", "slotDivisions", "slotFill", "allDaySlot", "scrollTime", "group", "resources", "loading", "timezone", "events", "selectedDate", "modelFields", "currentTimeMarker", "highlightOngoingEvents", "showToolbar", "showFooter", "slotClass", "eventClass", "eventStyles", "hiddenDays", "isSlotSelected"], outputs: ["selectedViewIndexChange", "navigate", "dateChange", "slotClick", "slotDblClick", "create", "eventClick", "eventDblClick", "eventKeydown", "cancel", "save", "remove", "resizeStart", "resize", "resizeEnd", "dragStart", "drag", "dragEnd", "slotDragStart", "slotDrag", "slotDragEnd", "pdfExport", "schedulerResize"] }, { kind: "directive", type: i1$e.SchedulerViewDirective, selector: "[kendoSchedulerView]", inputs: ["kendoSchedulerView", "kendoSchedulerViewName"] }, { kind: "component", type: i1$e.PDFComponent, selector: "kendo-scheduler-pdf", inputs: ["author", "avoidLinks", "creator", "date", "imageResolution", "fileName", "forceProxy", "keywords", "margin", "scale", "proxyData", "proxyURL", "proxyTarget", "producer", "subject", "title"] }, { kind: "directive", type: i1$e.ShortcutsDirective, selector: "kendo-scheduler" }, { kind: "component", type: i1$e.AgendaViewComponent, selector: "kendo-scheduler-agenda-view", inputs: ["selectedDateFormat", "selectedShortDateFormat", "numberOfDays"] }, { kind: "component", type: i1$e.DayViewComponent, selector: "kendo-scheduler-day-view", inputs: ["selectedDateFormat", "selectedShortDateFormat"] }, { kind: "component", type: i1$e.MonthViewComponent, selector: "kendo-scheduler-month-view", inputs: ["eventsPerDay", "eventHeight", "adaptiveSlotHeight", "selectedDateFormat", "selectedShortDateFormat"], outputs: ["moreEventsClick"] }, { kind: "component", type: i1$e.TimelineViewComponent, selector: "kendo-scheduler-timeline-view", inputs: ["selectedDateFormat", "selectedShortDateFormat", "numberOfDays"] }, { kind: "component", type: i1$e.WeekViewComponent, selector: "kendo-scheduler-week-view", inputs: ["selectedDateFormat", "selectedShortDateFormat"] }, { kind: "directive", type: i1$e.ToolbarTemplateDirective, selector: "[kendoSchedulerToolbarTemplate]" }, { kind: "directive", type: i1$e.AgendaTimeTemplateDirective, selector: "[kendoSchedulerAgendaTimeTemplate]" }, { kind: "directive", type: i1$e.DateHeaderTemplateDirective, selector: "[kendoSchedulerDateHeaderTemplate]" }, { kind: "directive", type: i1$e.EventTemplateDirective, selector: "[kendoSchedulerEventTemplate]" }, { kind: "directive", type: i1$e.MajorTimeHeaderTemplateDirective, selector: "[kendoSchedulerMajorTimeHeaderTemplate]" }, { kind: "directive", type: i1$e.MonthDaySlotTemplateDirective, selector: "[kendoSchedulerMonthDaySlotTemplate]" }, { kind: "directive", type: i1$e.TimeSlotTemplateDirective, selector: "[kendoSchedulerTimeSlotTemplate]" }, { kind: "component", type: KitSchedulerToolbarComponent, selector: "kit-scheduler-toolbar", inputs: ["selectedDate", "selectedView", "showTimePill", "views", "viewModes", "selectedViewIndex", "showExportButton", "isLoading"], outputs: ["exportPDF"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: KitSchedulerComponent, isStandalone: true, selector: "kit-scheduler", inputs: { events: { classPropertyName: "events", publicName: "events", isSignal: true, isRequired: false, transformFunction: null }, selectedDate: { classPropertyName: "selectedDate", publicName: "selectedDate", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, timezone: { classPropertyName: "timezone", publicName: "timezone", isSignal: true, isRequired: false, transformFunction: null }, viewModes: { classPropertyName: "viewModes", publicName: "viewModes", isSignal: true, isRequired: false, transformFunction: null }, showTimePill: { classPropertyName: "showTimePill", publicName: "showTimePill", isSignal: true, isRequired: false, transformFunction: null }, monthEventHeight: { classPropertyName: "monthEventHeight", publicName: "monthEventHeight", isSignal: true, isRequired: false, transformFunction: null }, eventsPerDay: { classPropertyName: "eventsPerDay", publicName: "eventsPerDay", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, exportedFileName: { classPropertyName: "exportedFileName", publicName: "exportedFileName", isSignal: true, isRequired: false, transformFunction: null }, showExportButton: { classPropertyName: "showExportButton", publicName: "showExportButton", isSignal: true, isRequired: false, transformFunction: null }, freezeToolbar: { classPropertyName: "freezeToolbar", publicName: "freezeToolbar", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { eventClicked: "eventClicked", eventDblClicked: "eventDblClicked", slotClicked: "slotClicked", dateChanged: "dateChanged" }, queries: [{ propertyName: "customViewTemplate", first: true, predicate: KitSchedulerCustomViewTemplateDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "weekEventTemplate", first: true, predicate: KitSchedulerWeekEventTemplateDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "monthEventTemplate", first: true, predicate: KitSchedulerMonthEventTemplateDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "agendaTimeTemplate", first: true, predicate: KitSchedulerAgendaTimeTemplateDirective, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "headerCellTemplate", first: true, predicate: KitSchedulerMonthHeaderCellTemplateDirective, descendants: true, read: TemplateRef, isSignal: true }], viewQueries: [{ propertyName: "scheduler", first: true, predicate: ["scheduler"], descendants: true, isSignal: true }], ngImport: i0, template: "<kendo-scheduler #scheduler\n                 class=\"kit-scheduler\"\n                 [ngClass]=\"{ 'freeze-toolbar': freezeToolbar() }\"\n                 [events]=\"events()\"\n                 [selectedDate]=\"selectedDate()\"\n                 [allDaySlot]=\"false\"\n                 [showFooter]=\"false\"\n                 [slotFill]=\"1\"\n                 [min]=\"min()\"\n                 [max]=\"max()\"\n                 [timezone]=\"timezone()\"\n                 [loading]=\"loading()\"\n                 [slotClass]=\"getSlotClass.bind(this)\"\n                 (eventClick)=\"onEventClick($event)\"\n                 (slotClick)=\"onSlotClick($event)\"\n                 (navigate)=\"onNavigate($event)\"\n                 (eventDblClick)=\"eventDblClicked.emit($event)\"\n                 (dateChange)=\"dateChanged.emit($event)\">\n  <ng-template kendoSchedulerToolbarTemplate\n               let-selectedDate=\"selectedDate\"\n               let-selectedView=\"selectedView\"\n               let-views=\"views\">\n    <kit-scheduler-toolbar class=\"kit-scheduler-toolbar\"\n                           [selectedDate]=\"selectedDate\"\n                           [selectedView]=\"selectedView\"\n                           [views]=\"views\"\n                           [viewModes]=\"viewModes()\"\n                           [showTimePill]=\"showTimePill()\"\n                           [selectedViewIndex]=\"scheduler.selectedViewIndex\"\n                           [showExportButton]=\"showExportButton()\"\n                           [isLoading]=\"loading()\"\n                           (exportPDF)=\"exportPDF()\">\n    </kit-scheduler-toolbar>\n    <ng-content select=\"[toolbar]\"></ng-content>\n  </ng-template>\n\n  <ng-template kendoSchedulerDateHeaderTemplate\n               let-date=\"date\">\n    <ng-container *ngTemplateOutlet=\"weekDayTemplate; context: { date }\"\n    ></ng-container>\n  </ng-template>\n\n  <ng-template kendoSchedulerMajorTimeHeaderTemplate\n               let-date=\"date\">\n    {{ date | date:'h a' }}\n  </ng-template>\n\n  <ng-template kendoSchedulerTimeSlotTemplate let-date=\"date\">\n    <div [class.selected]=\"weekCellIsSelected(date)\"></div>\n  </ng-template>\n\n  <ng-template kendoSchedulerMonthDaySlotTemplate\n               let-date=\"date\">\n    <div class=\"month-day\"\n         [class.selected]=\"monthCellIsSelected(date)\">\n      @if (headerCellTemplate(); as template) {\n        <ng-container *ngTemplateOutlet=\"template; context: { date }\"\n        ></ng-container>\n      } @else {\n        <ng-container *ngTemplateOutlet=\"weekDayTemplate; context: { date }\"\n        ></ng-container>\n      }\n\n      @if (monthEventTemplate(); as template) {\n        <div class=\"month-day-events\">\n          <ng-container *ngTemplateOutlet=\"template; context: { date, events: getEventsForDate(date, events()) }\"\n          ></ng-container>\n        </div>\n      }\n    </div>\n  </ng-template>\n\n  @if (weekEventTemplate(); as template) {\n    <ng-template kendoSchedulerEventTemplate\n                 let-event=\"event\">\n      <ng-container *ngTemplateOutlet=\"template; context: { event }\"\n      ></ng-container>\n    </ng-template>\n  }\n\n  <kendo-scheduler-month-view [eventHeight]=\"monthEventHeight()\"\n                              [eventsPerDay]=\"eventsPerDay()\"\n  ></kendo-scheduler-month-view>\n\n  @if (viewModes()['week']) {\n    <kendo-scheduler-week-view\n    ></kendo-scheduler-week-view>\n  }\n\n  @if (viewModes()['agenda']) {\n    @for (agendaView of viewModes()['agenda']; track agendaView.title) {\n      <kendo-scheduler-agenda-view [numberOfDays]=\"agendaView.numberOfDays\"\n      ></kendo-scheduler-agenda-view>\n    }\n  }\n\n  @if (agendaTimeTemplate(); as template) {\n    <ng-template kendoSchedulerAgendaTimeTemplate\n                 let-start=\"start\">\n      <ng-container *ngTemplateOutlet=\"template; context: { start }\"\n      ></ng-container>\n    </ng-template>\n  }\n\n  @if (viewModes()['day']) {\n    <kendo-scheduler-day-view\n    ></kendo-scheduler-day-view>\n  }\n\n  @if (viewModes()['timeline']) {\n    <kendo-scheduler-timeline-view\n    ></kendo-scheduler-timeline-view>\n  }\n\n  @if (viewModes()['custom']) {\n    @if (customViewTemplate(); as template) {\n      <ng-template [kendoSchedulerView]=\"viewModes()['custom']?.title\">\n        <ng-container *ngTemplateOutlet=\"template\"\n        ></ng-container>\n      </ng-template>\n    }\n  }\n\n  <kendo-scheduler-pdf [fileName]=\"exportedFileName()\"></kendo-scheduler-pdf>\n</kendo-scheduler>\n\n<ng-template #weekDayTemplate\n             let-date=\"date\">\n  <div class=\"week-day\">\n    <div class=\"week-day-name\">\n      {{ date | date:'EEE' }}\n    </div>\n    <div class=\"week-day-date\">\n      {{ date | date:'dd' }}\n    </div>\n  </div>\n</ng-template>\n", styles: [".kit-scheduler{display:flex;flex-direction:column;border:none;background:none}.kit-scheduler-toolbar{flex:1}.kit-scheduler.freeze-toolbar{height:100%}.kit-scheduler.freeze-toolbar ::ng-deep month-view{flex:1;overflow-y:auto}.kit-scheduler ::ng-deep .k-scheduler-toolbar{padding:0 0 34px;border:none}.kit-scheduler ::ng-deep .k-scheduler-toolbar:before{display:none}.kit-scheduler ::ng-deep .k-scheduler-agendaview .k-scheduler-table tr:has(.highlightDate) .k-scheduler-cell{background-color:var(--ui-kit-color-background);border-color:var(--kendo-color-border, rgba(0, 0, 0, .08))}.kit-scheduler ::ng-deep .k-scheduler-cell.highlightDate{background-color:var(--ui-kit-color-background)}.kit-scheduler ::ng-deep .k-scheduler-cell:has(.selected){background:var(--ui-kit-color-blue-1)}.kit-scheduler ::ng-deep .k-scheduler-table{border-color:var(--ui-kit-color-grey-11)}.kit-scheduler ::ng-deep .k-scheduler-table .k-middle-row .k-scheduler-cell{border-bottom:1px solid var(--ui-kit-color-grey-13)}.kit-scheduler ::ng-deep .k-scheduler-times{border:none}.kit-scheduler ::ng-deep .k-scheduler-times .k-scheduler-cell{color:var(--ui-kit-color-grey-18);font-size:12px;font-weight:500;border:none;background:none;text-align:left}.kit-scheduler ::ng-deep .k-scheduler-cell{background:var(--ui-kit-color-white);cursor:pointer}.kit-scheduler ::ng-deep .week-day{display:flex;flex-direction:column;font-weight:500;text-align:left}.kit-scheduler ::ng-deep .week-day-name{color:var(--ui-kit-color-grey-18);font-size:10px;line-height:16px;text-transform:uppercase}.kit-scheduler ::ng-deep .week-day-date{color:var(--ui-kit-color-grey-10);font-size:21px;line-height:30px}.kit-scheduler ::ng-deep .month-day{display:flex;flex-direction:column;margin-top:6px}.kit-scheduler ::ng-deep .month-day-events{display:flex;flex-direction:column;gap:8px;flex:1}.kit-scheduler ::ng-deep .month-day-event{color:var(--ui-kit-color-white);font-size:14px;border-radius:4px;background:var(--ui-kit-color-main);text-align:left;cursor:pointer}.kit-scheduler ::ng-deep .month-day-event:nth-child(n+5){display:none}.kit-scheduler ::ng-deep .month-day-event.k-selected{background:var(--ui-kit-color-active);box-shadow:none}.kit-scheduler ::ng-deep .month-day-event:hover{background:var(--ui-kit-color-hover)}.kit-scheduler ::ng-deep .k-scheduler-monthview .k-scheduler-head{display:none}.kit-scheduler ::ng-deep .k-scheduler-monthview .k-other-month{background:var(--ui-kit-color-grey-13)}.kit-scheduler ::ng-deep .k-scheduler-monthview:has(.month-day-events) .k-event,.kit-scheduler ::ng-deep .k-scheduler-monthview:has(.month-day-events) .k-more-events{display:none}.kit-scheduler ::ng-deep .k-more-events{color:var(--ui-kit-color-grey-14);border:none;border-radius:4px;background:var(--ui-kit-color-grey-13)}.kit-scheduler ::ng-deep .k-more-events:hover{color:var(--ui-kit-color-main)}.kit-scheduler ::ng-deep .k-event{color:var(--ui-kit-color-white);font-size:14px;border-radius:4px;background:var(--ui-kit-color-main);cursor:pointer;box-sizing:content-box;padding-inline-end:0}.kit-scheduler ::ng-deep .k-event-template{padding:0}.kit-scheduler ::ng-deep .k-event.k-selected{background:var(--ui-kit-color-active);box-shadow:none}.kit-scheduler ::ng-deep .k-event:hover{background:var(--ui-kit-color-hover)}.kit-scheduler ::ng-deep .k-event-actions{display:none}.kit-scheduler ::ng-deep .k-current-time{display:none}.kit-scheduler ::ng-deep .k-scheduler-agendaview .k-scheduler-timecolumn{text-align:center}\n"], dependencies: [{ kind: "component", type: i1$e.SchedulerComponent, selector: "kendo-scheduler", inputs: ["selectedViewIndex", "editable", "selectable", "min", "max", "eventHeight", "columnWidth", "showWorkHours", "startTime", "endTime", "workDayStart", "workDayEnd", "workWeekStart", "workWeekEnd", "weekStart", "slotDuration", "slotDivisions", "slotFill", "allDaySlot", "scrollTime", "group", "resources", "loading", "timezone", "events", "selectedDate", "modelFields", "currentTimeMarker", "highlightOngoingEvents", "showToolbar", "showFooter", "slotClass", "eventClass", "eventStyles", "hiddenDays", "isSlotSelected"], outputs: ["selectedViewIndexChange", "navigate", "dateChange", "slotClick", "slotDblClick", "create", "eventClick", "eventDblClick", "eventKeydown", "cancel", "save", "remove", "resizeStart", "resize", "resizeEnd", "dragStart", "drag", "dragEnd", "slotDragStart", "slotDrag", "slotDragEnd", "pdfExport", "schedulerResize"] }, { kind: "directive", type: i1$e.SchedulerViewDirective, selector: "[kendoSchedulerView]", inputs: ["kendoSchedulerView", "kendoSchedulerViewName"] }, { kind: "component", type: i1$e.PDFComponent, selector: "kendo-scheduler-pdf", inputs: ["author", "avoidLinks", "creator", "date", "imageResolution", "fileName", "forceProxy", "keywords", "margin", "scale", "proxyData", "proxyURL", "proxyTarget", "producer", "subject", "title"] }, { kind: "directive", type: i1$e.ShortcutsDirective, selector: "kendo-scheduler" }, { kind: "component", type: i1$e.AgendaViewComponent, selector: "kendo-scheduler-agenda-view", inputs: ["selectedDateFormat", "selectedShortDateFormat", "numberOfDays"] }, { kind: "component", type: i1$e.DayViewComponent, selector: "kendo-scheduler-day-view", inputs: ["selectedDateFormat", "selectedShortDateFormat"] }, { kind: "component", type: i1$e.MonthViewComponent, selector: "kendo-scheduler-month-view", inputs: ["eventsPerDay", "eventHeight", "adaptiveSlotHeight", "selectedDateFormat", "selectedShortDateFormat"], outputs: ["moreEventsClick"] }, { kind: "component", type: i1$e.TimelineViewComponent, selector: "kendo-scheduler-timeline-view", inputs: ["selectedDateFormat", "selectedShortDateFormat", "numberOfDays"] }, { kind: "component", type: i1$e.WeekViewComponent, selector: "kendo-scheduler-week-view", inputs: ["selectedDateFormat", "selectedShortDateFormat"] }, { kind: "directive", type: i1$e.ToolbarTemplateDirective, selector: "[kendoSchedulerToolbarTemplate]" }, { kind: "directive", type: i1$e.AgendaTimeTemplateDirective, selector: "[kendoSchedulerAgendaTimeTemplate]" }, { kind: "directive", type: i1$e.DateHeaderTemplateDirective, selector: "[kendoSchedulerDateHeaderTemplate]" }, { kind: "directive", type: i1$e.EventTemplateDirective, selector: "[kendoSchedulerEventTemplate]" }, { kind: "directive", type: i1$e.MajorTimeHeaderTemplateDirective, selector: "[kendoSchedulerMajorTimeHeaderTemplate]" }, { kind: "directive", type: i1$e.MonthDaySlotTemplateDirective, selector: "[kendoSchedulerMonthDaySlotTemplate]" }, { kind: "directive", type: i1$e.TimeSlotTemplateDirective, selector: "[kendoSchedulerTimeSlotTemplate]" }, { kind: "component", type: KitSchedulerToolbarComponent, selector: "kit-scheduler-toolbar", inputs: ["selectedDate", "selectedView", "showTimePill", "views", "viewModes", "selectedViewIndex", "showExportButton", "isLoading"], outputs: ["exportPDF"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: KitSchedulerComponent, decorators: [{
             type: Component,
@@ -10214,7 +10224,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImpor
                         DatePipe,
                         NgTemplateOutlet,
                         NgClass,
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<kendo-scheduler #scheduler\n                 class=\"kit-scheduler\"\n                 [ngClass]=\"{ 'freeze-toolbar': freezeToolbar() }\"\n                 [events]=\"events()\"\n                 [selectedDate]=\"selectedDate()\"\n                 [allDaySlot]=\"false\"\n                 [showFooter]=\"false\"\n                 [slotFill]=\"1\"\n                 [min]=\"min()\"\n                 [max]=\"max()\"\n                 [timezone]=\"timezone()\"\n                 [loading]=\"loading()\"\n                 (eventClick)=\"onEventClick($event)\"\n                 (slotClick)=\"onSlotClick($event)\"\n                 (navigate)=\"onNavigate($event)\"\n                 (eventDblClick)=\"eventDblClicked.emit($event)\"\n                 (dateChange)=\"dateChanged.emit($event)\">\n  <ng-template kendoSchedulerToolbarTemplate\n               let-selectedDate=\"selectedDate\"\n               let-selectedView=\"selectedView\"\n               let-views=\"views\">\n    <kit-scheduler-toolbar class=\"kit-scheduler-toolbar\"\n                           [selectedDate]=\"selectedDate\"\n                           [selectedView]=\"selectedView\"\n                           [views]=\"views\"\n                           [viewModes]=\"viewModes()\"\n                           [showTimePill]=\"showTimePill()\"\n                           [selectedViewIndex]=\"scheduler.selectedViewIndex\"\n                           [showExportButton]=\"showExportButton()\"\n                           [isLoading]=\"loading()\"\n                           (exportPDF)=\"exportPDF()\">\n    </kit-scheduler-toolbar>\n    <ng-content select=\"[toolbar]\"></ng-content>\n  </ng-template>\n\n  <ng-template kendoSchedulerDateHeaderTemplate\n               let-date=\"date\">\n    <ng-container *ngTemplateOutlet=\"weekDayTemplate; context: { date }\"\n    ></ng-container>\n  </ng-template>\n\n  <ng-template kendoSchedulerMajorTimeHeaderTemplate\n               let-date=\"date\">\n    {{ date | date:'h a' }}\n  </ng-template>\n\n  <ng-template kendoSchedulerTimeSlotTemplate let-date=\"date\">\n    <div [class.selected]=\"weekCellIsSelected(date)\"></div>\n  </ng-template>\n\n  <ng-template kendoSchedulerMonthDaySlotTemplate\n               let-date=\"date\">\n    <div class=\"month-day\"\n         [class.selected]=\"monthCellIsSelected(date)\">\n      @if (headerCellTemplate(); as template) {\n        <ng-container *ngTemplateOutlet=\"template; context: { date }\"\n        ></ng-container>\n      } @else {\n        <ng-container *ngTemplateOutlet=\"weekDayTemplate; context: { date }\"\n        ></ng-container>\n      }\n\n      @if (monthEventTemplate(); as template) {\n        <div class=\"month-day-events\">\n          <ng-container *ngTemplateOutlet=\"template; context: { date, events: getEventsForDate(date, events()) }\"\n          ></ng-container>\n        </div>\n      }\n    </div>\n  </ng-template>\n\n  @if (weekEventTemplate(); as template) {\n    <ng-template kendoSchedulerEventTemplate\n                 let-event=\"event\">\n      <ng-container *ngTemplateOutlet=\"template; context: { event }\"\n      ></ng-container>\n    </ng-template>\n  }\n\n  <kendo-scheduler-month-view [eventHeight]=\"monthEventHeight()\"\n                              [eventsPerDay]=\"eventsPerDay()\"\n  ></kendo-scheduler-month-view>\n\n  @if (viewModes()['week']) {\n    <kendo-scheduler-week-view\n    ></kendo-scheduler-week-view>\n  }\n\n  @if (viewModes()['agenda']) {\n    @for (agendaView of viewModes()['agenda']; track agendaView.title) {\n      <kendo-scheduler-agenda-view [numberOfDays]=\"agendaView.numberOfDays\"\n      ></kendo-scheduler-agenda-view>\n    }\n  }\n\n  @if (agendaTimeTemplate(); as template) {\n    <ng-template kendoSchedulerAgendaTimeTemplate\n                 let-start=\"start\">\n      <ng-container *ngTemplateOutlet=\"template; context: { start }\"\n      ></ng-container>\n    </ng-template>\n  }\n\n  @if (viewModes()['day']) {\n    <kendo-scheduler-day-view\n    ></kendo-scheduler-day-view>\n  }\n\n  @if (viewModes()['timeline']) {\n    <kendo-scheduler-timeline-view\n    ></kendo-scheduler-timeline-view>\n  }\n\n  @if (viewModes()['custom']) {\n    @if (customViewTemplate(); as template) {\n      <ng-template [kendoSchedulerView]=\"viewModes()['custom']?.title\">\n        <ng-container *ngTemplateOutlet=\"template\"\n        ></ng-container>\n      </ng-template>\n    }\n  }\n\n  <kendo-scheduler-pdf [fileName]=\"exportedFileName()\"></kendo-scheduler-pdf>\n</kendo-scheduler>\n\n<ng-template #weekDayTemplate\n             let-date=\"date\">\n  <div class=\"week-day\">\n    <div class=\"week-day-name\">\n      {{ date | date:'EEE' }}\n    </div>\n    <div class=\"week-day-date\">\n      {{ date | date:'dd' }}\n    </div>\n  </div>\n</ng-template>\n", styles: [".kit-scheduler{display:flex;flex-direction:column;border:none;background:none}.kit-scheduler-toolbar{flex:1}.kit-scheduler.freeze-toolbar{height:100%}.kit-scheduler.freeze-toolbar ::ng-deep month-view{flex:1;overflow-y:auto}.kit-scheduler ::ng-deep .k-scheduler-toolbar{padding:0 0 34px;border:none}.kit-scheduler ::ng-deep .k-scheduler-toolbar:before{display:none}.kit-scheduler ::ng-deep .k-scheduler-cell:has(.selected){background:var(--ui-kit-color-blue-1)}.kit-scheduler ::ng-deep .k-scheduler-table{border-color:var(--ui-kit-color-grey-11)}.kit-scheduler ::ng-deep .k-scheduler-table .k-middle-row .k-scheduler-cell{border-bottom:1px solid var(--ui-kit-color-grey-13)}.kit-scheduler ::ng-deep .k-scheduler-times{border:none}.kit-scheduler ::ng-deep .k-scheduler-times .k-scheduler-cell{color:var(--ui-kit-color-grey-18);font-size:12px;font-weight:500;border:none;background:none;text-align:left}.kit-scheduler ::ng-deep .k-scheduler-cell{background:var(--ui-kit-color-white);cursor:pointer}.kit-scheduler ::ng-deep .week-day{display:flex;flex-direction:column;font-weight:500;text-align:left}.kit-scheduler ::ng-deep .week-day-name{color:var(--ui-kit-color-grey-18);font-size:10px;line-height:16px;text-transform:uppercase}.kit-scheduler ::ng-deep .week-day-date{color:var(--ui-kit-color-grey-10);font-size:21px;line-height:30px}.kit-scheduler ::ng-deep .month-day{display:flex;flex-direction:column;margin-top:6px}.kit-scheduler ::ng-deep .month-day-events{display:flex;flex-direction:column;gap:8px;flex:1}.kit-scheduler ::ng-deep .month-day-event{color:var(--ui-kit-color-white);font-size:14px;border-radius:4px;background:var(--ui-kit-color-main);text-align:left;cursor:pointer}.kit-scheduler ::ng-deep .month-day-event:nth-child(n+5){display:none}.kit-scheduler ::ng-deep .month-day-event.k-selected{background:var(--ui-kit-color-active);box-shadow:none}.kit-scheduler ::ng-deep .month-day-event:hover{background:var(--ui-kit-color-hover)}.kit-scheduler ::ng-deep .k-scheduler-monthview .k-scheduler-head{display:none}.kit-scheduler ::ng-deep .k-scheduler-monthview .k-other-month{background:var(--ui-kit-color-grey-13)}.kit-scheduler ::ng-deep .k-scheduler-monthview:has(.month-day-events) .k-event,.kit-scheduler ::ng-deep .k-scheduler-monthview:has(.month-day-events) .k-more-events{display:none}.kit-scheduler ::ng-deep .k-more-events{color:var(--ui-kit-color-grey-14);border:none;border-radius:4px;background:var(--ui-kit-color-grey-13)}.kit-scheduler ::ng-deep .k-more-events:hover{color:var(--ui-kit-color-main)}.kit-scheduler ::ng-deep .k-event{color:var(--ui-kit-color-white);font-size:14px;border-radius:4px;background:var(--ui-kit-color-main);cursor:pointer;box-sizing:content-box;padding-inline-end:0}.kit-scheduler ::ng-deep .k-event-template{padding:0}.kit-scheduler ::ng-deep .k-event.k-selected{background:var(--ui-kit-color-active);box-shadow:none}.kit-scheduler ::ng-deep .k-event:hover{background:var(--ui-kit-color-hover)}.kit-scheduler ::ng-deep .k-event-actions{display:none}.kit-scheduler ::ng-deep .k-current-time{display:none}.kit-scheduler ::ng-deep .k-scheduler-agendaview .k-scheduler-timecolumn{text-align:center}\n"] }]
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<kendo-scheduler #scheduler\n                 class=\"kit-scheduler\"\n                 [ngClass]=\"{ 'freeze-toolbar': freezeToolbar() }\"\n                 [events]=\"events()\"\n                 [selectedDate]=\"selectedDate()\"\n                 [allDaySlot]=\"false\"\n                 [showFooter]=\"false\"\n                 [slotFill]=\"1\"\n                 [min]=\"min()\"\n                 [max]=\"max()\"\n                 [timezone]=\"timezone()\"\n                 [loading]=\"loading()\"\n                 [slotClass]=\"getSlotClass.bind(this)\"\n                 (eventClick)=\"onEventClick($event)\"\n                 (slotClick)=\"onSlotClick($event)\"\n                 (navigate)=\"onNavigate($event)\"\n                 (eventDblClick)=\"eventDblClicked.emit($event)\"\n                 (dateChange)=\"dateChanged.emit($event)\">\n  <ng-template kendoSchedulerToolbarTemplate\n               let-selectedDate=\"selectedDate\"\n               let-selectedView=\"selectedView\"\n               let-views=\"views\">\n    <kit-scheduler-toolbar class=\"kit-scheduler-toolbar\"\n                           [selectedDate]=\"selectedDate\"\n                           [selectedView]=\"selectedView\"\n                           [views]=\"views\"\n                           [viewModes]=\"viewModes()\"\n                           [showTimePill]=\"showTimePill()\"\n                           [selectedViewIndex]=\"scheduler.selectedViewIndex\"\n                           [showExportButton]=\"showExportButton()\"\n                           [isLoading]=\"loading()\"\n                           (exportPDF)=\"exportPDF()\">\n    </kit-scheduler-toolbar>\n    <ng-content select=\"[toolbar]\"></ng-content>\n  </ng-template>\n\n  <ng-template kendoSchedulerDateHeaderTemplate\n               let-date=\"date\">\n    <ng-container *ngTemplateOutlet=\"weekDayTemplate; context: { date }\"\n    ></ng-container>\n  </ng-template>\n\n  <ng-template kendoSchedulerMajorTimeHeaderTemplate\n               let-date=\"date\">\n    {{ date | date:'h a' }}\n  </ng-template>\n\n  <ng-template kendoSchedulerTimeSlotTemplate let-date=\"date\">\n    <div [class.selected]=\"weekCellIsSelected(date)\"></div>\n  </ng-template>\n\n  <ng-template kendoSchedulerMonthDaySlotTemplate\n               let-date=\"date\">\n    <div class=\"month-day\"\n         [class.selected]=\"monthCellIsSelected(date)\">\n      @if (headerCellTemplate(); as template) {\n        <ng-container *ngTemplateOutlet=\"template; context: { date }\"\n        ></ng-container>\n      } @else {\n        <ng-container *ngTemplateOutlet=\"weekDayTemplate; context: { date }\"\n        ></ng-container>\n      }\n\n      @if (monthEventTemplate(); as template) {\n        <div class=\"month-day-events\">\n          <ng-container *ngTemplateOutlet=\"template; context: { date, events: getEventsForDate(date, events()) }\"\n          ></ng-container>\n        </div>\n      }\n    </div>\n  </ng-template>\n\n  @if (weekEventTemplate(); as template) {\n    <ng-template kendoSchedulerEventTemplate\n                 let-event=\"event\">\n      <ng-container *ngTemplateOutlet=\"template; context: { event }\"\n      ></ng-container>\n    </ng-template>\n  }\n\n  <kendo-scheduler-month-view [eventHeight]=\"monthEventHeight()\"\n                              [eventsPerDay]=\"eventsPerDay()\"\n  ></kendo-scheduler-month-view>\n\n  @if (viewModes()['week']) {\n    <kendo-scheduler-week-view\n    ></kendo-scheduler-week-view>\n  }\n\n  @if (viewModes()['agenda']) {\n    @for (agendaView of viewModes()['agenda']; track agendaView.title) {\n      <kendo-scheduler-agenda-view [numberOfDays]=\"agendaView.numberOfDays\"\n      ></kendo-scheduler-agenda-view>\n    }\n  }\n\n  @if (agendaTimeTemplate(); as template) {\n    <ng-template kendoSchedulerAgendaTimeTemplate\n                 let-start=\"start\">\n      <ng-container *ngTemplateOutlet=\"template; context: { start }\"\n      ></ng-container>\n    </ng-template>\n  }\n\n  @if (viewModes()['day']) {\n    <kendo-scheduler-day-view\n    ></kendo-scheduler-day-view>\n  }\n\n  @if (viewModes()['timeline']) {\n    <kendo-scheduler-timeline-view\n    ></kendo-scheduler-timeline-view>\n  }\n\n  @if (viewModes()['custom']) {\n    @if (customViewTemplate(); as template) {\n      <ng-template [kendoSchedulerView]=\"viewModes()['custom']?.title\">\n        <ng-container *ngTemplateOutlet=\"template\"\n        ></ng-container>\n      </ng-template>\n    }\n  }\n\n  <kendo-scheduler-pdf [fileName]=\"exportedFileName()\"></kendo-scheduler-pdf>\n</kendo-scheduler>\n\n<ng-template #weekDayTemplate\n             let-date=\"date\">\n  <div class=\"week-day\">\n    <div class=\"week-day-name\">\n      {{ date | date:'EEE' }}\n    </div>\n    <div class=\"week-day-date\">\n      {{ date | date:'dd' }}\n    </div>\n  </div>\n</ng-template>\n", styles: [".kit-scheduler{display:flex;flex-direction:column;border:none;background:none}.kit-scheduler-toolbar{flex:1}.kit-scheduler.freeze-toolbar{height:100%}.kit-scheduler.freeze-toolbar ::ng-deep month-view{flex:1;overflow-y:auto}.kit-scheduler ::ng-deep .k-scheduler-toolbar{padding:0 0 34px;border:none}.kit-scheduler ::ng-deep .k-scheduler-toolbar:before{display:none}.kit-scheduler ::ng-deep .k-scheduler-agendaview .k-scheduler-table tr:has(.highlightDate) .k-scheduler-cell{background-color:var(--ui-kit-color-background);border-color:var(--kendo-color-border, rgba(0, 0, 0, .08))}.kit-scheduler ::ng-deep .k-scheduler-cell.highlightDate{background-color:var(--ui-kit-color-background)}.kit-scheduler ::ng-deep .k-scheduler-cell:has(.selected){background:var(--ui-kit-color-blue-1)}.kit-scheduler ::ng-deep .k-scheduler-table{border-color:var(--ui-kit-color-grey-11)}.kit-scheduler ::ng-deep .k-scheduler-table .k-middle-row .k-scheduler-cell{border-bottom:1px solid var(--ui-kit-color-grey-13)}.kit-scheduler ::ng-deep .k-scheduler-times{border:none}.kit-scheduler ::ng-deep .k-scheduler-times .k-scheduler-cell{color:var(--ui-kit-color-grey-18);font-size:12px;font-weight:500;border:none;background:none;text-align:left}.kit-scheduler ::ng-deep .k-scheduler-cell{background:var(--ui-kit-color-white);cursor:pointer}.kit-scheduler ::ng-deep .week-day{display:flex;flex-direction:column;font-weight:500;text-align:left}.kit-scheduler ::ng-deep .week-day-name{color:var(--ui-kit-color-grey-18);font-size:10px;line-height:16px;text-transform:uppercase}.kit-scheduler ::ng-deep .week-day-date{color:var(--ui-kit-color-grey-10);font-size:21px;line-height:30px}.kit-scheduler ::ng-deep .month-day{display:flex;flex-direction:column;margin-top:6px}.kit-scheduler ::ng-deep .month-day-events{display:flex;flex-direction:column;gap:8px;flex:1}.kit-scheduler ::ng-deep .month-day-event{color:var(--ui-kit-color-white);font-size:14px;border-radius:4px;background:var(--ui-kit-color-main);text-align:left;cursor:pointer}.kit-scheduler ::ng-deep .month-day-event:nth-child(n+5){display:none}.kit-scheduler ::ng-deep .month-day-event.k-selected{background:var(--ui-kit-color-active);box-shadow:none}.kit-scheduler ::ng-deep .month-day-event:hover{background:var(--ui-kit-color-hover)}.kit-scheduler ::ng-deep .k-scheduler-monthview .k-scheduler-head{display:none}.kit-scheduler ::ng-deep .k-scheduler-monthview .k-other-month{background:var(--ui-kit-color-grey-13)}.kit-scheduler ::ng-deep .k-scheduler-monthview:has(.month-day-events) .k-event,.kit-scheduler ::ng-deep .k-scheduler-monthview:has(.month-day-events) .k-more-events{display:none}.kit-scheduler ::ng-deep .k-more-events{color:var(--ui-kit-color-grey-14);border:none;border-radius:4px;background:var(--ui-kit-color-grey-13)}.kit-scheduler ::ng-deep .k-more-events:hover{color:var(--ui-kit-color-main)}.kit-scheduler ::ng-deep .k-event{color:var(--ui-kit-color-white);font-size:14px;border-radius:4px;background:var(--ui-kit-color-main);cursor:pointer;box-sizing:content-box;padding-inline-end:0}.kit-scheduler ::ng-deep .k-event-template{padding:0}.kit-scheduler ::ng-deep .k-event.k-selected{background:var(--ui-kit-color-active);box-shadow:none}.kit-scheduler ::ng-deep .k-event:hover{background:var(--ui-kit-color-hover)}.kit-scheduler ::ng-deep .k-event-actions{display:none}.kit-scheduler ::ng-deep .k-current-time{display:none}.kit-scheduler ::ng-deep .k-scheduler-agendaview .k-scheduler-timecolumn{text-align:center}\n"] }]
         }], propDecorators: { events: [{ type: i0.Input, args: [{ isSignal: true, alias: "events", required: false }] }], selectedDate: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedDate", required: false }] }], min: [{ type: i0.Input, args: [{ isSignal: true, alias: "min", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], timezone: [{ type: i0.Input, args: [{ isSignal: true, alias: "timezone", required: false }] }], viewModes: [{ type: i0.Input, args: [{ isSignal: true, alias: "viewModes", required: false }] }], showTimePill: [{ type: i0.Input, args: [{ isSignal: true, alias: "showTimePill", required: false }] }], monthEventHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "monthEventHeight", required: false }] }], eventsPerDay: [{ type: i0.Input, args: [{ isSignal: true, alias: "eventsPerDay", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], exportedFileName: [{ type: i0.Input, args: [{ isSignal: true, alias: "exportedFileName", required: false }] }], showExportButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "showExportButton", required: false }] }], freezeToolbar: [{ type: i0.Input, args: [{ isSignal: true, alias: "freezeToolbar", required: false }] }], eventClicked: [{ type: i0.Output, args: ["eventClicked"] }], eventDblClicked: [{ type: i0.Output, args: ["eventDblClicked"] }], slotClicked: [{ type: i0.Output, args: ["slotClicked"] }], dateChanged: [{ type: i0.Output, args: ["dateChanged"] }], scheduler: [{ type: i0.ViewChild, args: ['scheduler', { isSignal: true }] }], customViewTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => KitSchedulerCustomViewTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }], weekEventTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => KitSchedulerWeekEventTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }], monthEventTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => KitSchedulerMonthEventTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }], agendaTimeTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => KitSchedulerAgendaTimeTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }], headerCellTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => KitSchedulerMonthHeaderCellTemplateDirective), { ...{ read: TemplateRef }, isSignal: true }] }] } });
 
 class KitTranslateLoader {
@@ -10863,18 +10873,18 @@ class KitSplitContainerComponent {
         this.sidebarTemplateRef = input(...(ngDevMode ? [undefined, { debugName: "sidebarTemplateRef" }] : []));
         this.sidebarTitle = input(...(ngDevMode ? [undefined, { debugName: "sidebarTitle" }] : []));
         this.actionsTemplateRef = input(...(ngDevMode ? [undefined, { debugName: "actionsTemplateRef" }] : []));
+        this.isSidebarCollapsed = model(false, ...(ngDevMode ? [{ debugName: "isSidebarCollapsed" }] : []));
         this.collapsed = output();
         this.kitButtonType = KitButtonType;
         this.kitButtonKind = KitButtonKind;
         this.kitSvgIcon = KitSvgIcon;
-        this.isSidebarCollapsed = signal(false, ...(ngDevMode ? [{ debugName: "isSidebarCollapsed" }] : []));
     }
     toggleSidebar() {
         this.isSidebarCollapsed.set(!this.isSidebarCollapsed());
         this.collapsed.emit(this.isSidebarCollapsed());
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: KitSplitContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: KitSplitContainerComponent, isStandalone: true, selector: "kit-split-container", inputs: { contentTemplateRef: { classPropertyName: "contentTemplateRef", publicName: "contentTemplateRef", isSignal: true, isRequired: false, transformFunction: null }, sidebarTemplateRef: { classPropertyName: "sidebarTemplateRef", publicName: "sidebarTemplateRef", isSignal: true, isRequired: false, transformFunction: null }, sidebarTitle: { classPropertyName: "sidebarTitle", publicName: "sidebarTitle", isSignal: true, isRequired: false, transformFunction: null }, actionsTemplateRef: { classPropertyName: "actionsTemplateRef", publicName: "actionsTemplateRef", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { collapsed: "collapsed" }, ngImport: i0, template: "<div class=\"kit-split-container\">\n  <div class=\"kit-split-container-content\">\n    <ng-container *ngTemplateOutlet=\"contentTemplateRef()\" />\n  </div>\n\n  @if (sidebarTemplateRef()) {\n    <div class=\"kit-split-container-sidebar\"\n         [class.collapsed]=\"isSidebarCollapsed()\">\n      <div class=\"kit-split-container-sidebar-actions\">\n        <kit-button class=\"kit-split-container-collapsed-btn\"\n                    [type]=\"kitButtonType.GHOST\"\n                    [kind]=\"kitButtonKind.MEDIUM\"\n                    [icon]=\"isSidebarCollapsed() && kitSvgIcon.CHEVRON_LEFT || kitSvgIcon.CHEVRON_RIGHT\"\n                    (clicked)=\"toggleSidebar()\"\n        ></kit-button>\n    \n        @if (actionsTemplateRef()) {\n          <div class=\"kit-split-container-sidebar-custom-actions\">\n            <ng-container *ngTemplateOutlet=\"actionsTemplateRef()\" />\n          </div>\n        }\n      </div>\n    \n      <div class=\"kit-split-container-sidebar-content\">\n        <ng-container *ngTemplateOutlet=\"sidebarTemplateRef()\" />\n      </div>\n    \n      <div class=\"kit-split-container-sidebar-title\"\n           (click)=\"isSidebarCollapsed.set(false)\">\n        {{ sidebarTitle() }}\n      </div>\n    </div>\n  }\n</div>", styles: [":host{display:block;height:100%;min-height:0}.kit-split-container{width:100%;height:100%;box-sizing:border-box;border:1px solid var(--ui-kit-color-grey-11);border-radius:8px;display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:100%;overflow:hidden}.kit-split-container-content{width:100%;height:100%;padding:20px;border-right:1px solid var(--ui-kit-color-grey-11);box-sizing:border-box;overflow:auto}.kit-split-container-content::-webkit-scrollbar{height:8px;width:8px}.kit-split-container-content::-webkit-scrollbar-thumb{background-color:var(--ui-kit-color-grey-12);border-radius:4px}.kit-split-container-content::-webkit-scrollbar-thumb:hover{background-color:var(--ui-kit-color-grey-18)}.kit-split-container-sidebar{height:100%;padding:20px;box-sizing:border-box;width:360px;transition:.3s width;display:flex;flex-direction:column;gap:35px;align-items:center}.kit-split-container-sidebar-actions{display:flex;align-items:center;justify-content:space-between;gap:20px;width:100%}.kit-split-container-sidebar-title{display:none;cursor:pointer;font-size:18px;line-height:24px;font-weight:500;writing-mode:vertical-rl;color:var(--ui-kit-color-grey-12)}.kit-split-container-sidebar-content{width:100%;height:calc(100% - 67px)}.kit-split-container-sidebar.collapsed{width:86px;gap:15px}.kit-split-container-sidebar.collapsed .kit-split-container-sidebar-actions{width:max-content}.kit-split-container-sidebar.collapsed .kit-split-container-sidebar-custom-actions,.kit-split-container-sidebar.collapsed .kit-split-container-sidebar-content{display:none}.kit-split-container-sidebar.collapsed .kit-split-container-sidebar-title{display:block}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$6.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: KitButtonComponent, selector: "kit-button", inputs: ["disabled", "label", "type", "icon", "iconType", "kind", "state", "iconPosition", "buttonClass", "active"], outputs: ["clicked"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: KitSplitContainerComponent, isStandalone: true, selector: "kit-split-container", inputs: { contentTemplateRef: { classPropertyName: "contentTemplateRef", publicName: "contentTemplateRef", isSignal: true, isRequired: false, transformFunction: null }, sidebarTemplateRef: { classPropertyName: "sidebarTemplateRef", publicName: "sidebarTemplateRef", isSignal: true, isRequired: false, transformFunction: null }, sidebarTitle: { classPropertyName: "sidebarTitle", publicName: "sidebarTitle", isSignal: true, isRequired: false, transformFunction: null }, actionsTemplateRef: { classPropertyName: "actionsTemplateRef", publicName: "actionsTemplateRef", isSignal: true, isRequired: false, transformFunction: null }, isSidebarCollapsed: { classPropertyName: "isSidebarCollapsed", publicName: "isSidebarCollapsed", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isSidebarCollapsed: "isSidebarCollapsedChange", collapsed: "collapsed" }, ngImport: i0, template: "<div class=\"kit-split-container\">\n  <div class=\"kit-split-container-content\">\n    <ng-container *ngTemplateOutlet=\"contentTemplateRef()\" />\n  </div>\n\n  @if (sidebarTemplateRef()) {\n    <div class=\"kit-split-container-sidebar\"\n         [class.collapsed]=\"isSidebarCollapsed()\">\n      <div class=\"kit-split-container-sidebar-actions\">\n        <kit-button class=\"kit-split-container-collapsed-btn\"\n                    [type]=\"kitButtonType.GHOST\"\n                    [kind]=\"kitButtonKind.MEDIUM\"\n                    [icon]=\"isSidebarCollapsed() && kitSvgIcon.CHEVRON_LEFT || kitSvgIcon.CHEVRON_RIGHT\"\n                    (clicked)=\"toggleSidebar()\"\n        ></kit-button>\n    \n        @if (actionsTemplateRef()) {\n          <div class=\"kit-split-container-sidebar-custom-actions\">\n            <ng-container *ngTemplateOutlet=\"actionsTemplateRef()\" />\n          </div>\n        }\n      </div>\n    \n      <div class=\"kit-split-container-sidebar-content\">\n        <ng-container *ngTemplateOutlet=\"sidebarTemplateRef()\" />\n      </div>\n    \n      <div class=\"kit-split-container-sidebar-title\"\n           (click)=\"isSidebarCollapsed.set(false)\">\n        {{ sidebarTitle() }}\n      </div>\n    </div>\n  }\n</div>", styles: [":host{display:block;height:100%;min-height:0}.kit-split-container{width:100%;height:100%;box-sizing:border-box;border:1px solid var(--ui-kit-color-grey-11);border-radius:8px;display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:100%;overflow:hidden}.kit-split-container-content{width:100%;height:100%;padding:20px;border-right:1px solid var(--ui-kit-color-grey-11);box-sizing:border-box;overflow:auto}.kit-split-container-content::-webkit-scrollbar{height:8px;width:8px}.kit-split-container-content::-webkit-scrollbar-thumb{background-color:var(--ui-kit-color-grey-12);border-radius:4px}.kit-split-container-content::-webkit-scrollbar-thumb:hover{background-color:var(--ui-kit-color-grey-18)}.kit-split-container-sidebar{height:100%;padding:20px;box-sizing:border-box;width:360px;transition:.3s width;display:flex;flex-direction:column;gap:35px;align-items:center}.kit-split-container-sidebar-actions{display:flex;align-items:center;justify-content:space-between;gap:20px;width:100%}.kit-split-container-sidebar-title{display:none;cursor:pointer;font-size:18px;line-height:24px;font-weight:500;writing-mode:vertical-rl;color:var(--ui-kit-color-grey-12)}.kit-split-container-sidebar-content{width:100%;height:calc(100% - 67px)}.kit-split-container-sidebar.collapsed{width:86px;gap:15px}.kit-split-container-sidebar.collapsed .kit-split-container-sidebar-actions{width:max-content}.kit-split-container-sidebar.collapsed .kit-split-container-sidebar-custom-actions,.kit-split-container-sidebar.collapsed .kit-split-container-sidebar-content{display:none}.kit-split-container-sidebar.collapsed .kit-split-container-sidebar-title{display:block}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$6.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: KitButtonComponent, selector: "kit-button", inputs: ["disabled", "label", "type", "icon", "iconType", "kind", "state", "iconPosition", "buttonClass", "active"], outputs: ["clicked"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: KitSplitContainerComponent, decorators: [{
             type: Component,
@@ -10882,7 +10892,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImpor
                         CommonModule,
                         KitButtonComponent,
                     ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"kit-split-container\">\n  <div class=\"kit-split-container-content\">\n    <ng-container *ngTemplateOutlet=\"contentTemplateRef()\" />\n  </div>\n\n  @if (sidebarTemplateRef()) {\n    <div class=\"kit-split-container-sidebar\"\n         [class.collapsed]=\"isSidebarCollapsed()\">\n      <div class=\"kit-split-container-sidebar-actions\">\n        <kit-button class=\"kit-split-container-collapsed-btn\"\n                    [type]=\"kitButtonType.GHOST\"\n                    [kind]=\"kitButtonKind.MEDIUM\"\n                    [icon]=\"isSidebarCollapsed() && kitSvgIcon.CHEVRON_LEFT || kitSvgIcon.CHEVRON_RIGHT\"\n                    (clicked)=\"toggleSidebar()\"\n        ></kit-button>\n    \n        @if (actionsTemplateRef()) {\n          <div class=\"kit-split-container-sidebar-custom-actions\">\n            <ng-container *ngTemplateOutlet=\"actionsTemplateRef()\" />\n          </div>\n        }\n      </div>\n    \n      <div class=\"kit-split-container-sidebar-content\">\n        <ng-container *ngTemplateOutlet=\"sidebarTemplateRef()\" />\n      </div>\n    \n      <div class=\"kit-split-container-sidebar-title\"\n           (click)=\"isSidebarCollapsed.set(false)\">\n        {{ sidebarTitle() }}\n      </div>\n    </div>\n  }\n</div>", styles: [":host{display:block;height:100%;min-height:0}.kit-split-container{width:100%;height:100%;box-sizing:border-box;border:1px solid var(--ui-kit-color-grey-11);border-radius:8px;display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:100%;overflow:hidden}.kit-split-container-content{width:100%;height:100%;padding:20px;border-right:1px solid var(--ui-kit-color-grey-11);box-sizing:border-box;overflow:auto}.kit-split-container-content::-webkit-scrollbar{height:8px;width:8px}.kit-split-container-content::-webkit-scrollbar-thumb{background-color:var(--ui-kit-color-grey-12);border-radius:4px}.kit-split-container-content::-webkit-scrollbar-thumb:hover{background-color:var(--ui-kit-color-grey-18)}.kit-split-container-sidebar{height:100%;padding:20px;box-sizing:border-box;width:360px;transition:.3s width;display:flex;flex-direction:column;gap:35px;align-items:center}.kit-split-container-sidebar-actions{display:flex;align-items:center;justify-content:space-between;gap:20px;width:100%}.kit-split-container-sidebar-title{display:none;cursor:pointer;font-size:18px;line-height:24px;font-weight:500;writing-mode:vertical-rl;color:var(--ui-kit-color-grey-12)}.kit-split-container-sidebar-content{width:100%;height:calc(100% - 67px)}.kit-split-container-sidebar.collapsed{width:86px;gap:15px}.kit-split-container-sidebar.collapsed .kit-split-container-sidebar-actions{width:max-content}.kit-split-container-sidebar.collapsed .kit-split-container-sidebar-custom-actions,.kit-split-container-sidebar.collapsed .kit-split-container-sidebar-content{display:none}.kit-split-container-sidebar.collapsed .kit-split-container-sidebar-title{display:block}\n"] }]
-        }], propDecorators: { contentTemplateRef: [{ type: i0.Input, args: [{ isSignal: true, alias: "contentTemplateRef", required: false }] }], sidebarTemplateRef: [{ type: i0.Input, args: [{ isSignal: true, alias: "sidebarTemplateRef", required: false }] }], sidebarTitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "sidebarTitle", required: false }] }], actionsTemplateRef: [{ type: i0.Input, args: [{ isSignal: true, alias: "actionsTemplateRef", required: false }] }], collapsed: [{ type: i0.Output, args: ["collapsed"] }] } });
+        }], propDecorators: { contentTemplateRef: [{ type: i0.Input, args: [{ isSignal: true, alias: "contentTemplateRef", required: false }] }], sidebarTemplateRef: [{ type: i0.Input, args: [{ isSignal: true, alias: "sidebarTemplateRef", required: false }] }], sidebarTitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "sidebarTitle", required: false }] }], actionsTemplateRef: [{ type: i0.Input, args: [{ isSignal: true, alias: "actionsTemplateRef", required: false }] }], isSidebarCollapsed: [{ type: i0.Input, args: [{ isSignal: true, alias: "isSidebarCollapsed", required: false }] }, { type: i0.Output, args: ["isSidebarCollapsedChange"] }], collapsed: [{ type: i0.Output, args: ["collapsed"] }] } });
 
 class KitAbstractIdPayloadAction {
     constructor(id, payload) {