src/components/CalendarHeader.vue

@@ -78,8 +78,7 @@ function changeYear(y) {
 
 const weekdayNames = computed(() => {
   // Reorder names & weekend flags
-  const mondayFirstNames = getLocalizedWeekdayNames()
-  const sundayFirstNames = [mondayFirstNames[6], ...mondayFirstNames.slice(0, 6)]
+  const sundayFirstNames = getLocalizedWeekdayNames()
   const reorderedNames = reorderByFirstDay(sundayFirstNames, calendarStore.config.first_day)
   const reorderedWeekend = reorderByFirstDay(calendarStore.weekend, calendarStore.config.first_day)
 

src/components/SettingsDialog.vue

@@ -3,10 +3,14 @@ import { ref, computed } from 'vue'
 import BaseDialog from './BaseDialog.vue'
 import { useCalendarStore } from '@/stores/CalendarStore'
 import WeekdaySelector from './WeekdaySelector.vue'
+import { getLocalizedWeekdayNamesLong } from '@/utils/date'
 
 const show = ref(false)
 const calendarStore = useCalendarStore()
 
+// Localized weekday names (now Sunday-first from util) for select 0=Sunday ..6=Saturday
+const weekdayNames = getLocalizedWeekdayNamesLong()
+
 // Reactive bindings to store
 const firstDay = computed({
   get: () => calendarStore.config.first_day,
@@ -171,13 +175,9 @@ defineExpose({ open })
       <label class="ec-field">
         <span>First day of week</span>
         <select v-model.number="firstDay">
-          <option :value="0">Sunday</option>
-          <option :value="1">Monday</option>
-          <option :value="2">Tuesday</option>
-          <option :value="3">Wednesday</option>
-          <option :value="4">Thursday</option>
-          <option :value="5">Friday</option>
-          <option :value="6">Saturday</option>
+            <option v-for="(name, idx) in weekdayNames" :key="idx" :value="idx">
+              {{ name.charAt(0).toUpperCase() + name.slice(1) }}
+            </option>
         </select>
       </label>
       <div class="weekend-select ec-field">

src/components/WeekdaySelector.vue

@@ -60,8 +60,8 @@ const props = defineProps({
 
 // Initialize internal from external if it has any true; else keep empty (fallback handled on emit)
 if (model.value?.some?.(Boolean)) internal.value = [...model.value]
-const labelsMondayFirst = getLocalizedWeekdayNames()
-const labels = [labelsMondayFirst[6], ...labelsMondayFirst.slice(0, 6)]
+// getLocalizedWeekdayNames now returns Sunday-first already
+const labels = getLocalizedWeekdayNames()
 const anySelected = computed(() => internal.value.some(Boolean))
 const localeFirst = getLocaleFirstDay()
 const localeWeekend = getLocaleWeekendDays()

src/utils/date.js

@@ -249,11 +249,22 @@ function addDaysStr(str, n, timeZone = DEFAULT_TZ) {
   return toLocalString(dateFns.addDays(fromLocalString(str, timeZone), n), timeZone)
 }
 
+// Weekday name helpers now return Sunday-first ordering (index 0 = Sunday ... 6 = Saturday)
 function getLocalizedWeekdayNames(timeZone = DEFAULT_TZ) {
-  const monday = makeTZDate(2025, 0, 6, timeZone) // a Monday
+  const sunday = makeTZDate(2025, 0, 5, timeZone) // a Sunday
   return Array.from({ length: 7 }, (_, i) =>
     new Intl.DateTimeFormat(undefined, { weekday: 'short', timeZone }).format(
-      dateFns.addDays(monday, i),
+      dateFns.addDays(sunday, i),
+    ),
+  )
+}
+
+// Long (wide) localized weekday names, Sunday-first ordering
+function getLocalizedWeekdayNamesLong(timeZone = DEFAULT_TZ) {
+  const sunday = makeTZDate(2025, 0, 5, timeZone)
+  return Array.from({ length: 7 }, (_, i) =>
+    new Intl.DateTimeFormat(undefined, { weekday: 'long', timeZone }).format(
+      dateFns.addDays(sunday, i),
     ),
   )
 }
@@ -363,6 +374,7 @@ export {
   daysInclusive,
   addDaysStr,
   getLocalizedWeekdayNames,
+  getLocalizedWeekdayNamesLong,
   getLocaleFirstDay,
   getLocaleWeekendDays,
   reorderByFirstDay,