From d336ec7181e30e95b3e7e8b5bbf927c8045983a1 Mon Sep 17 00:00:00 2001
From: Sebastian Silbermann <eps1lon@users.noreply.github.com>
Date: Mon, 2 Jul 2018 19:07:39 +0200
Subject: [PATCH] [react-big-calendar]: make event type generic (#26872)

Enables type checking in various getter methods and enables some
nice IntelliSense for accessor strings.

This however does not check if the accessed attribute actually
returns a string.

Change does not pass dtslint if compiled against typescript 2.6.
2.6 seems to have trouble infering the correct generic type.
---
 types/react-big-calendar/index.d.ts           | 31 ++++++++++---------
 .../react-big-calendar-tests.tsx              |  2 +-
 2 files changed, 18 insertions(+), 15 deletions(-)

diff --git a/types/react-big-calendar/index.d.ts b/types/react-big-calendar/index.d.ts
index bcaee40549..b73ffcc0d9 100644
--- a/types/react-big-calendar/index.d.ts
+++ b/types/react-big-calendar/index.d.ts
@@ -3,14 +3,17 @@
 // Definitions by: Piotr Witek <https://github.com/piotrwitek>
 //                 Austin Turner <https://github.com/paustint>
 //                 Krzysztof Bezrąk <https://github.com/pikpok>
+//                 Sebastian Silbermann <https://github.com/eps1lon>
 // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
-// TypeScript Version: 2.6
+// TypeScript Version: 2.7
 
 import * as React from 'react';
 
 export type stringOrDate = string | Date;
 export type View = 'month' | 'week' | 'work_week' | 'day' | 'agenda';
 export type Navigate = 'PREV' | 'NEXT' | 'TODAY' | 'DATE';
+
+export type Event = object;
 export interface Format {
     /**
      * Format for the day of the month heading in the Month view.
@@ -127,17 +130,17 @@ export interface Messages {
     showMore?: (count: number) => string;
 }
 
-export interface BigCalendarProps extends React.Props<BigCalendar> {
+export interface BigCalendarProps<T extends Event = Event> extends React.Props<BigCalendar<T>> {
     date?: stringOrDate;
     now?: Date;
     view?: View;
-    events?: object[];
+    events?: T[];
     onNavigate?: (newDate: Date, action: Navigate) => void;
     onView?: (view: View) => void;
     onDrillDown?: (date: Date, view: View) => void;
     onSelectSlot?: (slotInfo: { start: stringOrDate, end: stringOrDate, slots: Date[] | string[], action: 'select' | 'click' | 'doubleClick' }) => void;
-    onDoubleClickEvent?: (event: object, e: React.SyntheticEvent<HTMLElement>) => void;
-    onSelectEvent?: (event: object, e: React.SyntheticEvent<HTMLElement>) => void;
+    onDoubleClickEvent?: (event: T, e: React.SyntheticEvent<HTMLElement>) => void;
+    onSelectEvent?: (event: T, e: React.SyntheticEvent<HTMLElement>) => void;
     onSelecting?: (range: { start: stringOrDate, end: stringOrDate }) => boolean | undefined | null;
     selected?: any;
     views?: View[] | {
@@ -156,7 +159,7 @@ export interface BigCalendarProps extends React.Props<BigCalendar> {
     step?: number;
     timeslots?: number;
     rtl?: boolean;
-    eventPropGetter?: (event: object, start: stringOrDate, end: stringOrDate, isSelected: boolean) => { className?: string, style?: React.CSSProperties };
+    eventPropGetter?: (event: T, start: stringOrDate, end: stringOrDate, isSelected: boolean) => { className?: string, style?: React.CSSProperties };
     slotPropGetter?: (date: Date) => { className?: string, style?: object };
     dayPropGetter?: (date: Date) => { className?: string, style?: object };
     showMultiDayTimes?: boolean;
@@ -167,21 +170,21 @@ export interface BigCalendarProps extends React.Props<BigCalendar> {
     formats?: Format;
     components?: Components;
     messages?: Messages;
-    titleAccessor?: string | ((event: any) => string);
-    allDayAccessor?: string | ((event: any) => boolean);
-    startAccessor?: string | ((event: any) => Date);
-    endAccessor?: string | ((event: any) => Date);
-    resourceAccessor?: string | ((event: any) => any);
+    titleAccessor?: keyof T | ((event: T) => string);
+    allDayAccessor?: keyof T | ((event: T) => boolean);
+    startAccessor?: keyof T | ((event: T) => Date);
+    endAccessor?: keyof T | ((event: T) => Date);
+    resourceAccessor?: keyof T | ((event: T) => any);
     resources?: any[];
-    resourceIdAccessor?: string | ((event: any) => any);
-    resourceTitleAccessor?: string | ((event: any) => string);
+    resourceIdAccessor?: keyof T | ((event: T) => any);
+    resourceTitleAccessor?: keyof T | ((event: T) => string);
     defaultView?: View;
     defaultDate?: Date;
     className?: string;
     elementProps?: React.HTMLAttributes<HTMLElement>;
 }
 
-export default class BigCalendar extends React.Component<BigCalendarProps> {
+export default class BigCalendar<T extends Event = Event> extends React.Component<BigCalendarProps<T>> {
     /**
      * Setup the localizer by providing the moment Object
      */
diff --git a/types/react-big-calendar/react-big-calendar-tests.tsx b/types/react-big-calendar/react-big-calendar-tests.tsx
index dbb1753332..fe0ba7fe7c 100644
--- a/types/react-big-calendar/react-big-calendar-tests.tsx
+++ b/types/react-big-calendar/react-big-calendar-tests.tsx
@@ -45,7 +45,7 @@ console.log('Test Results -> BasicExample', basicExampleHtml);
 
 // Full API Example Test - based on API Documentation
 // http://intljusticemission.github.io/react-big-calendar/examples/index.html#api
-class FullAPIExample extends React.Component<BigCalendarProps> {
+class FullAPIExample extends React.Component<BigCalendarProps<CalendarEvent>> {
     render() {
         return (
             <BigCalendar