search

kenhyuwa / litepie-datepicker

Litepie Datepicker is a date range picker component for Vue.js and Tailwind CSS, dependent to day.js.
https://litepie.com
MIT License
373 stars 75 forks source link

Start week on Monday #28

Open hognevevle opened 3 years ago

hognevevle commented 3 years ago

Is there a way to have Mondays appear first in the datepicker, instead of Sundays?

If not, please consider this a feature request.

kenhyuwa commented 3 years ago

I can add new props for next release. thank you

sdoerger commented 3 years ago

Hi there, it would be great, to set the first day of the week.

bastihilger commented 3 years ago

This looks like a really promising tool - great work so far. But I also am dearly missing the option to start the week on monday. Maybe an option to manually change the underlying day.js configuration would be a solution?

nintra commented 2 years ago

Great component, but I am also dearly missing the feature to set the start of the week. This puts off more than half the world. https://en.wikipedia.org/wiki/Week#Other_week_numbering_systems

It is actually provided by dayjs.localeData().firstDayOfWeek() must be either 6, 0 or 1. (Sa, Su, Mo) So, I couldn't find it yet, but all we have to do is, to offset the weekday header and the day table generation. Shouldn't be too difficult. Any ideas?

nintra commented 2 years ago

right now dayjs().date() is used (datepicker.previous) if we switch it to a range base on:

// example september and first weekday: monday
dayjs.locale('de') 
const sep = dayjs('2022-09-01')

const firstDayOfMonth = sep.date(1) // Sep 1st Thursday
const firstDayOfMonthWeek = firstDayOfMonth.startOf('week') // August 29th Monday
const lastDayOfMonth = sep.endOf('month') // Sep 30th Friday
const lastDayOfMonthWeek = lastDayOfMonth.endOf('week') // October 2nd Sunday