feat(day-view): remove the mwl-calendar-all-day-event component

BREAKING CHANGE: the allDayEventTemplate option was removed from the day view. To migrate use the eventTemplate input and check if dayEvent.event.allDay is set in the template

Author: mattlewis92

src/modules/day/calendar-all-day-event.component.ts

@@ -82,18 +82,22 @@ export interface DayViewEventResize {
         dragOverClass="cal-drag-over"
         dragActiveClass="cal-drag-active"
         (drop)="eventDropped($event, view.period.start, true)">
-        <mwl-calendar-all-day-event
+        <mwl-calendar-day-view-event
           *ngFor="let event of view.allDayEvents; trackBy:trackByEventId"
-          [event]="event"
-          [customTemplate]="allDayEventTemplate"
+          [dayEvent]="{event: event}"
+          [tooltipPlacement]="tooltipPlacement"
+          [tooltipTemplate]="tooltipTemplate"
+          [tooltipAppendToBody]="tooltipAppendToBody"
+          [customTemplate]="eventTemplate"
           [eventTitleTemplate]="eventTitleTemplate"
           [eventActionsTemplate]="eventActionsTemplate"
           (eventClicked)="eventClicked.emit({event: event})"
+          [class.cal-draggable]="!snapDraggedEvents && event.draggable"
           mwlDraggable
           dragActiveClass="cal-drag-active"
           [dropData]="{event: event}"
           [dragAxis]="{x: !snapDraggedEvents && event.draggable, y: !snapDraggedEvents && event.draggable}">
-        </mwl-calendar-all-day-event>
+        </mwl-calendar-day-view-event>
       </div>
       <div
         class="cal-hour-rows"
@@ -258,12 +262,6 @@ export class CalendarDayViewComponent implements OnChanges, OnInit, OnDestroy {
   @Input()
   hourSegmentTemplate: TemplateRef<any>;
 
-  /**
-   * A custom template to use for all day events
-   */
-  @Input()
-  allDayEventTemplate: TemplateRef<any>;
-
   /**
    * A custom template to use for day view events
    */

src/modules/day/calendar-day-view.component.ts

@@ -57,8 +57,7 @@
     }
   }
 
-  .cal-event,
-  .cal-all-day-event {
+  .cal-event {
     padding: 5px;
     font-size: 12px;
     background-color: #d1e8ff;
@@ -74,6 +73,10 @@
     height: 100%;
   }
 
+  .cal-all-day-events > * {
+    cursor: pointer;
+  }
+
   .cal-draggable {
     cursor: move;
   }
@@ -88,10 +91,6 @@
     border-bottom-right-radius: 5px;
   }
 
-  .cal-all-day-event {
-    cursor: pointer;
-  }
-
   .cal-drag-active {
     z-index: 1;
 

src/modules/day/calendar-day-view.scss

@@ -3,7 +3,6 @@ import { CommonModule } from '@angular/common';
 import { ResizableModule } from 'angular-resizable-element';
 import { DragAndDropModule } from 'angular-draggable-droppable';
 import { CalendarDayViewComponent } from './calendar-day-view.component';
-import { CalendarAllDayEventComponent } from './calendar-all-day-event.component';
 import { CalendarDayViewHourSegmentComponent } from './calendar-day-view-hour-segment.component';
 import { CalendarDayViewEventComponent } from './calendar-day-view-event.component';
 import { CalendarCommonModule } from '../common/calendar-common.module';
@@ -22,15 +21,13 @@ export {
   ],
   declarations: [
     CalendarDayViewComponent,
-    CalendarAllDayEventComponent,
     CalendarDayViewHourSegmentComponent,
     CalendarDayViewEventComponent
   ],
   exports: [
     ResizableModule,
     DragAndDropModule,
     CalendarDayViewComponent,
-    CalendarAllDayEventComponent,
     CalendarDayViewHourSegmentComponent,
     CalendarDayViewEventComponent
   ]

src/modules/day/calendar-day.module.ts

@@ -1427,7 +1427,7 @@ describe('CalendarDayViewComponent component', () => {
     fixture.detectChanges();
     document.body.appendChild(fixture.nativeElement);
     const event = fixture.nativeElement.querySelector(
-      '.cal-all-day-events mwl-calendar-all-day-event'
+      '.cal-all-day-events mwl-calendar-day-view-event'
     );
     const rect: ClientRect = event.getBoundingClientRect();
     let dragEvent: CalendarEventTimesChangedEvent;