bug: datetime, days of month are not localized according to numbering system

[mona4300]

Prerequisites

• I have read the Contributing Guidelines.
• I agree to follow the Code of Conduct.
• I have searched for existing issues that already report this problem, without success.

Ionic Framework Version

• v4.x
• v5.x
• v6.x
• Nightly

Current Behavior

After configuring the ion-datetime component to use the Arabic-Indic numbering system (١, ٢, ٣ ... etc)

<ion-datetime locale="ar-EG-u-nu-arab"></ion-datetime>

The month days are still rendered using the Latn system (1,2,3 ..etc). Also, the years picker still using the Latn system.

Expected Behavior

We expect to have all numbers displayed in the Arabic-Indic numbering system.

Steps to Reproduce

Set the locale property with any Arabic locale that uses the Arabic-Indic numbering system.

<ion-datetime locale="ar-EG-u-nu-arab"></ion-datetime>

Code Reproduction URL

https://github.com/mona4300/datetime-arab-locale

Ionic Info

~/datetime-arab-locale$ ionic info

[WARN] Error loading @capacitor/ios package.json: Error: Cannot find module
'@capacitor/ios/package'

   Require stack:
   - /usr/lib/node_modules/@ionic/cli/lib/project/index.js
   - /usr/lib/node_modules/@ionic/cli/lib/index.js
   - /usr/lib/node_modules/@ionic/cli/index.js
   - /usr/lib/node_modules/@ionic/cli/bin/ionic

[WARN] Error loading @capacitor/android package.json: Error: Cannot find module
'@capacitor/android/package'

   Require stack:
   - /usr/lib/node_modules/@ionic/cli/lib/project/index.js
   - /usr/lib/node_modules/@ionic/cli/lib/index.js
   - /usr/lib/node_modules/@ionic/cli/index.js
   - /usr/lib/node_modules/@ionic/cli/bin/ionic

Ionic:

Ionic CLI : 6.18.1 (/usr/lib/node_modules/@ionic/cli)
Ionic Framework : @ionic/angular 6.2.4
@angular-devkit/build-angular : 14.2.1
@angular-devkit/schematics : 14.2.1
@angular/cli : 14.2.1
@ionic/angular-toolkit : 6.1.0

Capacitor:

Capacitor CLI : 4.1.0
@capacitor/android : not installed
@capacitor/core : 4.1.0
@capacitor/ios : not installed

Utility:

cordova-res : 0.15.4
native-run : 1.6.0

System:

NodeJS : v16.17.0 (/usr/bin/node)
npm : 8.15.0
OS : Linux 5.15

Additional Information

I have checked renderMonth(month, year) method inside /node_modules/@ionic/core/components/ion-datetime.js and I think we just need to add Intl format method on the day too. please confirm or just tell me if I missed some configuration to make this work as expected. Thank you

[liamdebeasi]

Thanks for the report. Here is a dev build if you would like to try out the proposed fix:

npm install @ionic/[email protected]

This dev build makes the following changes:

1. The day buttons in the calendar grid are now localized correctly. Previously they were always using Latin script.
2. The year items in the wheel picker are now localized correctly. Previously they were always using Latin script.

[liamdebeasi]

Thanks for the issue. This has been resolved via #25847, and a fix will be available in an upcoming release of Ionic Framework. Please feel free to continue testing the dev build.

[ionitron-bot]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.