Calendar: selectRange() method

I love the calendar component. Especially the fact that I can select a date range, but it would be good to have the chance to set the range "externally" as well. So that the user can for example choose "last 7 days" from a dropdown and then its selected.

Edit: I just found out that this is a FullCalendar. So they have the select range function already on board. Is there a way to us the native function then?

1 Like

Hi @G1ofG3 Thanks for this feedback!

Can you confirm that this is the calendar you're referring to?

We don't already have plans to expand the date selection options for this component, but I can share that feedback internally :slightly_smiling_face:

As long as you're using this calendar, I think you can do this with temporary state as a workaround for now.

I've put together an app that has a calendar where the default date & start week on fields are both controlled by temporary state. The calendar defaults to showing the current date & starting the week on Sunday.

Then, I have a form where the user can select a date & "Past 7 days" from a dropdown. When they submit the form, it updates the temp state variables, which in turn update the calendar view.

Default:

After I submit my form:

Select component: