feat(monthView): allow a css class to be added to a column header

Author: Matt Lewis

package.json

@@ -143,7 +143,7 @@
   "dependencies": {
     "angular-draggable-droppable": "^1.0.1",
     "angular-resizable-element": "^1.1.1",
-    "calendar-utils": "0.0.55",
+    "calendar-utils": "0.0.56",
     "date-fns": "^1.28.5",
     "positioning": "^1.0.4"
   }

src/components/month/calendarMonthViewHeader.component.ts

@@ -12,7 +12,8 @@ import { WeekDay } from 'calendar-utils';
           [class.cal-past]="day.isPast"
           [class.cal-today]="day.isToday"
           [class.cal-future]="day.isFuture"
-          [class.cal-weekend]="day.isWeekend">
+          [class.cal-weekend]="day.isWeekend"
+          [ngClass]="day.cssClass">
           {{ day.date | calendarDate:'monthViewColumnHeader':locale }}
         </div>
       </div>

test/calendarMonthView.component.spec.ts

@@ -119,7 +119,7 @@ describe('calendarMonthView component', () => {
     fixture.destroy();
   });
 
-  it('should add a custom CSS class to days via the day modifier', () => {
+  it('should add a custom CSS class to days via the beforeViewRender output', () => {
     const fixture: ComponentFixture<CalendarMonthViewComponent> = TestBed.createComponent(CalendarMonthViewComponent);
     fixture.componentInstance.viewDate = new Date('2016-06-27');
     fixture.componentInstance.beforeViewRender.take(1).subscribe(({body}) => {
@@ -131,6 +131,18 @@ describe('calendarMonthView component', () => {
     fixture.destroy();
   });
 
+  it('should add a custom CSS class to headers via the beforeViewRender output', () => {
+    const fixture: ComponentFixture<CalendarMonthViewComponent> = TestBed.createComponent(CalendarMonthViewComponent);
+    fixture.componentInstance.viewDate = new Date('2016-06-27');
+    fixture.componentInstance.beforeViewRender.take(1).subscribe(({header}) => {
+      header[0].cssClass = 'foo';
+    });
+    fixture.componentInstance.ngOnChanges({viewDate: {}, events: {}});
+    fixture.detectChanges();
+    expect(fixture.nativeElement.querySelector('.cal-header .cal-cell').classList.contains('foo')).to.equal(true);
+    fixture.destroy();
+  });
+
   it('should not remove other classes when removing the cssClass', () => {
     const fixture: ComponentFixture<CalendarMonthViewComponent> = TestBed.createComponent(CalendarMonthViewComponent);
     fixture.componentInstance.viewDate = new Date('2016-06-27');

yarn.lock

@@ -825,9 +825,9 @@ cachedir@^1.1.0:
   dependencies:
     os-homedir "^1.0.1"
 
-[email protected].55:
-  version "0.0.55"
-  resolved "https://registry.yarnpkg.com/calendar-utils/-/calendar-utils-0.0.55.tgz#5a46351591c7f8c60bd1eb545cf7a7faa1b11c8b"
+[email protected].56:
+  version "0.0.56"
+  resolved "https://registry.yarnpkg.com/calendar-utils/-/calendar-utils-0.0.56.tgz#db6dbbbca8eceeb2107d86e0fd1f80c55a3abfa4"
 
 [email protected]:
   version "1.0.0"