[react-big-calendar] Correct type for views (#38526)

Per the documentation, `views` accepts an object hash of either booleans
or React components that implement static `title` and `navigate`
functions.

This corrects the types to match.
This commit is contained in:
Mike Ragalie
2019-09-23 10:17:09 -07:00
committed by Ben Lichtman
parent 0cbf4f8628
commit 48de15f5ed
2 changed files with 26 additions and 8 deletions
+12 -5
View File
@@ -27,11 +27,11 @@ export type stringOrDate = string | Date;
export type ViewKey = 'MONTH' | 'WEEK' | 'WORK_WEEK' | 'DAY' | 'AGENDA';
export type View = 'month' | 'week' | 'work_week' | 'day' | 'agenda';
export type ViewsProps = View[] | {
work_week?: boolean | React.SFC | React.Component,
day?: boolean | React.SFC | React.Component,
agenda?: boolean | React.SFC | React.Component,
month?: boolean | React.SFC | React.Component,
week?: boolean | React.SFC | React.Component
work_week?: boolean | React.ComponentType<any> & ViewStatic,
day?: boolean | React.ComponentType<any> & ViewStatic,
agenda?: boolean | React.ComponentType<any> & ViewStatic,
month?: boolean | React.ComponentType<any> & ViewStatic,
week?: boolean | React.ComponentType<any> & ViewStatic
};
export type NavigateAction = 'PREV' | 'NEXT' | 'TODAY' | 'DATE';
export interface Event {
@@ -309,8 +309,15 @@ export interface CalendarProps<TEvent extends object = Event, TResource extends
onShowMore?: (events: TEvent[], date: Date) => void;
}
export interface TitleOptions {
formats: DateFormat[];
culture?: string;
[propName: string]: any;
}
export interface ViewStatic {
navigate(date: Date, action: NavigateAction, props: any): Date;
title(date: Date, options: TitleOptions): string;
}
export interface MoveOptions {
@@ -119,13 +119,24 @@ class CalendarResource {
// overriding 'views' props
{
const DaySFC: React.SFC = () => null;
interface DayProps {
random: string;
}
class DayComponent extends React.Component<DayProps> {
static title() {
return 'title';
}
static navigate() {
return new Date();
}
}
// supplying object to 'views' prop with only some of the supported views.
// A view can be a boolean or an SFC
// A view can be a boolean or implement title() and navigate()
ReactDOM.render(<Calendar
localizer={momentLocalizer(moment)}
views={{
day: DaySFC,
day: DayComponent,
work_week: true
}}
/>, document.body);