react-dates: Warning: Failed prop type: CalendarWeek: invalid value TypeError: CalendarWeek

Hi folks! There’s no need to post further “same here”, “+1” comments - everyone will forever have this issue until react-hot-loader fixes its bug.

This issue remains open solely so that it’s discoverable, so that people don’t constantly post duplicate issues about it.

Problem still seems to persist using hot-loader 4.3.3 with react-dates ^17.0.0

Happens for DayPickerRangeController too on react-dates@16.3.0:

<DayPickerRangeController
          startDate={this.state.start}
          endDate={this.state.end}
          focusedInput={this.state.focusedInput}
          onDatesChange={this.onDatesChange}
          onFocusChange={this.handleFocusChange}
          numberOfMonths={2}
        />

Warning: Failed prop type: CalendarWeek: invalid value TypeError: CalendarWeek: invalid value supplied to 0.,TypeError: `CalendarWeek` only accepts children of type withStyles(CalendarDay),TypeError: `CalendarWeek` only accepts children of type withStyles(CustomizableCalendarDay) supplied to required children.
    in CalendarWeek (created by CalendarMonth)
    in CalendarMonth (created by withStyles(CalendarMonth))
   ...

I continue to see this warning. Clearning node_modules did not help.

react-dates v16.2.1 react v15.6.2

Warning: Failed prop type: CalendarWeek: invalid value TypeError: CalendarWeek: invalid value supplied to 0.,TypeError: `CalendarWeek` only accepts children of type withStyles(CalendarDay),TypeError: `CalendarWeek` only accepts children of type withStyles(CustomizableCalendarDay) supplied to required children.
    in CalendarWeek (created by CalendarMonth)
    in CalendarMonth (created by withStyles(CalendarMonth))
    in withStyles(CalendarMonth) (created by CalendarMonthGrid)
    in div (created by CalendarMonthGrid)
    in div (created by CalendarMonthGrid)
    in CalendarMonthGrid (created by withStyles(CalendarMonthGrid))
    in withStyles(CalendarMonthGrid) (created by DayPicker)
    in div (created by DayPicker)
    in div (created by DayPicker)
    in div (created by OutsideClickHandler)
    in OutsideClickHandler (created by DayPicker)
    in div (created by DayPicker)
    in DayPicker (created by withStyles(DayPicker))
    in withStyles(DayPicker) (created by DayPickerRangeController)
    in DayPickerRangeController (created by SharePanel)
    in div (created by SharePanel)
    in div (created by StaffHubPanel)
    in div (created by Panel)
    in div (created by Panel)
    in div (created by FocusTrapZone)
    in FocusTrapZone (created by Panel)
    in div (created by Panel)
    in div (created by Popup)
    in Popup (created by Panel)
    in div (created by Fabric)
    in Fabric (created by CustomizedFabric)
    in CustomizedFabric

<DayPickerRangeController
                            startDate={ sharePanelStore.rangeStartDate }
                            endDate={ sharePanelStore.rangeEndDate }
                            onDatesChange={ this.onDatesChange }
                            monthFormat={ this._formatStrings.get("longMonthAndLongYearFormat") }
                            focusedInput={ sharePanelStore.focusedInput }
                            onFocusChange={ this.onRangeSelectFocusChange }
                            firstDayOfWeek={ startDayOfWeek }
                            numberOfMonths={ 2 }
                            minimumNights={ 0 } // allow single day range selection
                            hideKeyboardShortcutsPanel={ true }
                            renderDayContents={ renderDayFunction }
                            navPrev={ this.renderPreviousIcon() }
                            navNext={ this.renderNextIcon() }
                            onNextMonthClick={ this.onNextMonthClicked }
                            onPrevMonthClick={ this.onPrevMonthClicked } />

anyone solved it? it happens to me too.

Isn’t there any temporary workaround regarding this?

I’m seeing this error as well on the initial click on the date picker input. Running react-date version 16.3.6 and React version 16.2.0. Clearing node modules and reinstalling has no effect for me either. @majapw have you since seen this error emerge/any fresh ideas for what might causing it?

warning.js:33 Warning: Failed prop type: CalendarWeek: invalid value TypeError: CalendarWeek: invalid value supplied to 0.,TypeError: `CalendarWeek` only accepts children of type withStyles(CalendarDay),TypeError: `CalendarWeek` only accepts children of type withStyles(CustomizableCalendarDay) supplied to required children.
    in CalendarWeek (created by CalendarMonth)
    in CalendarMonth (created by withStyles(CalendarMonth))
    in withStyles(CalendarMonth) (created by CalendarMonthGrid)
    in div (created by CalendarMonthGrid)
    in div (created by CalendarMonthGrid)
    in CalendarMonthGrid (created by withStyles(CalendarMonthGrid))
    in withStyles(CalendarMonthGrid) (created by DayPicker)
    in div (created by DayPicker)
    in div (created by DayPicker)
    in div (created by DayPicker)
    in div (created by OutsideClickHandler)
    in OutsideClickHandler (created by DayPicker)
    in div (created by DayPicker)
    in DayPicker (created by withStyles(DayPicker))
    in withStyles(DayPicker) (created by DayPickerSingleDateController)
    in DayPickerSingleDateController (created by SingleDatePicker)
    in div (created by SingleDatePicker)
    in div (created by OutsideClickHandler)
    in OutsideClickHandler (created by SingleDatePicker)

@arthurgeron Same issue with hot loader v4 though

I’m still having this problem even with react-dates@16.0.1 and react-hot-loader@3.0.0-beta.5, anyone come up with a workaround?

Has anyone had any luck with a workaround or a specific downgrade of react-hot-loader in the meantime?

Thanks for the prompt reply @ljharb I tried the workarounds above (downgrade RHL to 3.0.0) and the error disappeared. But it leads me to another problem, there’s no calendar appearing on SingleDatePicker, will be in a different issue.

The root issue, in the case, would be https://github.com/gaearon/react-hot-loader/issues/304

Same issue with SingleDatePicker. Component and package-lock.json attached if they help.

SingleDatePicker Debug.zip

It’s here with the combination of the following versions as well: "react-hot-loader": "^4.3.3", "react-dates": "^17.1.1",

Digging a little bit in the code I found out that react-hot-loader produces the warning.

https://github.com/airbnb/prop-types/issues/39

I’m seeing this exact issue as well. It happens intermittently with the DateRangePicker, can’t seem to find a solid repro case 😕

    "react": "^16.3.1",
    "react-dates": "^16.6.1",

I’m running into this issue too with single date picker when initializing with date=null 😬