DateTimeInput min/max value
Is your feature request related to a problem? Please describe. I need to have some disabled days when using DateTimeInput component
Describe the solution you'd like
I noticed a similar component DateInput accepts 2 props minValue and maxValue that replicate exactly what I need
Describe alternatives you've considered I can achieve more or less the same with an error message after selection, but having the options disabled from the start would be much better!
Additional context
Where I am currently working I would like to set any dates in the past to disabled, having this possible through a prop would be great
Hi @antoniolodias β
Thanks for opening this feature request.
I would like to ask a question about the new props you would like the DateTimeInput component to support.
Since this is a component dealing with date and time, what would you expect the input to be like?
For the DateInput component we expect a string with this format: YYYY-MM-DD. Something like this would make sense to you?: YY-MM-DDTHH:mm.
Would the time always be referring to browsers time zone (userβs local time)?
Also, how do you expect the time validation to work?
I mean, if provided minValue is 2022-07-26T19:00 and the user types 15:00 in the time text input of the component, that should be invalid if selected date is 26, but it should be valid if selected date is 27 (for example).
Since the calendar is closed when users enters the time (or change the focus outside of the calendar), the user might not be aware the provided time value is not valid so, do you expect that value to be validates as the user is typing? do you expect it to be updated to the earliest valid time for that date automatically?
Thanks.
Hi @CarlosCortizasCT thank you for looking at this!
All good questions. The date format you provided looks good to me, maybe even better would be if we could also have a prop to overwrite this default format for comparison (maybe not so necessary). Do you think that's possible? Otherwise, I imagine it should just accept the existing format of the component's output.
For the timeZone, again, I think it could be flexible through a prop, maybe have a default that can be overwritten by a prop, the default should be whatever it's currently used for the DateInput component.
The validation is interesting, maybe some UX person could help out here. What I imagined was it being precise to the level of the time, so the day itself is still available but if you try to add a time before on the bottom area or on the input area then maybe the dropdown would not close π maybe the input text could change colour to gray to show the user something is wrong. What do you think?
Thanks for following up with this!
Hi @antoniolodias,
Let me go through your comments:
-
I took a quick look at the component and having a custom format for input/output is not pretty straightforward. I would only follow that path if this is something really required. Both
DateInputandDateTimeInputcomponents work with fixed formats and we would need to update both if we want to implement such a feature. -
My bad. I checked again and the component already has a (required)
timeZoneproperty. -
I would prefer someone from UX to help us here. @FilPob what's your take on this?
Thanks.
Hey guys, thanks for the suggestions! I will have a look and prepare some proposals. I will schedule a short sync afterwards