[Feature Request] Add first-day-of-week to v-heatmap for calendar view
Author: KRaymundusCreated Sep 14, 2026Updated Sep 15, 2026
LabelsT: featureC: VHeatmap
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.
Source: vuetifyjs/vuetify