glue-calendar

React component that provides a customizable calendar via props and CSS.

Props

The currently available props are:

  startDate: PropTypes.object.isRequired, //Starting date for the calendar (first day of a month usually)

  numberOfMonths: PropTypes.number, //Default number of months to show from the starting date
  numberOfMonthsSmallScreen: PropTypes.number, //Number of months when the screen is considered small, by default decided with isMobile. If not specified, numberOfMonths is always used
  isSmallScreen: PropTypes.bool, //Overrides the isMobile internal function value (manually specify that numberOfMonthsSmallScreen should be used)

  onChange: PropTypes.func.isRequired, //Function with param1 value (with value being the selected or selected dates) called when value chagnes via user interaction
  value: PropTypes.array, //Currently represented value

  monthTitleRender: PropTypes.func, //Render prop that receives the initial date for a month (first day) and returns the render for that month's title
  weekDayTitles: PropTypes.array, //Array with the represented name of the 7 days of the week
  renderDay: PropTypes.func, //Optional render prop for each day that receives the corresponding Date as 

  canSelectMultipleDates: PropTypes.bool, //Allow selection of date range if true
  canSelectManyDates: PropTypes.number //Allows selection of multiple non-consecutive dates if true

CSS ClassNames

The available class names for the css are:

calendar
    month
        header
        month-view
            days-of-week
                first
                last
                selected