Skip to content

Commit

Permalink
Matt's review
Browse files Browse the repository at this point in the history
Co-authored-by: Matt <github@nospam.33m.co>
  • Loading branch information
oliviertassinari and mbrookes committed Nov 6, 2020
1 parent 8a4c897 commit 91d90ec
Show file tree
Hide file tree
Showing 4 changed files with 14 additions and 14 deletions.
12 changes: 6 additions & 6 deletions docs/src/pages/components/date-picker/date-picker.md
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ Date pickers let the user select a date. Date pickers are displayed with:

## Requirements

This component relies on the date management library of your choice. We support [date-fns](https://date-fns.org/), [luxon](https://moment.github.io/luxon/), [dayjs](https://github.com/iamkun/dayjs), [moment](https://momentjs.com/) and any other library via a public `dateAdapter` interface.
This component relies on the date management library of your choice. It supports [date-fns](https://date-fns.org/), [luxon](https://moment.github.io/luxon/), [dayjs](https://github.com/iamkun/dayjs), [moment](https://momentjs.com/) and any other library via a public `dateAdapter` interface.

Please install any of these libraries and set up the right date engine by wrapping your root (or the highest level you wish the pickers to be available) with `LocalizationProvider`:

Expand All @@ -39,7 +39,7 @@ function App() {

## Basic usage

The date picker will be rendered to modal dialog on mobile and textfield with popover on desktop.
The date picker will be rendered as a modal dialog on mobile, and a textfield with a popover on desktop.

{{"demo": "pages/components/date-picker/BasicDatePicker.js"}}

Expand All @@ -63,13 +63,13 @@ Use `LocalizationProvider` to change the date-engine locale that is used to rend

## Views playground

It is possible to combine `year`, `month`, and `date` selection views. Views will appear in the order they passed to the `views` array.
It's possible to combine `year`, `month`, and `date` selection views. Views will appear in the order they're included in the `views` array.

{{"demo": "pages/components/date-picker/ViewsDatePicker.js"}}

## Static mode

It is possible to render any picker without the modal/popover and text field. This can be helpful to build custom popover/modal containers.
It's possible to render any picker without the modal/popover and text field. This can be helpful when building custom popover/modal containers.

{{"demo": "pages/components/date-picker/StaticDatePickerDemo.js", "bg": true}}

Expand All @@ -81,7 +81,7 @@ For ease of use the date picker will automatically change the layout between por

## Sub-components

Some lower level sub-components (`DayPicker`, `MonthPicker` and `YearPicker`) are also exported. These are rendering without a wrapper or outer logic (masked input, date values parsing and validation, etc.).
Some lower level sub-components (`DayPicker`, `MonthPicker` and `YearPicker`) are also exported. These are rendered without a wrapper or outer logic (masked input, date values parsing and validation, etc.).

{{"demo": "pages/components/date-picker/InternalPickers.js"}}

Expand All @@ -100,6 +100,6 @@ You can take advantage of the internal [PickersDay](/api/pickers-day) component.

## Dynamic data

Sometimes it may be necessary to display additional info right in the calendar. Here is an example of prefetching and displaying server-side data using the `onMonthChange`, `loading`, and `renderDay` props.
Sometimes it may be necessary to display additional info right in the calendar. Here's an example of prefetching and displaying server-side data using the `onMonthChange`, `loading`, and `renderDay` props.

{{"demo": "pages/components/date-picker/ServerRequestDatePicker.js"}}
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ materialDesign: https://material.io/components/date-pickers

<p class="description">Date pickers let the user select a range of dates.</p>

> ⚠️⚠️ The date range picker is unstable, and **not suitable** for usage in production. ⚠️⚠️
> ⚠️⚠️ The date range picker is unstable, and **not suitable** for use in production. ⚠️⚠️
> <br /><br />
> The date range picker will be made available in the coming months for production use as part of a paid extension (commercial license) to the community edition (MIT license) of Material-UI.
> This paid extension will include advanced components (rich data grid, date range picker, tree view drag & drop, etc.). [Early access](https://material-ui.com/store/items/material-ui-x/) starts at an affordable price.
Expand All @@ -21,7 +21,7 @@ The date range pickers let the user select a range of dates.

## Requirements

This component relies on the date management library of your choice. We support [date-fns](https://date-fns.org/), [luxon](https://moment.github.io/luxon/), [dayjs](https://github.com/iamkun/dayjs), [moment](https://momentjs.com/) and any other library via a public `dateAdapter` interface.
This component relies on the date management library of your choice. It supports [date-fns](https://date-fns.org/), [luxon](https://moment.github.io/luxon/), [dayjs](https://github.com/iamkun/dayjs), [moment](https://momentjs.com/) and any other library via a public `dateAdapter` interface.

Please install any of these libraries and set up the right date engine by wrapping your root (or the highest level you wish the pickers to be available) with `LocalizationProvider`:

Expand All @@ -41,7 +41,7 @@ function App() {

## Basic usage

Basic DateRangePicker example. Note that you can pass almost any prop from [DatePicker]('/api/date-picker/').
Note that you can pass almost any prop from [DatePicker]('/api/date-picker/').

{{"demo": "pages/components/date-range-picker/BasicDateRangePicker.js"}}

Expand Down Expand Up @@ -72,7 +72,7 @@ Disabling dates behaves the same as the simple `DatePicker`.
## Custom input component

You can customize the rendered input with the `renderInput` prop. For `DateRangePicker` it takes **2** parameters – for start and end input respectively.
If you need to render custom input make sure to spread `ref` and `inputProps` correctly to the input components.
If you need to render custom inputs make sure to spread `ref` and `inputProps` correctly to the input components.

{{"demo": "pages/components/date-range-picker/CustomDateRangeInputs.js"}}

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ materialDesign: https://material.io/components/date-pickers

<p class="description">Combined date & time picker.</p>

This component combines the date & time pickers. It allows to select both date and time with the same control.
This component combines the date & time pickers. It allows the user to select both date and time with the same control.

Note that this component is the [DatePicker](/components/date-picker/) and [TimePicker](/components/time-picker/)
component combined, so any of these components' props can be passed to the DateTimePicker.
Expand All @@ -19,7 +19,7 @@ component combined, so any of these components' props can be passed to the DateT

## Requirements

This component relies on the date management library of your choice. We support [date-fns](https://date-fns.org/), [luxon](https://moment.github.io/luxon/), [dayjs](https://github.com/iamkun/dayjs), [moment](https://momentjs.com/) and any other library via a public `dateAdapter` interface.
This component relies on the date management library of your choice. It supports [date-fns](https://date-fns.org/), [luxon](https://moment.github.io/luxon/), [dayjs](https://github.com/iamkun/dayjs), [moment](https://momentjs.com/) and any other library via a public `dateAdapter` interface.

Please install any of these libraries and set up the right date engine by wrapping your root (or the highest level you wish the pickers to be available) with `LocalizationProvider`:

Expand Down
4 changes: 2 additions & 2 deletions docs/src/pages/components/time-picker/time-picker.md
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ The selected time is indicated by the filled circle at the end of the clock hand

## Requirements

This component relies on the date management library of your choice. We support [date-fns](https://date-fns.org/), [luxon](https://moment.github.io/luxon/), [dayjs](https://github.com/iamkun/dayjs), [moment](https://momentjs.com/) and any other library via a public `dateAdapter` interface.
This component relies on the date management library of your choice. It supports [date-fns](https://date-fns.org/), [luxon](https://moment.github.io/luxon/), [dayjs](https://github.com/iamkun/dayjs), [moment](https://momentjs.com/) and any other library via a public `dateAdapter` interface.

Please install any of these libraries and set up the right date engine by wrapping your root (or the highest level you wish the pickers to be available) with `LocalizationProvider`:

Expand Down Expand Up @@ -65,7 +65,7 @@ This can be customized with the `desktopModeMediaQuery` prop.

## Static mode

It is possible to render any picker inline. This will enable building custom popover/modal containers.
It's possible to render any picker inline. This will enable building custom popover/modal containers.

{{"demo": "pages/components/time-picker/StaticTimePickerDemo.js", "bg": true}}

Expand Down

0 comments on commit 91d90ec

Please sign in to comment.