When I use 'numberOfMonths' option, how can i set current month position?

[kkh975]

I am using the 'numberOfMonths' option.
If numberOfMonths is 3, Currently, it is as below.

If numberOfMonths is 2, Currently, it is as below.

When the current month is February 2025,
If numberOfMonths is 3, I would like to place the current moon in the middle.

If numberOfMonths is 2, I would like to place the current moon on the right side.

I have to use the 'month' and 'onMonthChange' options rather than 'defaultMonth' option.
I'm wondering how I can customize the current month position.

[rodgobbi]

Hi @kkh975
You can compute the dafaultMonth based on the month you want to use as a reference.
You can import the defaultDateLib from the react-day-picker which contains many date-fns functions used by the DayPicker, one of them is the addMonth function, to achieve the result you are asking in the question you can do the following:

import { DayPicker, defaultDateLib } from "react-day-picker";

<DayPicker
  defaultMonth={defaultDateLib.addMonths(new Date(), -1)}
/>

This will show the first month of the calendar as the month before the current one.