Home page
Edit code

Display days as selected

To the selectedDay prop you can pass a wide number of modifiers to match the days that should appear as selected.

import React from 'react';
import DayPicker from 'react-day-picker';

import 'react-day-picker/lib/style.css';

export default function Example() {
  return (
    <DayPicker
      initialMonth={new Date(2017, 3)}
      selectedDays={[
        new Date(2017, 3, 12),
        new Date(2017, 3, 2),
        {
          after: new Date(2017, 3, 20),
          before: new Date(2017, 3, 25),
        },
      ]}
    />
  );
}