Describe the bug

In the Persian / Hijri / Jalali Calendar section of the calendar component docs, when captionLayout is set to "dropdown", the month is not displayed correctly—it still shows Gregorian months.

There are two ways to fix this:

1. Change the default formatMonthDropdown inside calendar.tsx.
2. Pass a custom month formatter when instantiating the component:

<Calendar
  mode="single"
  selected={date}
  onSelect={handleDateSelect}
  autoFocus
  captionLayout="dropdown"
  formatters={{
    formatMonthDropdown: date =>
      date.toLocaleString('fa-IR', { month: 'short' }),
  }}
/>;

This will display the months in Persian (Jalali) correctly when using the dropdown layout.

Affected component/components

Calendar, Date Picker

How to reproduce

1. Update the calendar component in calendar.tsx to use the DayPicker component from react-day-picker/persian instead of react-day-picker.

// Before
import { DayPicker } from 'react-day-picker';

// After
import { DayPicker } from 'react-day-picker/persian';

2. Create a Calendar component instance with captionLayout="dropdown".

<Calendar
  mode="single"
  selected={date}
  onSelect={handleDateSelect}
  autoFocus
  captionLayout="dropdown"
/>;

3. Use the component with the default settings (without a custom formatMonthDropdown).

4. Open the month dropdown in the calendar.

5. Observe that the month names are displayed in Gregorian format instead of Persian / Jalali.

Codesandbox/StackBlitz link

No response

Logs

System Info

not relevant

Before submitting

• I've made research efforts and searched the documentation
• I've searched for existing issues