React Full Calendar: Grey out dates cells in the past

https://github.com/intljusticemission/react-big-calendar

I'm using react big calendar and trying to add custom styling to date cells in the past. Not really sure how to go about this without jQuery?

<div className="col-xs-12 col-md-8">
 <BigCalendar
  events={ rentals.concat([ rental ]) }
  selectable
  views={ ['month', 'agenda'] }
  onSelectSlot={ rental => actions.selectRental(rental, sportingGood, agreedToTerms) }/>
</div>

Like Fubar mentions, I got this working by overriding the date cell wrapper component.

<div className="col-xs-12 col-md-8">
 <BigCalendar
  events={ rentals.concat([ rental ]) }
  selectable
  views={ ['month', 'agenda'] }
  onSelectSlot={ rental => actions.selectRental(rental, sportingGood, agreedToTerms) }
  components={{
   dateCellWrapper: DateCell
  }}/>
</div>


const DateCell = ({
 range,
 value,
 children
}) => {

 const now = new Date();
 now.setHours(0,0,0,0);

 return (
  <div className={ value < now ? "date-in-past" : "" }>
   { children }
  </div>
 )

}

.date-in-past {
 width: 14.3%;
 background: #ccc;
 border-right: solid 1px #fff;
}