[DateTimePicker] Add month picker selection only

[michaelmaillot]

Category

[x] Enhancement

[ ] Bug

[ ] Question

Version

Please specify what version of the library you are using: [3.21.0]

Expected / Desired Behavior / Question

We should be able to select a whole month instead of a single date.

Observed Behavior

Even if the DateTimePicker is based on Fluent UI DatePicker & Calendar components, the control doesn't provide any option to customize it as a month picker.

Steps to Reproduce

• Add DateTimePicker control to a SPFx component

Additional info

This enhancement idea has been raised from #1977.

The updates will be done in the DateTimePicker.tsx file. In the Fluent UI DatePicker component reference, the calendarAs prop renders the Calendar component only when restrictedDates prop is filled, which is not suitable for the enhancement idea. The Calendar component will have to be updated with the isDayPickerVisible prop, which will be set to false in order to make the calendar view displayed with months only.

[Sandeep-FED]

Hi @michaelmaillot, I will take this :)

[miguelisidoro]

Hi @michaelmaillot ,

Thanks for taking this. :)
When do you think this will available?

Thanks

[michaelmaillot]

Hi @michaelmaillot, I will take this :)

Thanks @Sandeep-FED, it's all yours!

@miguelisidoro as said in the original issue, this is an open source project so we can't establish an ETA as this is done on our spare time. You'll be informed once the feature is available in a beta release, then eventually in the next release for which we don't have a date to communicate for now.

[Sandeep-FED]

Hi @michaelmaillot, based on the Fluent UI calendar component’s month picker behavior—when a month is selected, it defaults to today’s date within that month. Are we aiming to replicate the same behavior?

[miguelisidoro]

@michaelmaillot and @Sandeep-FED I believe the most appropriate would be to instead of the current date, return the current month (ex: 2025-06). @michaelmaillot can you confirm if this will be the default behavior or if there is a way to achive this?

[Sandeep-FED]

@miguelisidoro Formatting is achievable

[miguelisidoro]

@Sandeep-FED how?