Feature Request: startOfCalendarSheetMonth, endOfCalendarSheetMonth about date-fns HOT 1 OPEN

I like it. Some thoughts/caveats:

• This type of component is hard to implement correctly with keyboard shortcuts and accessibility. Having helper functions for this specific use case might encourage inexperienced users to tackle this from scratch instead of using a properly tested library.

• Not all calendar views render a fixed 6 weeks, see the month view on the web version of Google Calendar or MUI's date picker / calendar for example. There are UX trade-offs: a stable grid between months vs more vertical space to display information or events. Most months can fit in a 5 weeks layout.

• If we're looking at the 6 weeks layout, the solution is simpler than described since the end date will always be 41 days (6 weeks - 1 day) after the start of the month "sheet". You don't need to explicitly know when the month ends.

• ISO weeks always start on Monday and thus are not localizable. They should probably not be used for a user-centric calendar display unless it's part of the requirements.

For reference :

// process.env.TZ = 'Europe/Berlin';

import { addDays, endOfMonth, endOfWeek, startOfMonth, startOfWeek } from 'date-fns';
import { de } from 'date-fns/locale'; // use a locale or manually set the `weekStartsOn` option on the weeks functions

const today = new Date(2024, 4, 16);

const startOfCalendarSheet = startOfWeek(startOfMonth(today), { locale: de });
const endOfCalendarSheetPadLastWeek = endOfWeek(endOfMonth(today), { locale: de });
const endOfCalendarSheetFixedSixWeeks = addDays(startOfCalendarSheet, 6 * 7 - 1);

console.log(startOfCalendarSheet.toString());            // Mon Apr 29 2024 00:00:00 GMT+0200 (Central European Summer Time)
console.log(endOfCalendarSheetPadLastWeek.toString());   // Sun Jun 02 2024 23:59:59 GMT+0200 (Central European Summer Time)
console.log(endOfCalendarSheetFixedSixWeeks.toString()); // Sun Jun 09 2024 00:00:00 GMT+0200 (Central European Summer Time)

from date-fns.