React-date-picker: Add ability to use a native datepicker

Created on 12 Oct 2017  路  1Comment  路  Source: wojtekmaj/react-date-picker

On all mobile devices (and some browsers), there are native datepickers.

It would be great react-date-picker could be told to just use the native date picker through a prop (useNative={true}).

Let the developer decided when to use native datepicker rather than rect-date-picker trying to decide.

An alternative / extra implementation could be to have a nativeOnMobile={true} where react-date-picker would change to native implemntation for all mobiles, however this is more work in detecting if you are on a mobile device or not.

The currently implementation is to create a wrapper component around react-date-picker that uses either react-date-picker or <input type="date">

enhancement help wanted

Most helpful comment

Hey @ro-savage,
thank you for your suggestion!

First of all, react-date-picker does not try to figure out if browser supports native date picker or not. In current implementation, it will always display its custom UI, and native hidden input for accessibility reasons.

If you would like to use native date picker, react-date-picker would give you no value whatsoever. I see added value in forcing native input being displayed instead of custom ones, so I definitely add this to my list. Some issues have to be solved though. For example, react-date-picker supports picking months/years only, or even whole decades. Should react-date-picker fall back to custom UI in these cases or stick to native?

Regarding nativeOnMobile, I was actually working on it, and the deeper I went, I was more sure that this is impossible to be done right. What even a mobile device is? Is it small? What about an iPad? So maybe it has a touchscreen? Then what Surface Pro is? We simply have no consistent, reliable way of telling. So each developer can decide what are the conditions to provide mobile experience and pass useNative flag along - that sounds great to me.

>All comments

Hey @ro-savage,
thank you for your suggestion!

First of all, react-date-picker does not try to figure out if browser supports native date picker or not. In current implementation, it will always display its custom UI, and native hidden input for accessibility reasons.

If you would like to use native date picker, react-date-picker would give you no value whatsoever. I see added value in forcing native input being displayed instead of custom ones, so I definitely add this to my list. Some issues have to be solved though. For example, react-date-picker supports picking months/years only, or even whole decades. Should react-date-picker fall back to custom UI in these cases or stick to native?

Regarding nativeOnMobile, I was actually working on it, and the deeper I went, I was more sure that this is impossible to be done right. What even a mobile device is? Is it small? What about an iPad? So maybe it has a touchscreen? Then what Surface Pro is? We simply have no consistent, reliable way of telling. So each developer can decide what are the conditions to provide mobile experience and pass useNative flag along - that sounds great to me.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

wojtekmaj picture wojtekmaj  路  7Comments

JMS-1 picture JMS-1  路  7Comments

vanmanh49 picture vanmanh49  路  4Comments

aladinflux picture aladinflux  路  3Comments

bijay-ps picture bijay-ps  路  5Comments