[Feature Request] Add first-day-of-week to v-heatmap for calendar view
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 41k
- Forks
- 7.1k
- Avg merge
- 1d 21h
- Merged PRs (30d)
- 11
Description
Problem to solve
v-heatmap can already look like a calendar (group-by month, one column per week, weekday rows). Week start is not a component concern today. You have to supply it yourself:
rowsordered from the first weekdayitem-rowasdate.getDay()- week column keys that match that first day
v-date-pickeralready hasfirst-day-of-week(0 = Sunday). Heatmap calendar view does not, so locale weeks (Monday-first in most of Europe) are easy to get wrong.
That also shows up in month overlap. Overlap iscolumns[0].cells[0] == nulland the next group is shifted bygroupGap - cellWidth. That matches the docs calendar example with Sunday-first rows[0, 1, 2, 3, 4, 5, 6]. With Monday-first rows, a month that starts on Sunday only has that leftover Sunday in the first column, overlap still runs, and a non-zerogroup-gapleaves Sunday offset from the week it belongs to. You cannot have Monday-first weeks, a month gap, and aligned weeks at the same time.
Proposed solution
Add first-day-of-week on v-heatmap, same meaning as v-date-picker: 0 Sunday through 6 Saturday. When it is set (or when the date adapter’s locale week start is used as the default):
- Weekday rows are ordered from that day (e.g. Monday-first → Mon … Sun).
- Week columns start on that day.
- Mid-week month overlap follows that week, and overlapping weeks share a column. Keep
group-gapas space between months only, not as part of the overlap offset.
The docs calendar example could then usefirst-day-of-weekinstead of hand-rolledrows/item-row.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the v-heatmap calendar view, the existing v-date-picker first-day-of-week behavior, and the date adapter’s locale week-start handling. Trace the rows, week columns, month overlap, and group-gap calculations; the work is complete when Monday- or locale-first calendars keep weekday order, month overlap, and week alignment while the docs calendar example no longer needs hand-rolled rows and item-row.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- typescript
- Domain
- frontend
- Issue type
- Feature
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Active
- Clarity
- Mostly clear
- Newbie friendliness
- 48/100