zackify/react-calendar

Customize first day of the week

matteoMiglio opened this issue · 1 comments

Is there an option that can set a specific first day of the week?
For example, I'd like to set Monday as first day of the week.

The situation at the moment is the following:
Schermata 2021-07-05 alle 23 53 12

I know that if I set the locale prop I can change the language of days and month, but I haven't found a prop that can allow to change the first day of the week.

Thank you.

This isn't something I've needed or thought much about. But this might provide a solution. If you copy / paste the main MonthlyCalendar component into your app:

export const MonthlyCalendar = ({
  locale,
  currentMonth,
  onCurrentMonthChange,
  children,
}: Props) => {
  let monthStart = startOfMonth(currentMonth);
  let days = eachDayOfInterval({
    start: monthStart,
    end: endOfMonth(monthStart),
  });

  return (
    <MonthlyCalendarContext.Provider
      value={{
        days,
        locale,
        onCurrentMonthChange,
        currentMonth: monthStart,
      }}
    >
      {children}
    </MonthlyCalendarContext.Provider>
  );
};

use this version in your app. You should be able to use a different date-fns method to create the days in a different order. If you find a nice way to do that, please reopen the issue and let me know, it's not something I can spend time on right now :/