Improve @material-ui includes.

marmelab · Jan 8, 2020 · 941ced6 · 941ced6
1 parent c633422
commit 941ced6
Show file tree

Hide file tree

Showing 29 changed files with 95 additions and 79 deletions.
diff --git a/examples/demo/src/reviews/StarRatingField.tsx b/examples/demo/src/reviews/StarRatingField.tsx
@@ -1,6 +1,6 @@
 import React, { FC } from 'react';
 import Icon from '@material-ui/icons/Stars';
-import { makeStyles } from '@material-ui/core';
+import { makeStyles } from '@material-ui/core/styles';
 
 import { FieldProps } from '../types';
 

diff --git a/examples/demo/src/visitors/SegmentsField.tsx b/examples/demo/src/visitors/SegmentsField.tsx
@@ -3,7 +3,7 @@ import Chip from '@material-ui/core/Chip';
 import { useTranslate } from 'react-admin';
 import segments from '../segments/data';
 import { FieldProps, Customer } from '../types';
-import { makeStyles } from '@material-ui/core';
+import { makeStyles } from '@material-ui/core/styles';
 
 const useStyles = makeStyles({
     main: {

diff --git a/packages/ra-ui-materialui/src/auth/Login.tsx b/packages/ra-ui-materialui/src/auth/Login.tsx
@@ -7,13 +7,9 @@ import React, {
 } from 'react';
 import PropTypes from 'prop-types';
 import classnames from 'classnames';
-import {
-    Card,
-    Avatar,
-    createMuiTheme,
-    makeStyles,
-    Theme,
-} from '@material-ui/core';
+import { createMuiTheme, makeStyles, Theme } from '@material-ui/core/styles';
+import Card from '@material-ui/core/Card';
+import Avatar from '@material-ui/core/Avatar';
 import { ThemeProvider } from '@material-ui/styles';
 import LockIcon from '@material-ui/icons/Lock';
 import { StaticContext } from 'react-router';

diff --git a/packages/ra-ui-materialui/src/auth/Logout.tsx b/packages/ra-ui-materialui/src/auth/Logout.tsx
@@ -1,8 +1,8 @@
 import React, { useCallback, FunctionComponent } from 'react';
 import PropTypes from 'prop-types';
-import { ListItemIcon, MenuItem, makeStyles } from '@material-ui/core';
-import { MenuItemProps } from '@material-ui/core/MenuItem';
-import { Theme } from '@material-ui/core/styles';
+import { makeStyles, Theme } from '@material-ui/core/styles';
+import MenuItem, { MenuItemProps } from '@material-ui/core/MenuItem';
+import ListItemIcon from '@material-ui/core/ListItemIcon';
 
 import ExitIcon from '@material-ui/icons/PowerSettingsNew';
 import classnames from 'classnames';

diff --git a/packages/ra-ui-materialui/src/button/BulkDeleteWithConfirmButton.js b/packages/ra-ui-materialui/src/button/BulkDeleteWithConfirmButton.js
@@ -1,9 +1,8 @@
 import React, { Fragment, useState } from 'react';
 import PropTypes from 'prop-types';
 import ActionDelete from '@material-ui/icons/Delete';
-import { fade } from '@material-ui/core/styles/colorManipulator';
+import colorManipulator, { makeStyles } from '@material-ui/core/styles';
 import inflection from 'inflection';
-import { makeStyles } from '@material-ui/core/styles';
 import {
     useTranslate,
     useDeleteMany,
@@ -32,7 +31,10 @@ const useStyles = makeStyles(
         deleteButton: {
             color: theme.palette.error.main,
             '&:hover': {
-                backgroundColor: fade(theme.palette.error.main, 0.12),
+                backgroundColor: colorManipulator.fade(
+                    theme.palette.error.main,
+                    0.12
+                ),
                 // Reset on mouse devices
                 '@media (hover: none)': {
                     backgroundColor: 'transparent',

diff --git a/packages/ra-ui-materialui/src/button/BulkDeleteWithUndoButton.js b/packages/ra-ui-materialui/src/button/BulkDeleteWithUndoButton.js
@@ -1,8 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import ActionDelete from '@material-ui/icons/Delete';
-import { fade } from '@material-ui/core/styles/colorManipulator';
-import { makeStyles } from '@material-ui/core/styles';
+import colorManipulator, { makeStyles } from '@material-ui/core/styles';
 import {
     useDeleteMany,
     useRefresh,
@@ -31,7 +30,10 @@ const useStyles = makeStyles(
         deleteButton: {
             color: theme.palette.error.main,
             '&:hover': {
-                backgroundColor: fade(theme.palette.error.main, 0.12),
+                backgroundColor: colorManipulator.fade(
+                    theme.palette.error.main,
+                    0.12
+                ),
                 // Reset on mouse devices
                 '@media (hover: none)': {
                     backgroundColor: 'transparent',

diff --git a/packages/ra-ui-materialui/src/button/Button.tsx b/packages/ra-ui-materialui/src/button/Button.tsx
@@ -1,15 +1,13 @@
 import React, { FC, ReactElement } from 'react';
 import PropTypes from 'prop-types';
-import {
-    Button as MuiButton,
-    Tooltip,
-    IconButton,
-    useMediaQuery,
-    makeStyles,
-    PropTypes as MuiPropTypes,
-} from '@material-ui/core';
-import { ButtonProps as MuiButtonProps } from '@material-ui/core/Button';
-import { Theme } from '@material-ui/core';
+import Tooltip from '@material-ui/core/Tooltip';
+import IconButton from '@material-ui/core/IconButton';
+import useMediaQuery from '@material-ui/core/useMediaQuery';
+import { makeStyles, Theme } from '@material-ui/core/styles';
+import { PropTypes as MuiPropTypes } from '@material-ui/core';
+import MuiButton, {
+    ButtonProps as MuiButtonProps,
+} from '@material-ui/core/Button';
 import classnames from 'classnames';
 import { useTranslate } from 'ra-core';
 

diff --git a/packages/ra-ui-materialui/src/button/CreateButton.tsx b/packages/ra-ui-materialui/src/button/CreateButton.tsx
@@ -1,7 +1,9 @@
 import React, { FC, ReactElement } from 'react';
 import PropTypes from 'prop-types';
 import onlyUpdateForKeys from 'recompose/onlyUpdateForKeys';
-import { Fab, makeStyles, useMediaQuery, Theme } from '@material-ui/core';
+import { makeStyles, Theme } from '@material-ui/core/styles';
+import Fab from '@material-ui/core/Fab';
+import useMediaQuery from '@material-ui/core/useMediaQuery';
 import ContentAdd from '@material-ui/icons/Add';
 import classnames from 'classnames';
 import { Link } from 'react-router-dom';

diff --git a/packages/ra-ui-materialui/src/button/DeleteWithConfirmButton.tsx b/packages/ra-ui-materialui/src/button/DeleteWithConfirmButton.tsx
@@ -7,8 +7,7 @@ import React, {
     SyntheticEvent,
 } from 'react';
 import PropTypes from 'prop-types';
-import { makeStyles } from '@material-ui/core/styles';
-import { fade } from '@material-ui/core/styles/colorManipulator';
+import colorManipulator, { makeStyles } from '@material-ui/core/styles';
 import ActionDelete from '@material-ui/icons/Delete';
 import classnames from 'classnames';
 import inflection from 'inflection';
@@ -145,7 +144,10 @@ const useStyles = makeStyles(
         deleteButton: {
             color: theme.palette.error.main,
             '&:hover': {
-                backgroundColor: fade(theme.palette.error.main, 0.12),
+                backgroundColor: colorManipulator.fade(
+                    theme.palette.error.main,
+                    0.12
+                ),
                 // Reset on mouse devices
                 '@media (hover: none)': {
                     backgroundColor: 'transparent',

diff --git a/packages/ra-ui-materialui/src/button/DeleteWithUndoButton.tsx b/packages/ra-ui-materialui/src/button/DeleteWithUndoButton.tsx
@@ -1,7 +1,6 @@
 import React, { useCallback, FC, ReactElement, SyntheticEvent } from 'react';
 import PropTypes from 'prop-types';
-import { makeStyles } from '@material-ui/core/styles';
-import { fade } from '@material-ui/core/styles/colorManipulator';
+import colorManipulator, { makeStyles } from '@material-ui/core/styles';
 import ActionDelete from '@material-ui/icons/Delete';
 import classnames from 'classnames';
 import {
@@ -108,7 +107,10 @@ const useStyles = makeStyles(
         deleteButton: {
             color: theme.palette.error.main,
             '&:hover': {
-                backgroundColor: fade(theme.palette.error.main, 0.12),
+                backgroundColor: colorManipulator.fade(
+                    theme.palette.error.main,
+                    0.12
+                ),
                 // Reset on mouse devices
                 '@media (hover: none)': {
                     backgroundColor: 'transparent',

diff --git a/packages/ra-ui-materialui/src/field/BooleanField.tsx b/packages/ra-ui-materialui/src/field/BooleanField.tsx
@@ -4,8 +4,8 @@ import get from 'lodash/get';
 import pure from 'recompose/pure';
 import FalseIcon from '@material-ui/icons/Clear';
 import TrueIcon from '@material-ui/icons/Done';
-import { Tooltip, Typography } from '@material-ui/core';
-import { TypographyProps } from '@material-ui/core/Typography';
+import Tooltip from '@material-ui/core/Tooltip';
+import Typography, { TypographyProps } from '@material-ui/core/Typography';
 import compose from 'recompose/compose';
 import { useTranslate } from 'ra-core';
 

diff --git a/packages/ra-ui-materialui/src/input/ArrayInput.tsx b/packages/ra-ui-materialui/src/input/ArrayInput.tsx
@@ -2,7 +2,8 @@ import React, { cloneElement, Children } from 'react';
 import PropTypes from 'prop-types';
 import { isRequired, FieldTitle, composeValidators } from 'ra-core';
 import { useFieldArray } from 'react-final-form-arrays';
-import { InputLabel, FormControl } from '@material-ui/core';
+import FormControl from '@material-ui/core/FormControl';
+import InputLabel from '@material-ui/core/InputLabel';
 
 import sanitizeRestProps from './sanitizeRestProps';
 

diff --git a/packages/ra-ui-materialui/src/input/AutocompleteArrayInput.tsx b/packages/ra-ui-materialui/src/input/AutocompleteArrayInput.tsx
@@ -9,8 +9,9 @@ import React, {
 import Downshift, { DownshiftProps } from 'downshift';
 import classNames from 'classnames';
 import get from 'lodash/get';
-import { makeStyles, TextField, Chip } from '@material-ui/core';
-import { TextFieldProps } from '@material-ui/core/TextField';
+import { makeStyles } from '@material-ui/core/styles';
+import Chip from '@material-ui/core/Chip';
+import TextField, { TextFieldProps } from '@material-ui/core/TextField';
 import {
     useInput,
     FieldTitle,

diff --git a/packages/ra-ui-materialui/src/input/AutocompleteInput.tsx b/packages/ra-ui-materialui/src/input/AutocompleteInput.tsx
@@ -9,8 +9,8 @@ import React, {
 } from 'react';
 import Downshift, { DownshiftProps } from 'downshift';
 import get from 'lodash/get';
-import { makeStyles, TextField } from '@material-ui/core';
-import { TextFieldProps } from '@material-ui/core/TextField';
+import { makeStyles } from '@material-ui/core/styles';
+import TextField, { TextFieldProps } from '@material-ui/core/TextField';
 import {
     useInput,
     FieldTitle,

diff --git a/packages/ra-ui-materialui/src/input/AutocompleteSuggestionItem.tsx b/packages/ra-ui-materialui/src/input/AutocompleteSuggestionItem.tsx
@@ -1,8 +1,8 @@
 import React, { FunctionComponent, isValidElement, cloneElement } from 'react';
 import parse from 'autosuggest-highlight/parse';
 import match from 'autosuggest-highlight/match';
-import { makeStyles, MenuItem } from '@material-ui/core';
-import { MenuItemProps } from '@material-ui/core/MenuItem';
+import { makeStyles } from '@material-ui/core/styles';
+import MenuItem, { MenuItemProps } from '@material-ui/core/MenuItem';
 import classnames from 'classnames';
 
 const useStyles = makeStyles(

diff --git a/packages/ra-ui-materialui/src/input/AutocompleteSuggestionList.tsx b/packages/ra-ui-materialui/src/input/AutocompleteSuggestionList.tsx
@@ -1,5 +1,7 @@
 import React, { ReactNode, FunctionComponent } from 'react';
-import { makeStyles, Paper, Popper } from '@material-ui/core';
+import { makeStyles } from '@material-ui/core/styles';
+import Paper from '@material-ui/core/Paper';
+import Popper from '@material-ui/core/Popper';
 
 const useStyles = makeStyles(
     {

diff --git a/packages/ra-ui-materialui/src/input/FileInputPreview.tsx b/packages/ra-ui-materialui/src/input/FileInputPreview.tsx
@@ -1,6 +1,6 @@
 import React, { useEffect, ReactNode, FunctionComponent } from 'react';
 import PropTypes from 'prop-types';
-import { makeStyles } from '@material-ui/core';
+import { makeStyles } from '@material-ui/core/styles';
 import RemoveCircle from '@material-ui/icons/RemoveCircle';
 import IconButton from '@material-ui/core/IconButton';
 import { useTranslate } from 'ra-core';

diff --git a/packages/ra-ui-materialui/src/input/PasswordInput.tsx b/packages/ra-ui-materialui/src/input/PasswordInput.tsx
@@ -1,6 +1,7 @@
 import React, { FC, useState } from 'react';
 import { useTranslate } from 'ra-core';
-import { InputAdornment, IconButton } from '@material-ui/core';
+import InputAdornment from '@material-ui/core/InputAdornment';
+import IconButton from '@material-ui/core/IconButton';
 import Visibility from '@material-ui/icons/Visibility';
 import VisibilityOff from '@material-ui/icons/VisibilityOff';
 

diff --git a/packages/ra-ui-materialui/src/input/RadioButtonGroupInput.tsx b/packages/ra-ui-materialui/src/input/RadioButtonGroupInput.tsx
@@ -1,14 +1,10 @@
 import React, { FunctionComponent } from 'react';
 import PropTypes from 'prop-types';
-import {
-    makeStyles,
-    FormControl,
-    FormHelperText,
-    FormLabel,
-    RadioGroup,
-} from '@material-ui/core';
-import { RadioGroupProps } from '@material-ui/core/RadioGroup';
-import { FormControlProps } from '@material-ui/core/FormControl';
+import { makeStyles } from '@material-ui/core/styles';
+import FormLabel from '@material-ui/core/FormLabel';
+import RadioGroup, { RadioGroupProps } from '@material-ui/core/RadioGroup';
+import FormControl, { FormControlProps } from '@material-ui/core/FormControl';
+import FormHelperText from '@material-ui/core/FormHelperText';
 import get from 'lodash/get';
 import { useInput, FieldTitle, InputProps, ChoicesProps } from 'ra-core';
 

diff --git a/packages/ra-ui-materialui/src/input/SearchInput.tsx b/packages/ra-ui-materialui/src/input/SearchInput.tsx
@@ -1,7 +1,8 @@
 import React, { FunctionComponent } from 'react';
 import PropTypes from 'prop-types';
 import SearchIcon from '@material-ui/icons/Search';
-import { makeStyles, InputAdornment } from '@material-ui/core';
+import { makeStyles } from '@material-ui/core/styles';
+import InputAdornment from '@material-ui/core/InputAdornment';
 import { TextFieldProps } from '@material-ui/core/TextField';
 import { useTranslate, InputProps } from 'ra-core';
 

diff --git a/packages/ra-ui-materialui/src/input/SelectArrayInput.tsx b/packages/ra-ui-materialui/src/input/SelectArrayInput.tsx
@@ -1,16 +1,14 @@
 import React, { FunctionComponent, useCallback } from 'react';
 import PropTypes from 'prop-types';
-import {
-    makeStyles,
-    Select,
-    MenuItem,
-    InputLabel,
-    Input,
-    FilledInput,
-    FormHelperText,
-    FormControl,
-    Chip,
-} from '@material-ui/core';
+import { makeStyles } from '@material-ui/core/styles';
+import Select from '@material-ui/core/Select';
+import MenuItem from '@material-ui/core/MenuItem';
+import InputLabel from '@material-ui/core/InputLabel';
+import Input from '@material-ui/core/Input';
+import FilledInput from '@material-ui/core/FilledInput';
+import FormHelperText from '@material-ui/core/FormHelperText';
+import FormControl from '@material-ui/core/FormControl';
+import Chip from '@material-ui/core/Chip';
 import classnames from 'classnames';
 import {
     FieldTitle,

diff --git a/packages/ra-ui-materialui/src/layout/Confirm.js b/packages/ra-ui-materialui/src/layout/Confirm.js
@@ -7,7 +7,7 @@ import DialogContentText from '@material-ui/core/DialogContentText';
 import DialogTitle from '@material-ui/core/DialogTitle';
 import Button from '@material-ui/core/Button';
 import { makeStyles } from '@material-ui/core/styles';
-import { fade } from '@material-ui/core/styles/colorManipulator';
+import colorManipulator from '@material-ui/core/styles';
 import ActionCheck from '@material-ui/icons/CheckCircle';
 import AlertError from '@material-ui/icons/ErrorOutline';
 import classnames from 'classnames';
@@ -24,7 +24,10 @@ const useStyles = makeStyles(
         confirmWarning: {
             color: theme.palette.error.main,
             '&:hover': {
-                backgroundColor: fade(theme.palette.error.main, 0.12),
+                backgroundColor: colorManipulator.fade(
+                    theme.palette.error.main,
+                    0.12
+                ),
                 // Reset on mouse devices
                 '@media (hover: none)': {
                     backgroundColor: 'transparent',

diff --git a/packages/ra-ui-materialui/src/layout/Menu.js b/packages/ra-ui-materialui/src/layout/Menu.js
@@ -2,7 +2,8 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { shallowEqual, useSelector } from 'react-redux';
 import inflection from 'inflection';
-import { makeStyles, useMediaQuery } from '@material-ui/core';
+import { makeStyles } from '@material-ui/core/styles';
+import useMediaQuery from '@material-ui/core/useMediaQuery';
 import DefaultIcon from '@material-ui/icons/ViewList';
 import classnames from 'classnames';
 import { getResources, useTranslate } from 'ra-core';

diff --git a/packages/ra-ui-materialui/src/layout/Sidebar.js b/packages/ra-ui-materialui/src/layout/Sidebar.js
@@ -1,7 +1,9 @@
 import React, { useEffect, Children, cloneElement } from 'react';
 import PropTypes from 'prop-types';
 import { useDispatch, useSelector } from 'react-redux';
-import { Drawer, makeStyles, useMediaQuery } from '@material-ui/core';
+import { makeStyles } from '@material-ui/core/styles';
+import useMediaQuery from '@material-ui/core/useMediaQuery';
+import Drawer from '@material-ui/core/Drawer';
 import lodashGet from 'lodash/get';
 import { setSidebarVisibility } from 'ra-core';
 

diff --git a/packages/ra-ui-materialui/src/list/BulkActionsToolbar.js b/packages/ra-ui-materialui/src/list/BulkActionsToolbar.js
@@ -3,8 +3,7 @@ import PropTypes from 'prop-types';
 import classnames from 'classnames';
 import Toolbar from '@material-ui/core/Toolbar';
 import Typography from '@material-ui/core/Typography';
-import { makeStyles } from '@material-ui/core/styles';
-import { lighten } from '@material-ui/core/styles/colorManipulator';
+import colorManipulator, { makeStyles } from '@material-ui/core/styles';
 import { useTranslate, sanitizeListRestProps } from 'ra-core';
 
 import TopToolbar from '../layout/TopToolbar';
@@ -20,7 +19,10 @@ const useStyles = makeStyles(
             justifyContent: 'space-between',
             backgroundColor:
                 theme.palette.type === 'light'
-                    ? lighten(theme.palette.primary.light, 0.85)
+                    ? colorManipulator.lighten(
+                          theme.palette.primary.light,
+                          0.85
+                      )
                     : theme.palette.primary.dark,
             minHeight: theme.spacing(8),
             height: theme.spacing(8),

diff --git a/packages/ra-ui-materialui/src/list/DatagridRow.js b/packages/ra-ui-materialui/src/list/DatagridRow.js
@@ -10,7 +10,9 @@ import React, {
 } from 'react';
 import PropTypes from 'prop-types';
 import classnames from 'classnames';
-import { TableCell, TableRow, Checkbox } from '@material-ui/core';
+import TableCell from '@material-ui/core/TableCell';
+import TableRow from '@material-ui/core/TableRow';
+import Checkbox from '@material-ui/core/Checkbox';
 import { linkToRecord } from 'ra-core';
 import isEqual from 'lodash/isEqual';
 

diff --git a/packages/ra-ui-materialui/src/list/FilterButton.spec.js b/packages/ra-ui-materialui/src/list/FilterButton.spec.js
@@ -2,7 +2,7 @@ import React from 'react';
 import expect from 'expect';
 import { render, cleanup, fireEvent } from '@testing-library/react';
 import { ThemeProvider } from '@material-ui/styles';
-import { createMuiTheme } from '@material-ui/core';
+import { createMuiTheme } from '@material-ui/core/styles';
 
 import FilterButton from './FilterButton';
 import TextInput from '../input/TextInput';

diff --git a/packages/ra-ui-materialui/src/list/Pagination.js b/packages/ra-ui-materialui/src/list/Pagination.js
@@ -1,6 +1,8 @@
 import React, { useEffect, useCallback } from 'react';
 import PropTypes from 'prop-types';
-import { TablePagination, Toolbar, useMediaQuery } from '@material-ui/core';
+import TablePagination from '@material-ui/core/TablePagination';
+import Toolbar from '@material-ui/core/Toolbar';
+import useMediaQuery from '@material-ui/core/useMediaQuery';
 import {
     useTranslate,
     sanitizeListRestProps,