feat(dayView): introduce the beforeViewRender output

BREAKING CHANGE: the `hourSegmentModifier` has been replaced with the `beforeViewRender` output.

Author: Matt Lewis

src/components/day/calendarDayView.component.ts

@@ -170,12 +170,6 @@ export class CalendarDayViewComponent implements OnChanges, OnInit, OnDestroy {
    */
   @Input() locale: string;
 
-  /**
-   * A function that will be called before each hour segment is called. The first argument will contain the hour segment.
-   * If you add the `cssClass` property to the segment it will add that class to the hour segment in the template
-   */
-  @Input() hourSegmentModifier: Function;
-
   /**
    * The grid size to snap resizing and dragging of events to
    */
@@ -221,6 +215,12 @@ export class CalendarDayViewComponent implements OnChanges, OnInit, OnDestroy {
    */
   @Output() eventTimesChanged: EventEmitter<CalendarEventTimesChangedEvent> = new EventEmitter<CalendarEventTimesChangedEvent>();
 
+  /**
+   * An output that will be called before the view is rendered for the current day.
+   * If you add the `cssClass` property to a segment it will add that class to the hour segment in the template
+   */
+  @Output() beforeViewRender: EventEmitter<{body: DayViewHour[]}> = new EventEmitter();
+
   /**
    * @hidden
    */
@@ -399,11 +399,9 @@ export class CalendarDayViewComponent implements OnChanges, OnInit, OnDestroy {
         minute: this.dayEndMinute
       }
     });
-    if (this.hourSegmentModifier) {
-      this.hours.forEach(hour => {
-        hour.segments.forEach(segment => this.hourSegmentModifier(segment));
-      });
-    }
+    this.beforeViewRender.emit({
+      body: this.hours
+    });
   }
 
   private refreshView(): void {

test/calendarDayView.component.spec.ts

@@ -251,12 +251,16 @@ describe('CalendarDayViewComponent component', () => {
     fixture.destroy();
   });
 
-  it('should add a custom CSS class to days via the hour segment modifier', () => {
+  it('should add a custom CSS class to days via the beforeViewRender output', () => {
     const fixture: ComponentFixture<CalendarDayViewComponent> = TestBed.createComponent(CalendarDayViewComponent);
     fixture.componentInstance.viewDate = new Date('2016-06-27');
-    fixture.componentInstance.hourSegmentModifier = segment => {
-      segment.cssClass = 'foo';
-    };
+    fixture.componentInstance.beforeViewRender.take(1).subscribe(({body}) => {
+      body.forEach((hour) => {
+        hour.segments.forEach((segment) => {
+          segment.cssClass = 'foo';
+        });
+      });
+    });
     fixture.componentInstance.ngOnChanges({viewDate: {}, events: {}});
     fixture.detectChanges();
     expect(fixture.nativeElement.querySelector('.cal-hour-segment').classList.contains('foo')).to.equal(true);