Skip to content

feat: add independently controlled visible months#3002

Open
Albatrosso wants to merge 1 commit into
gpbl:mainfrom
Albatrosso:feat/independent-range-api
Open

feat: add independently controlled visible months#3002
Albatrosso wants to merge 1 commit into
gpbl:mainfrom
Albatrosso:feat/independent-range-api

Conversation

@Albatrosso
Copy link
Copy Markdown

Summary

Adds a draft visibleMonths API for controlling displayed calendar months independently.

This is intended for range pickers where the selected from and to dates may be far apart, and the UI should show both endpoint months at the same time instead of forcing adjacent months through numberOfMonths.

What changed

  • Added visibleMonths, defaultVisibleMonths, and onVisibleMonthsChange.
  • Keeps the existing month / defaultMonth / numberOfMonths behavior unchanged.
  • When visibleMonths is provided, displayed months come directly from that array.
  • Dropdown, previous/next navigation, and keyboard navigation update the relevant visible month.
  • onMonthChange is not called for visibleMonths updates.
  • Allows non-chronological visible months, e.g. [Dec 2025, Jan 2024].
  • Keeps range selection behavior unchanged.

Notes

This PR is intentionally narrow and focused on the core behavior/API shape. It does not add full documentation or examples yet, so naming and callback details can still be adjusted.

Validation

Ran:

pnpm exec jest --selectProjects src --runTestsByPath \
  packages/react-day-picker/src/helpers/getDates.test.ts \
  packages/react-day-picker/src/DayPicker.test.tsx \
  packages/react-day-picker/src/types/props.test.tsx

pnpm --filter react-day-picker typecheck
pnpm lint
git diff --check

@Albatrosso Albatrosso requested a review from gpbl as a code owner May 24, 2026 07:12
@changeset-bot
Copy link
Copy Markdown

changeset-bot Bot commented May 24, 2026

🦋 Changeset detected

Latest commit: 398f115

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 7 packages
Name Type
react-day-picker Minor
@daypicker/react Minor
@daypicker/buddhist Minor
@daypicker/ethiopic Minor
@daypicker/hebrew Minor
@daypicker/hijri Minor
@daypicker/persian Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant