mirror of
https://github.com/gosticks/DefinitelyTyped.git
synced 2026-08-16 23:10:29 +00:00
add a new generic for resource type
This commit is contained in:
Vendored
+14
-14
@@ -171,19 +171,19 @@ export class DateLocalizer {
|
||||
format(value: FormatInput, format: string, culture: Culture): string;
|
||||
}
|
||||
|
||||
export interface BigCalendarProps<T extends Event = Event> extends React.Props<BigCalendar<T>> {
|
||||
export interface BigCalendarProps<TEvent extends Event = Event, TResource extends object = object> extends React.Props<BigCalendar<TEvent, TResource>> {
|
||||
localizer: DateLocalizer;
|
||||
|
||||
date?: stringOrDate;
|
||||
now?: Date;
|
||||
view?: View;
|
||||
events?: T[];
|
||||
events?: TEvent[];
|
||||
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: T, e: React.SyntheticEvent<HTMLElement>) => void;
|
||||
onSelectEvent?: (event: T, e: React.SyntheticEvent<HTMLElement>) => void;
|
||||
onDoubleClickEvent?: (event: TEvent, e: React.SyntheticEvent<HTMLElement>) => void;
|
||||
onSelectEvent?: (event: TEvent, e: React.SyntheticEvent<HTMLElement>) => void;
|
||||
onSelecting?: (range: { start: stringOrDate, end: stringOrDate }) => boolean | undefined | null;
|
||||
selected?: any;
|
||||
views?: View[] | {
|
||||
@@ -202,7 +202,7 @@ export interface BigCalendarProps<T extends Event = Event> extends React.Props<B
|
||||
step?: number;
|
||||
timeslots?: number;
|
||||
rtl?: boolean;
|
||||
eventPropGetter?: (event: T, start: stringOrDate, end: stringOrDate, isSelected: boolean) => { className?: string, style?: React.CSSProperties };
|
||||
eventPropGetter?: (event: TEvent, 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;
|
||||
@@ -213,14 +213,14 @@ export interface BigCalendarProps<T extends Event = Event> extends React.Props<B
|
||||
formats?: Formats;
|
||||
components?: Components;
|
||||
messages?: Messages;
|
||||
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?: keyof T | ((event: T) => any);
|
||||
resourceTitleAccessor?: keyof T | ((event: T) => string);
|
||||
titleAccessor?: keyof TEvent | ((event: TEvent) => string);
|
||||
allDayAccessor?: keyof TEvent | ((event: TEvent) => boolean);
|
||||
startAccessor?: keyof TEvent | ((event: TEvent) => Date);
|
||||
endAccessor?: keyof TEvent | ((event: TEvent) => Date);
|
||||
resourceAccessor?: keyof TEvent | ((event: TEvent) => any);
|
||||
resources?: TResource[];
|
||||
resourceIdAccessor?: keyof TResource | ((resource: TResource) => any);
|
||||
resourceTitleAccessor?: keyof TResource | ((resource: TResource) => string);
|
||||
defaultView?: View;
|
||||
defaultDate?: Date;
|
||||
className?: string;
|
||||
@@ -237,7 +237,7 @@ export interface MoveOptions {
|
||||
today: Date;
|
||||
}
|
||||
|
||||
export default class BigCalendar<T extends Event = Event> extends React.Component<BigCalendarProps<T>> {
|
||||
export default class BigCalendar<TEvent extends Event = Event, TResource extends object = object> extends React.Component<BigCalendarProps<TEvent, TResource>> {
|
||||
components: {
|
||||
dateCellWrapper: React.ComponentType,
|
||||
dayWrapper: React.ComponentType,
|
||||
|
||||
@@ -17,13 +17,25 @@ class CalendarEvent {
|
||||
start: Date;
|
||||
end: Date;
|
||||
desc: string;
|
||||
resourceId?: string;
|
||||
|
||||
constructor(_title: string, _start: Date, _end: Date, _allDay?: boolean, _desc?: string) {
|
||||
constructor(_title: string, _start: Date, _end: Date, _allDay?: boolean, _desc?: string, _resourceId?: string) {
|
||||
this.title = _title;
|
||||
this.allDay = _allDay || false;
|
||||
this.start = _start;
|
||||
this.end = _end;
|
||||
this.desc = _desc || '';
|
||||
this.resourceId = _resourceId;
|
||||
}
|
||||
}
|
||||
|
||||
class CalendarResource {
|
||||
title: string;
|
||||
id: string;
|
||||
|
||||
constructor(id: string, title: string) {
|
||||
this.id = id;
|
||||
this.title = title;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -51,10 +63,10 @@ class CalendarEvent {
|
||||
{
|
||||
// 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<CalendarEvent>> {
|
||||
class FullAPIExample extends React.Component<BigCalendarProps<CalendarEvent, CalendarResource>> {
|
||||
render() {
|
||||
return (
|
||||
<BigCalendar
|
||||
<BigCalendar<CalendarEvent, CalendarResource>
|
||||
{...this.props}
|
||||
date={new Date()}
|
||||
view={'day'}
|
||||
@@ -81,9 +93,9 @@ class CalendarEvent {
|
||||
rtl={true}
|
||||
eventPropGetter={(event, start, end, isSelected) => ({ className: 'some-class' })}
|
||||
titleAccessor={'title'}
|
||||
allDayAccessor={(event: any) => !!event.allDay}
|
||||
allDayAccessor={(event: CalendarEvent) => !!event.allDay}
|
||||
startAccessor={'start'}
|
||||
endAccessor={(event: any) => event.end || event.start}
|
||||
endAccessor={(event: CalendarEvent) => event.end || event.start}
|
||||
min={new Date()}
|
||||
max={new Date()}
|
||||
scrollToTime={new Date()}
|
||||
@@ -106,6 +118,10 @@ class CalendarEvent {
|
||||
dayPropGetter={customDayPropGetter}
|
||||
slotPropGetter={customSlotPropGetter}
|
||||
defaultDate={new Date()}
|
||||
resources={getResources()}
|
||||
resourceAccessor={event => event.resourceId}
|
||||
resourceIdAccessor={resource => resource.id}
|
||||
resourceTitleAccessor={resource => resource.title}
|
||||
/>
|
||||
);
|
||||
}
|
||||
@@ -130,10 +146,19 @@ function getEvents(): CalendarEvent[] {
|
||||
new CalendarEvent('Happy Hour', new Date(2015, 3, 12, 17, 0, 0, 0), new Date(2015, 3, 12, 17, 30, 0, 0), undefined, 'Most important meal of the day'),
|
||||
new CalendarEvent('Dinner', new Date(2015, 3, 12, 20, 0, 0, 0), new Date(2015, 3, 12, 21, 0, 0, 0)),
|
||||
new CalendarEvent('Birthday Party', new Date(2015, 3, 13, 7, 0, 0), new Date(2015, 3, 13, 10, 30, 0)),
|
||||
new CalendarEvent('Alice\'s break', new Date(2015, 3, 14, 20, 0, 0, 0), new Date(2015, 3, 14, 21, 0, 0, 0), undefined, undefined, "alice"),
|
||||
new CalendarEvent('Bob\'s break', new Date(2015, 3, 15, 7, 0, 0), new Date(2015, 3, 15, 10, 30, 0), undefined, undefined, "bob"),
|
||||
];
|
||||
return events;
|
||||
}
|
||||
|
||||
function getResources(): CalendarResource[] {
|
||||
return [
|
||||
new CalendarResource('alice', 'Alice'),
|
||||
new CalendarResource('bob', 'Bob')
|
||||
];
|
||||
}
|
||||
|
||||
class EventAgenda extends React.Component<any, any> {
|
||||
render() {
|
||||
// const { label } = this.props;
|
||||
|
||||
Reference in New Issue
Block a user