react-week-scheduler
responsive graphical weekly scheduler component with drag/expand functionality to fill time blocks
Install
$ npm install react-week-scheduler
Usage
;;
Properties
return <div> <WeeklyScheduler defaultEvent=startingDefault selectedEvent=blockingEvent events=eventList currentSchedule=currentSchedule ref= { thisscheduler = scheduler; } /> </div>;
Event objects follow the format: { event: 'myEventName', color '#999'}. Any format of CSS color string including hsl should be valid.
defaultEvent
- event that by default will fill the week
selectedEvent
- default event selected for filling scheduler
events
- array of events to select from to fill scheduler
currentSchedule
- 7 x 96 timeblock matrix corresponding to 7 weekdays and 96 15-minute blocks per day. Stores Event objects.
Accessing Scheduler state
To access and return current Scheduler state just use a ref
callback:
ref={(scheduler) => { this.scheduler = scheduler }}
Current timeblock matrix will be stored in this.scheduler.state.days
corresponding to above ref