v4.0.0-alpha.1

Overview

Here is the first prerelease of material-ui-pickers v4. We are going to ship all the features from the #1293. This alpha is actually the major design upgrade to new material design 2.0 pickers guidelines.

Documentation for v4: https://next.material-ui-pickers.dev/

Installation

Use npm @next tag to install the prerelease version. Make sure that we are going to introduce new breaking changes in prerelease versions.

yarn add @material-ui/pickers@next

Breaking changes

• ampm prop is now false by default.
• date-io v2 required. So please update any of your @date-io/{moment/date-fns/any} adapter to at least v2.0.0
• There is no more Keyboard* components exported (like KeyboardDatePicker). From now any picker will allow keyboard input. For mobile, it is possible using the "pen" icon inside the dialog.
• No more variant prop. Variant now passed right to the mui text field. To force specific wrapper you can use different exported components. Check “Responsiveness” demo for each component.

So it is required that your formats will be keyboard friendly (e.g. MM/dd/yyyy instead of MMMM yyyy)

<DatePicker
- format="MMMM yyyy"
+ format="MM/dd/yyyy"
/> 

• There is no more variant prop. By default, the picker will adapt to the user device viewport to render the most convenient wrapper (popover or dialog). But it is possible to force this behavior importing special components. Check out this example

Features

• 🎉 🎉 New design and UX 🎉 🎉
  

• New animations, improve performance up to 30% for current calendar switching animations

• Turn off animations (that are using react-transition-group) by default for Android devices. Use reduceAnimation prop to configure this behavior.

• Better formats override ability for localization. But this feature will be significantly improved in the next prereleases

• New way to input am/pm value
  

It is now the default behavior for desktop mode and DateTimePicker. Use ampmInClock to enable this view on mobile.