React-big-calendar: Event Categories

[brianrc]

Is there a way to change the color of event title based on its category (.e.g. classes vs workshops etc)?

Right now all the event titles are the same color with the class name _rbc-event_ applied to every one.

I would love to be able to pass a category in with the event which would then put a category class on the event div so I could style it based on category.

[jquense]

yup, you can provide any class or style you want via the eventPropGetter prop

[brianrc]

Can you provide an example? I don't understand how to use that.

[jquense]

it's a function that is passed the event and returns an object with a className abd/or style prop. the API docs describe the prop , you can poke through the source for more info

[brianrc]

Thank you.

For those that come after me and in the spirit of open source, I figured it out.

<BigCalendar
          eventPropGetter={event => ({className: 'category-' + event.category.toLowerCase()})}
          events={events}
/>

Make sure category is defined in the events you pass in.

[critdhenz]

Thanks for this :)

[Bentopi]

This was really helpful! Maybe add an example to the docs?

[jquense]

that's be great! want to send a PR for it?

[Bentopi]

Let me play around with it, get comfortable with everything it can do and I'll make one!

[jquense]

let me know if you have any questions. docs are generated from the comments in Calendar.js