Merge branch 'next' of github.com:mui-org/material-ui-pickers into te…

…st/DatePickerTestingLib
mui · Jul 22, 2020 · 60429fc · 60429fc
2 parents ca6f74a + c235589
commit 60429fc
Show file tree

Hide file tree

Showing 123 changed files with 467 additions and 636 deletions.
diff --git a/docs/_shared/Ad.tsx b/docs/_shared/Ad.tsx
@@ -2,7 +2,7 @@ import * as React from 'react';
 import { loadScript } from 'utils/helpers';
 import { Grid, makeStyles } from '@material-ui/core';
 
-const useStyles = makeStyles(theme => ({
+const useStyles = makeStyles((theme) => ({
   '@global': {
     '#carbonads': {
       fontFamily: theme.typography.fontFamily,

diff --git a/docs/_shared/Code.tsx b/docs/_shared/Code.tsx
@@ -3,7 +3,7 @@ import React from 'react';
 import { highlight } from '../utils/prism';
 import { makeStyles } from '@material-ui/core';
 
-const useStyles = makeStyles(theme => ({
+const useStyles = makeStyles((theme) => ({
   root: {
     margin: 0,
     fontFamily: theme.typography.fontFamily,

diff --git a/docs/_shared/Example.tsx b/docs/_shared/Example.tsx
@@ -17,7 +17,7 @@ interface ExampleProps {
   source: { raw: string; relativePath: string; default: React.FC<any> };
 }
 
-const useStyles = makeStyles(theme => ({
+const useStyles = makeStyles((theme) => ({
   exampleTitle: {
     marginBottom: 8,
     '@media(max-width: 600px)': {

diff --git a/docs/_shared/LinkedComponents.tsx b/docs/_shared/LinkedComponents.tsx
@@ -9,7 +9,7 @@ interface LinkedComponentsProps {
 const LinkedComponents: React.FunctionComponent<LinkedComponentsProps> = ({ components }) => {
   return (
     <ul>
-      {components.map(component => (
+      {components.map((component) => (
         <li key={component}>
           <Link prefetch href={`/api/props?component=${component}`} as={`/api/${component}`}>
             <a>

diff --git a/docs/_shared/PropTypesTable.tsx b/docs/_shared/PropTypesTable.tsx
@@ -17,7 +17,7 @@ import {
   Grid,
 } from '@material-ui/core';
 
-const useStyles = makeStyles(theme => ({
+const useStyles = makeStyles((theme) => ({
   header: {
     marginTop: 24,
   },
@@ -117,7 +117,7 @@ const PropTypesTableLazy: React.FC<PropTypesTableProps> = ({ disableHeader, src
           </TableHead>
 
           <TableBody>
-            {propsToShow.map(prop => (
+            {propsToShow.map((prop) => (
               <TableRow key={prop.name}>
                 <TableCell
                   className={clsx({

diff --git a/docs/_shared/UtilsServiceContext.tsx b/docs/_shared/UtilsServiceContext.tsx
@@ -5,9 +5,9 @@ import { UtilsService, createUtilsService } from '../utils/utilsService';
 export const UtilsContext = React.createContext<UtilsService>(createUtilsService('date-fns'));
 
 export const withUtilsService = <P extends UtilsService>(Component: React.ComponentType<P>) => {
-  const withUtilsService: React.SFC<Omit<P, keyof UtilsService>> = props => (
+  const withUtilsService: React.SFC<Omit<P, keyof UtilsService>> = (props) => (
     <UtilsContext.Consumer>
-      {service => <Component {...service} {...(props as any)} />}
+      {(service) => <Component {...service} {...(props as any)} />}
     </UtilsContext.Consumer>
   );
 

diff --git a/docs/_shared/svgIcons/GithubIcon.jsx b/docs/_shared/svgIcons/GithubIcon.jsx
@@ -1,7 +1,7 @@
 import React from 'react';
 import { SvgIcon } from '@material-ui/core';
 
-const GitHub = props => (
+const GitHub = (props) => (
   <SvgIcon {...props}>
     <path d="M12.007 0C6.12 0 1.1 4.27.157 10.08c-.944 5.813 2.468 11.45 8.054 13.312.19.064.397.033.555-.084.16-.117.25-.304.244-.5v-2.042c-3.33.735-4.037-1.56-4.037-1.56-.22-.726-.694-1.35-1.334-1.756-1.096-.75.074-.735.074-.735.773.103 1.454.557 1.846 1.23.694 1.21 2.23 1.638 3.45.96.056-.61.327-1.178.766-1.605-2.67-.3-5.462-1.335-5.462-6.002-.02-1.193.42-2.35 1.23-3.226-.327-1.015-.27-2.116.166-3.09 0 0 1.006-.33 3.3 1.23 1.966-.538 4.04-.538 6.003 0 2.295-1.5 3.3-1.23 3.3-1.23.445 1.006.49 2.144.12 3.18.81.877 1.25 2.033 1.23 3.226 0 4.607-2.805 5.627-5.476 5.927.578.583.88 1.386.825 2.206v3.29c-.005.2.092.393.26.507.164.115.377.14.565.063 5.568-1.88 8.956-7.514 8.007-13.313C22.892 4.267 17.884.007 12.008 0z" />
   </SvgIcon>

diff --git a/docs/fakeApi/randomDate.ts b/docs/fakeApi/randomDate.ts
@@ -5,7 +5,7 @@ function getRandomNumber(min: number, max: number) {
   return Math.round(Math.random() * (max - min) + min);
 }
 
-export default function(req: NowRequest, res: NowResponse) {
+export default function (req: NowRequest, res: NowResponse) {
   const { month } = req.query;
 
   if (!month || typeof month !== 'string') {
@@ -25,7 +25,7 @@ export default function(req: NowRequest, res: NowResponse) {
 
   setTimeout(() => {
     const daysInMonth = getDaysInMonth(date);
-    const daysToHighlight = [1, 2, 3].map(_ => getRandomNumber(1, daysInMonth));
+    const daysToHighlight = [1, 2, 3].map((_) => getRandomNumber(1, daysInMonth));
 
     res.json({ daysToHighlight });
   }, 500); // fake some long work

diff --git a/docs/layout/Layout.tsx b/docs/layout/Layout.tsx
@@ -83,7 +83,7 @@ class Layout extends Component<LayoutProps> {
   state = {
     anchorEl: null,
     drawerOpen: false,
-    selectedIndex: Object.keys(utilsMap).findIndex(lib => lib === 'date-fns'),
+    selectedIndex: Object.keys(utilsMap).findIndex((lib) => lib === 'date-fns'),
   };
 
   handleDrawerToggle = () => {

diff --git a/docs/layout/components/NavItem.jsx b/docs/layout/components/NavItem.jsx
@@ -5,7 +5,7 @@ import PropTypes from 'prop-types';
 import { withRouter } from 'next/router';
 import { ListItem, withStyles, Collapse, Button } from '@material-ui/core';
 
-const styles = theme => ({
+const styles = (theme) => ({
   listItem: {
     display: 'block',
     paddingTop: 0,
@@ -39,7 +39,7 @@ class NavItem extends React.Component {
     };
   }
 
-  handleClick = e => {
+  handleClick = (e) => {
     if (this.props.depth === 0) {
       e.stopPropagation();
     }

diff --git a/docs/layout/components/navigationMap.ts b/docs/layout/components/navigationMap.ts
@@ -29,8 +29,8 @@ export const navItems = [
   {
     title: 'Components API',
     children: Object.keys(PropTypesDoc)
-      .filter(component => !component.match(/^(Mobile|Desktop|Static)/))
-      .map(component => ({
+      .filter((component) => !component.match(/^(Mobile|Desktop|Static)/))
+      .map((component) => ({
         title: component,
         as: `/api/${component}`,
         href: `/api/props?component=${component}`,

diff --git a/docs/next.config.js b/docs/next.config.js
@@ -24,7 +24,7 @@ module.exports = withBundleAnalyzer(
       withTypescript(
         withMDX(
           withTM({
-            webpack: config => {
+            webpack: (config) => {
               if (config.optimization.splitChunks.cacheGroups) {
                 // split all date libs to separate chunk
                 config.optimization.splitChunks.cacheGroups.dateLibs = {

diff --git a/docs/pages/_document.tsx b/docs/pages/_document.tsx
@@ -14,7 +14,7 @@ class MyDocument extends Document<{ theme?: ThemeType }> {
     let pageContext: PageContext | undefined;
 
     const { theme } = cookies(ctx as any);
-    const page = ctx.renderPage(Component => {
+    const page = ctx.renderPage((Component) => {
       const WrappedComponent = (props: any) => {
         pageContext = props.pageContext;
         return <Component {...props} />;

diff --git a/docs/pages/api/props.tsx b/docs/pages/api/props.tsx
@@ -8,7 +8,7 @@ import { WithRouterProps, withRouter } from 'next/router';
 import { Typography, Grid, makeStyles } from '@material-ui/core';
 
 const internalComponents = ['Calendar', 'ClockView', 'Day'];
-const useStyles = makeStyles(theme => ({
+const useStyles = makeStyles((theme) => ({
   kawaiiIcon: {
     marginTop: 48,
   },

diff --git a/docs/pages/demo/datepicker/BasicDatePicker.example.tsx b/docs/pages/demo/datepicker/BasicDatePicker.example.tsx
@@ -9,8 +9,8 @@ export default function BasicDatePicker() {
     <DatePicker
       label="Basic example"
       value={value}
-      onChange={newValue => setValue(newValue)}
-      renderInput={props => <TextField {...props} />}
+      onChange={(newValue) => setValue(newValue)}
+      renderInput={(props) => <TextField {...props} />}
     />
   );
 }
diff --git a/docs/pages/demo/datepicker/CustomDay.example.jsx b/docs/pages/demo/datepicker/CustomDay.example.jsx
@@ -10,7 +10,7 @@ import { makeStyles } from '@material-ui/core';
 import { makeJSDateObject } from '../../../utils/helpers';
 import { DatePicker, PickersDay } from '@material-ui/pickers';
 
-const useStyles = makeStyles(theme => ({
+const useStyles = makeStyles((theme) => ({
   highlight: {
     borderRadius: 0,
     backgroundColor: theme.palette.primary.main,
@@ -65,7 +65,7 @@ export default function CustomDay(props) {
       value={selectedDate}
       onChange={handleDateChange}
       renderDay={renderWeekPickerDay}
-      renderInput={props => <TextField {...props} />}
+      renderInput={(props) => <TextField {...props} />}
       inputFormat={props.__willBeReplacedGetFormatString({
         moment: `[Week of] MMM D`,
         dateFns: "'Week of' MMM d",

diff --git a/docs/pages/demo/datepicker/CustomInput.example.jsx b/docs/pages/demo/datepicker/CustomInput.example.jsx
@@ -14,7 +14,7 @@ export default function CustomInput() {
     <DesktopDatePicker
       label="Advanced keyboard"
       value={value}
-      onChange={newValue => setValue(newValue)}
+      onChange={(newValue) => setValue(newValue)}
       renderInput={({ inputRef, inputProps, InputProps }) => (
         <InputContainer>
           <input ref={inputRef} {...inputProps} />

diff --git a/docs/pages/demo/datepicker/DatePickers.example.jsx b/docs/pages/demo/datepicker/DatePickers.example.jsx
@@ -16,16 +16,16 @@ export default function DatePickersVariants(props) {
         })}
         toolbarPlaceholder="Enter Date"
         value={selectedDate}
-        onChange={date => handleDateChange(date)}
-        renderInput={props => <TextField {...props} />}
+        onChange={(date) => handleDateChange(date)}
+        renderInput={(props) => <TextField {...props} />}
       />
 
       <DesktopDatePicker
         label="For desktop"
         minDate={new Date('2017-01-01')}
         value={selectedDate}
-        onChange={date => handleDateChange(date)}
-        renderInput={props => <TextField {...props} />}
+        onChange={(date) => handleDateChange(date)}
+        renderInput={(props) => <TextField {...props} />}
       />
 
       <DatePicker
@@ -34,8 +34,8 @@ export default function DatePickersVariants(props) {
         openTo="year"
         views={['year', 'month', 'date']}
         value={selectedDate}
-        onChange={date => handleDateChange(date)}
-        renderInput={props => <TextField {...props} />}
+        onChange={(date) => handleDateChange(date)}
+        renderInput={(props) => <TextField {...props} />}
       />
     </React.Fragment>
   );

diff --git a/docs/pages/demo/datepicker/ServerRequest.example.jsx b/docs/pages/demo/datepicker/ServerRequest.example.jsx
@@ -15,7 +15,7 @@ export default function ServerRequest() {
     return () => requestAbortController.current?.abort();
   }, []);
 
-  const handleMonthChange = date => {
+  const handleMonthChange = (date) => {
     if (requestAbortController.current) {
       // make sure that you are aborting useless requests
       // because it is possible to switch between months pretty quickly
@@ -28,7 +28,7 @@ export default function ServerRequest() {
     fetch(`/fakeApi/randomDate?month=${date.toString()}`, {
       signal: controller.signal,
     })
-      .then(res => res.json())
+      .then((res) => res.json())
       .then(({ daysToHighlight }) => setHighlightedDays(daysToHighlight))
       .catch(() => console.log('Wow, you are switching months too quickly 🐕'));
 
@@ -39,10 +39,10 @@ export default function ServerRequest() {
     <DatePicker
       value={selectedDate}
       loading={highlightedDays === null}
-      onChange={date => handleDateChange(date)}
+      onChange={(date) => handleDateChange(date)}
       onMonthChange={handleMonthChange}
       // loading
-      renderInput={props => <TextField {...props} />}
+      renderInput={(props) => <TextField {...props} />}
       renderLoading={() => <CalendarSkeleton />}
       renderDay={(day, selectedDate, DayComponentProps) => {
         const date = makeJSDateObject(day); // skip this step, it is required to support date libs

diff --git a/docs/pages/demo/datepicker/StaticDatePicker.example.jsx b/docs/pages/demo/datepicker/StaticDatePicker.example.jsx
@@ -18,17 +18,17 @@ export default function StaticDatePickerExample() {
         displayStaticWrapperAs="desktop"
         openTo="year"
         value={value}
-        onChange={newValue => setValue(newValue)}
-        renderInput={props => <TextField {...props} />}
+        onChange={(newValue) => setValue(newValue)}
+        renderInput={(props) => <TextField {...props} />}
       />
 
       <StaticDatePicker
         orientation="landscape"
         openTo="date"
         value={value}
         shouldDisableDate={disableWeekends}
-        onChange={newValue => setValue(newValue)}
-        renderInput={props => <TextField {...props} />}
+        onChange={(newValue) => setValue(newValue)}
+        renderInput={(props) => <TextField {...props} />}
       />
     </React.Fragment>
   );

diff --git a/docs/pages/demo/datepicker/ViewsDatePicker.example.jsx b/docs/pages/demo/datepicker/ViewsDatePicker.example.jsx
@@ -11,8 +11,8 @@ export default function YearDatePicker() {
         views={['year']}
         label="Year only"
         value={selectedDate}
-        onChange={date => handleDateChange(date)}
-        renderInput={props => <TextField {...props} />}
+        onChange={(date) => handleDateChange(date)}
+        renderInput={(props) => <TextField {...props} />}
       />
 
       <MobileDatePicker
@@ -21,17 +21,17 @@ export default function YearDatePicker() {
         minDate={new Date('2012-03-01')}
         maxDate={new Date('2023-06-01')}
         value={selectedDate}
-        onChange={date => handleDateChange(date)}
-        renderInput={props => <TextField {...props} helperText="With min and max" />}
+        onChange={(date) => handleDateChange(date)}
+        renderInput={(props) => <TextField {...props} helperText="With min and max" />}
       />
 
       <DatePicker
         openTo="year"
         views={['year', 'month']}
         label="Year and Month"
         value={selectedDate}
-        onChange={date => handleDateChange(date)}
-        renderInput={props => <TextField {...props} helperText="Start from year selection" />}
+        onChange={(date) => handleDateChange(date)}
+        renderInput={(props) => <TextField {...props} helperText="Start from year selection" />}
       />
     </React.Fragment>
   );

diff --git a/docs/pages/demo/daterangepicker/BasicDateRangePicker.example.tsx b/docs/pages/demo/daterangepicker/BasicDateRangePicker.example.tsx
@@ -10,7 +10,7 @@ export default function BasicDateRangePicker() {
       startText="Check-in"
       endText="Check-out"
       value={value}
-      onChange={newValue => setValue(newValue)}
+      onChange={(newValue) => setValue(newValue)}
       renderInput={(startProps, endProps) => (
         <React.Fragment>
           <TextField {...startProps} />

diff --git a/docs/pages/demo/daterangepicker/CalendarsDateRangePicker.example.tsx b/docs/pages/demo/daterangepicker/CalendarsDateRangePicker.example.tsx
@@ -12,7 +12,7 @@ function CalendarsDateRangePicker() {
       <DateRangePicker
         calendars={1}
         value={selectedDate}
-        onChange={date => handleDateChange(date)}
+        onChange={(date) => handleDateChange(date)}
         renderInput={(startProps, endProps) => (
           <React.Fragment>
             <TextField {...startProps} />
@@ -26,7 +26,7 @@ function CalendarsDateRangePicker() {
       <DateRangePicker
         calendars={2}
         value={selectedDate}
-        onChange={date => handleDateChange(date)}
+        onChange={(date) => handleDateChange(date)}
         renderInput={(startProps, endProps) => (
           <React.Fragment>
             <TextField {...startProps} />
@@ -40,7 +40,7 @@ function CalendarsDateRangePicker() {
       <DateRangePicker
         calendars={3}
         value={selectedDate}
-        onChange={date => handleDateChange(date)}
+        onChange={(date) => handleDateChange(date)}
         renderInput={(startProps, endProps) => (
           <React.Fragment>
             <TextField {...startProps} />

diff --git a/docs/pages/demo/daterangepicker/CustomRangeInputs.example.tsx b/docs/pages/demo/daterangepicker/CustomRangeInputs.example.tsx
@@ -8,7 +8,7 @@ function CustomRangeInputs() {
     <DateRangePicker
       label="Advanced keyboard"
       value={selectedDate}
-      onChange={date => handleDateChange(date)}
+      onChange={(date) => handleDateChange(date)}
       renderInput={(startProps, endProps) => (
         <React.Fragment>
           <input ref={startProps.ref as React.Ref<HTMLInputElement>} {...startProps.inputProps} />

diff --git a/docs/pages/demo/daterangepicker/MinMaxDateRangePicker.example.tsx b/docs/pages/demo/daterangepicker/MinMaxDateRangePicker.example.tsx
@@ -21,7 +21,7 @@ function MinMaxDateRangePicker() {
       value={selectedRange}
       // @ts-ignore
       maxDate={getWeeksAfter(selectedRange[0], 4)}
-      onChange={date => handleDateChange(date)}
+      onChange={(date) => handleDateChange(date)}
       renderInput={(startProps, endProps) => (
         <React.Fragment>
           <TextField {...startProps} />

diff --git a/docs/pages/demo/daterangepicker/ResponsiveDateRangePicker.example.tsx b/docs/pages/demo/daterangepicker/ResponsiveDateRangePicker.example.tsx
@@ -15,7 +15,7 @@ function ResponsiveDateRangePicker() {
       <MobileDateRangePicker
         startText="Mobile start"
         value={selectedDate}
-        onChange={date => handleDateChange(date)}
+        onChange={(date) => handleDateChange(date)}
         renderInput={(startProps, endProps) => (
           <React.Fragment>
             <TextField {...startProps} />
@@ -28,7 +28,7 @@ function ResponsiveDateRangePicker() {
       <DesktopDateRangePicker
         startText="Desktop start"
         value={selectedDate}
-        onChange={date => handleDateChange(date)}
+        onChange={(date) => handleDateChange(date)}
         renderInput={(startProps, endProps) => (
           <React.Fragment>
             <TextField {...startProps} />