[DatePicker] Remove the dateAdapter prop
See original GitHub issueThe dateAdapter
prop is exposed as a sugar helper in order to allow this diff:
-<LocalizationProvider dateAdapter={x}>
- <DatePicker />
-</LocalizationProvider>+
+<DatePicker dateAdapter={x} />
As far as I can envision the requirement of developers, I can only see a marginal use case for the prop:
- 70% of the cases, you are a developer, you want to get things down, you don’t have time to work on the tree-shaking of your application, you have a sprint to make progress on. You use
LocalizationProvider
at the root of your app. - 30% of the cases, you have found time to dedicate on tree-shaking. You figure that you can solve the problem by creating a wrapper component for each date picker component. You create the wrapper, move the
LocalizationProvider
inside it, for instance:
import { DatePicker, DatePickerProps, LocalizationProvider } from '@material-ui/lab';
import dateAdapter from 'path-to-date-adapter';
const DatePicker = React.forwardRef(function DatePicker(props: DatePickerProps, ref: React.Ref<unknown>)) {
return (
<LocalizationProvider dateAdapter={dateAdapter}>
<DatePicker ref={ref} {...props} />
</LocalizationProvider>
);
}
export default DatePicker;
Another advantage of dropping dateAdapter
avoids having people ask what option they should use between the provider and the prop and also to prune the codebase of code that isn’t used frequently enough to justify the added complexity.
- I wonder if we should expose
withDateAdapter
as a public higher-order component? Probably not - I wonder about making a poll to figure out what developers use. Happy to skip this part
Issue Analytics
- State:
- Created 3 years ago
- Reactions:2
- Comments:5 (5 by maintainers)
Top Results From Across the Web
[DatePicker] Remove the dateAdapter prop #23670 - GitHub
The dateAdapter prop is exposed as a sugar helper in order to allow this diff: - - - + + ... [DatePicker] Remove...
Read more >How can I clear MUI DatePicker input? - Stack Overflow
Store a date field in state, passed as the value prop to DatePicker · Change the date to null when desired to 'clear'...
Read more >Datepicker - Angular Material
Disabling parts of the datepicker. As with any standard <input> , it is possible to disable the datepicker input by adding the disabled...
Read more >Datepicker in Angular using mat-datepicker | Material Design
We can disable the datepicker by adding disabled property to the input element. <mat-form-field> <input matInput [matDatepicker]="disabledatepicker" ...
Read more >React Date Picker component - MUI X
It's possible to render any date picker without the modal/popover and text field. This can be helpful when building custom popover/modal containers.
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
Ok. I was not talking about this. I was talking about doing one thing. Not doing two things.
Same argument as always: Provide one API to do one thing not two. Glad you’re following here but I would hope you apply it everywhere.