Как отобразить текст / кнопку в ячейке реагировать на большой календарь?

Question

Мне удалось отредактировать стиль слотов в виде недели с помощью slotPropGetter, но не могу найти решение, как передавать текст в слот, когда нет события. Пример на картинке.

Текущая таблица:

<BigCalendar
  selectable
  className="calendar"
  popup
  localizer={localizer}
  formats={formats}
  events={this.state.events}
  defaultView={BigCalendar.Views.WEEK}
  views={['week']}
  step={90}
  timeslots={1}
  min={new Date(2019, 0, 1, 8, 0)} // 8.00 AM
  max={new Date(2020, 0, 1, 22, 0)} // Max will be 6.00 PM!
  onSelectEvent={event => this.showModalHandler(event, false, true)}
  onSelectSlot={event => this.showModalHandler(event, true, false)}
  eventPropGetter={this.eventStyleHandler}
  slotPropGetter={this.slotStyleHandler}
  components={{
      event: this.CustomEvent,
      week: {
          header: CustomDateHeader,
      },
  }}

/>

Может быть с timeSlotWrapper? Чтобы как-то изменить содержимое в timeSlopWrapperProps.children?

const timeSlotWrapper = timeSlotWrapperProps => {
    return timeSlotWrapperProps.children
}

Песочница, чтобы поиграться: https://codesandbox.io/embed/react-big-calendar-example-s6lsl?fontsize=14&hidenavigation=1&theme=dark

Реагировать на документацию API большого календаря: http://jquense.github.io/react-big-calendar/examples/index.html#api

Answer 1

Решением было создание событий для каждой ячейки и изменение стиля события вместо попытки изменить стиль пустой ячейки.