Description
Is this a regression?
- Yes, this behavior used to work in the previous version
The previous version in which this bug was not present was
No response
Description
When using the Luxon date adapter, the first day of the week is always set to Sunday, regardless of the selected locale. However, in certain locales (e.g., French), the first day of the week should be Monday. This behavior can cause inconsistencies in applications relying on localized date formats.
To address this issue, we can provide custom options for the Luxon date adapter by using a factory function. This factory dynamically calculates the correct firstDayOfWeek based on the current locale, leveraging Luxon’s Info.getStartOfWeek method.
Here's how to configure it:
import { MAT_LUXON_DATE_ADAPTER_OPTIONS } from '@angular/material-luxon-adapter';
import { MAT_DATE_LOCALE } from '@angular/material/core';
import { Info } from 'luxon';
import { inject } from '@angular/core';
{
provide: MAT_LUXON_DATE_ADAPTER_OPTIONS,
useFactory: () => {
const locale = inject<string>(MAT_DATE_LOCALE); // Retrieve the current locale
const firstDayOfWeek = Info.getStartOfWeek({ locale }); // Get the first day of the week for the locale
return { firstDayOfWeek };
},
},
Luxon relies on the Intl.Locale.prototype.getWeekInfo API to determine the first day of the week. Unfortunately, this API is not supported in Firefox (as of now). However, Luxon includes a fallback mechanism that assumes Monday as the first day of the week, which aligns with the ISO standard.
For more details on getWeekInfo, refer to the MDN documentation.
Reproduction
StackBlitz link: https://stackblitz.com/edit/gao3m1fm?file=src%2Fexample%2Fdatepicker-overview-example.ts,src%2Fmain.ts
Steps to reproduce:
- Open date picker and see that "D" ("Dimanche" aka. Sunday) is the first day of the week which is invalid as LOCAL_ID is "fr"
- Uncomment the last provider in
bootstrapApplication
- Open date picker and see that "L" ("Lundi" aka. Monday) is the correct first day
Expected Behavior
First day of week should depends on selected locale.
Actual Behavior
The first day of the week is always set to Sunday, regardless of the selected locale.
Environment
- Angular: 19.0.5
- CDK/Material: 19.0.4
- Browser(s): Chrome 131.0.6778.205 (64 bits)
- Operating System (e.g. Windows, macOS, Ubuntu): Windows 11