feat(day-view): merge the week and day view components

BREAKING CHANGE:

The day and week view have now merged. For most users this should be a seamless migration, however there are some edge cases that you may need to take account for:

Any custom styles you used for the day view will need to be adjusted. The `cal-day-view-theme` sass mixin is now gone as all the styles are shared between the week and day view.

The `eventWidth` option is removed, events now fill the available width.

If using `[daysInWeek]="1"` on the week view, the date and title formatters for the day view will be used instead.

The week view now has a border top applied to the top of the component container, rather than the top of the day headers container.

The `getDayView` and `getDayViewHourGrid` functions have been removed from the `CalendarUtils` service.

The following interfaces from `calendar-utils` were renamed: `DayViewHourSegment` -> `WeekViewHourSegment`, `DayViewHour` -> `WeekViewHour`, `DayViewEvent` -> `WeekViewTimeEvent`

The day view scheduler demo is now based off the week view instead, please check the updated demo code for how to migrate: https://mattlewis92.github.io/angular-calendar/#/day-view-scheduler

If using a custom template for the `hourSegmentTemplate`, you must pass `let-isTimeLabel="isTimeLabel"` as a local variable and then change `<div class="cal-time">` to `<div class="cal-time" *ngIf="isTimeLabel">`

Closes #889

Author: mattlewis92

package-lock.json

@@ -149,7 +149,7 @@
   "dependencies": {
     "angular-draggable-droppable": "^4.3.2",
     "angular-resizable-element": "^3.2.4",
-    "calendar-utils": "^0.5.0",
+    "calendar-utils": "^0.6.0",
     "positioning": "^2.0.0"
   },
   "sideEffects": [

package.json

@@ -6,6 +6,5 @@
 @mixin cal-theme($overrides) {
   @include cal-month-view-theme($overrides);
   @include cal-week-view-theme($overrides);
-  @include cal-day-view-theme($overrides);
   @include cal-tooltip-theme($overrides);
 }

projects/angular-calendar/src/angular-calendar.scss

@@ -5,13 +5,7 @@ import {
   GetWeekViewHeaderArgs,
   WeekDay,
   GetWeekViewArgs,
-  GetDayViewArgs,
-  DayView,
-  GetDayViewHourGridArgs,
-  DayViewHour,
   WeekView,
-  getDayView,
-  getDayViewHourGrid,
   getMonthView,
   getWeekViewHeader,
   getWeekView
@@ -33,12 +27,4 @@ export class CalendarUtils {
   getWeekView(args: GetWeekViewArgs): WeekView {
     return getWeekView(this.dateAdapter, args);
   }
-
-  getDayView(args: GetDayViewArgs): DayView {
-    return getDayView(this.dateAdapter, args);
-  }
-
-  getDayViewHourGrid(args: GetDayViewHourGridArgs): DayViewHour[] {
-    return getDayViewHourGrid(this.dateAdapter, args);
-  }
 }

projects/angular-calendar/src/modules/common/calendar-utils.provider.ts

@@ -1,8 +1,8 @@
 import {
   CalendarEvent,
-  DayViewEvent,
-  DayViewHour,
-  DayViewHourSegment,
+  WeekViewTimeEvent,
+  WeekViewHour,
+  WeekViewHourSegment,
   validateEvents as validateEventsWithoutLog,
   ViewPeriod,
   WeekDay,
@@ -40,15 +40,15 @@ export const trackByWeekDayHeaderDate = (index: number, day: WeekDay) =>
 
 export const trackByHourSegment = (
   index: number,
-  segment: DayViewHourSegment
+  segment: WeekViewHourSegment
 ) => segment.date.toISOString();
 
-export const trackByHour = (index: number, hour: DayViewHour) =>
+export const trackByHour = (index: number, hour: WeekViewHour) =>
   hour.segments[0].date.toISOString();
 
 export const trackByDayOrWeekEvent = (
   index: number,
-  weekEvent: WeekViewAllDayEvent | DayViewEvent
+  weekEvent: WeekViewAllDayEvent | WeekViewTimeEvent
 ) => (weekEvent.event.id ? weekEvent.event.id : weekEvent.event);
 
 const MINUTES_IN_HOUR = 60;