Skip to content

Commit

Permalink
Upgrade modules to material ui v4
Browse files Browse the repository at this point in the history
  • Loading branch information
@drublic
drublic committed Jun 22, 2019
1 parent 6cdc7ab commit 1989686
Show file tree
Hide file tree
Showing 28 changed files with 126 additions and 200 deletions.
12 changes: 0 additions & 12 deletions .eslintrc.js
View file

This file was deleted.

6 changes: 3 additions & 3 deletions examples/form/EditForm.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,9 +8,9 @@ import data from './data'

const styles = theme => ({
root: {
marginTop: theme.spacing.unit * 3,
marginLeft: theme.spacing.unit * 3,
marginRight: theme.spacing.unit * 3,
marginTop: theme.spacing(3),
marginLeft: theme.spacing(3),
marginRight: theme.spacing(3),
},
})

Expand Down
4 changes: 2 additions & 2 deletions examples/list/UserListing.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,8 +13,8 @@ import headers from './headers'

const styles = theme => ({
root: {
marginLeft: theme.spacing.unit * 3,
marginRight: theme.spacing.unit * 3,
marginLeft: theme.spacing(3),
marginRight: theme.spacing(3),
},
})

Expand Down
19 changes: 7 additions & 12 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,11 +21,11 @@
"prepublishOnly": "rm -rf ./dist && yarn build:babel"
},
"dependencies": {
"@date-io/moment": "^1.3.6",
"@material-ui/core": "^4.1.0",
"@material-ui/icons": "^4.1.0",
"@material-ui/pickers": "^3.1.0",
"@material-ui/styles": "^4.1.0",
"@date-io/moment": "^1.3.7",
"@material-ui/core": "^4.1.1",
"@material-ui/icons": "^4.2.0",
"@material-ui/pickers": "^3.1.1",
"@material-ui/styles": "^4.1.1",
"classnames": "^2.2.6",
"init-uuid": "^1.2.0",
"is-url": "^1.2.4",
Expand All @@ -39,7 +39,7 @@
"react-jss": "^8.6.1",
"react-router-dom": "^5.0.1",
"recompose": "^0.30.0",
"typescript": "^3.5.1",
"typescript": "^3.5.2",
"vanilla-store": "^0.4.0"
},
"peerDependencies": {
Expand All @@ -57,16 +57,11 @@
"enzyme": "^3.10.0",
"enzyme-adapter-react-16": "^1.14.0",
"enzyme-to-json": "^3.3.5",
"eslint": "^5.16.0",
"eslint-config-airbnb": "^17.1.0",
"eslint-plugin-import": "^2.17.3",
"eslint-plugin-jsx-a11y": "^6.2.1",
"eslint-plugin-react": "^7.13.0",
"express": "^4.17.1",
"jest-enzyme": "^7.0.2",
"react-mock-router": "^1.0.15",
"react-scripts": "^3.0.1",
"tslint": "^5.17.0",
"tslint": "^5.18.0",
"tslint-react": "^4.0.0"
},
"keywords": [
Expand Down
4 changes: 2 additions & 2 deletions src/AddButton/AddButton.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,8 +10,8 @@ import AddIcon from '@material-ui/icons/Add'
const styles = theme => ({
button: {
position: 'fixed',
right: theme.spacing.unit * 3,
bottom: theme.spacing.unit * 3,
right: theme.spacing(3),
bottom: theme.spacing(3),
},
})

Expand Down
2 changes: 1 addition & 1 deletion src/BackButton/BackButtonBranch.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ import BackIcon from '@material-ui/icons/ArrowBackIos'

const styles = theme => ({
leftIcon: {
marginRight: theme.spacing.unit,
marginRight: theme.spacing(),
},
})

Expand Down
7 changes: 5 additions & 2 deletions src/Base/Base.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ const withBase = Component => class extends React.Component {
isHeaderFixed: PropTypes.bool,
hasHeader: PropTypes.bool,
hasCookieInfo: PropTypes.bool,
history: PropTypes.objectOf(PropTypes.any).isRequired,
history: PropTypes.objectOf(PropTypes.any),
}

static defaultProps = {
Expand All @@ -22,6 +22,7 @@ const withBase = Component => class extends React.Component {
hasCookieInfo: false,
menuOpen: false,
rightContent: null,
history: undefined,
}

constructor(props) {
Expand Down Expand Up @@ -77,7 +78,9 @@ const withBase = Component => class extends React.Component {
redirectTo(link) {
const { history } = this.props

history.push(link)
if (history) {
history.push(link)
}
}

handleCookieInfoAccept() {
Expand Down
10 changes: 5 additions & 5 deletions src/Base/BaseBranch.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,20 +19,20 @@ const styles = theme => ({
transition: '0.25s',
},
appFrameWithCookieInfo: {
marginTop: theme.spacing.unit * 6,
minHeight: `calc(100vh - ${theme.spacing.unit * 6}px)`,
marginTop: theme.spacing(6),
minHeight: `calc(100vh - ${theme.spacing(6)}px)`,
},
content: {
width: `calc(100vw - ${theme.spacing.unit * 3 * 2}px)`,
width: `calc(100vw - ${theme.spacing(3) * 2}px)`,
flexGrow: 1,
backgroundColor: theme.palette.background.default,
padding: theme.spacing.unit * 3,
padding: theme.spacing(3),
transition: theme.transitions.create('margin', {
easing: theme.transitions.easing.sharp,
duration: theme.transitions.duration.leavingScreen,
}),
height: 'calc(100% - 56px)',
marginTop: theme.spacing.unit * 8,
marginTop: theme.spacing(8),
marginLeft: -drawerWidth,
},
contentShift: {
Expand Down
8 changes: 4 additions & 4 deletions src/CookieInfo/CookieInfo.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,10 +18,10 @@ const styles = theme => ({
zIndex: 3000,
display: 'flex',
backgroundColor: theme.palette.secondary.main,
paddingTop: theme.spacing.unit,
paddingBottom: theme.spacing.unit,
paddingLeft: theme.spacing.unit * 3,
paddingRight: theme.spacing.unit * 3,
paddingTop: theme.spacing(),
paddingBottom: theme.spacing(),
paddingLeft: theme.spacing(3),
paddingRight: theme.spacing(3),
transform: 'translate(0, -100%)',
opacity: 0,
transition: 'transform 0.25s, opacity 0s 0.25s',
Expand Down
6 changes: 3 additions & 3 deletions src/Dashboard/DashboardBranch.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,13 +7,13 @@ import DashboardGroup from './DashboardGroup'
const styles = theme => ({
root: {
flexGrow: 1,
maxWidth: theme.spacing.unit * 140,
maxWidth: theme.spacing(140),
marginLeft: 'auto',
marginRight: 'auto',
},
headline: {
marginTop: theme.spacing.unit * 3,
marginBottom: theme.spacing.unit * 2,
marginTop: theme.spacing(3),
marginBottom: theme.spacing(2),
},
})

Expand Down
4 changes: 2 additions & 2 deletions src/Dashboard/DashboardCard.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,11 +17,11 @@ const styles = theme => ({
cursor: 'pointer',
},
content: {
paddingBottom: `${theme.spacing.unit * 2}px !important`,
paddingBottom: `${theme.spacing(2)}px !important`,
},
avatar: {
float: 'left',
marginRight: theme.spacing.unit * 2,
marginRight: theme.spacing(2),
backgroundColor: theme.palette.secondary.dark,
},
title: {
Expand Down
6 changes: 3 additions & 3 deletions src/Dashboard/DashboardGroup.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,8 +11,8 @@ import DashboardCard from './DashboardCard'

const styles = theme => ({
headline: {
marginTop: theme.spacing.unit * 3,
marginBottom: theme.spacing.unit * 2,
marginTop: theme.spacing(3),
marginBottom: theme.spacing(2),
},
})

Expand All @@ -29,7 +29,7 @@ const DashboardGroup = ({
</Typography>
</div>

<Grid container spacing={16}>
<Grid container spacing={2}>

{cards ? cards.map(card => (
<Grid item xs={12} sm={4} key={`group-card-${card.id}`}>
Expand Down
2 changes: 1 addition & 1 deletion src/Drawer/Drawer.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ const styles = theme => ({
alignItems: 'center',
justifyContent: 'flex-end',
padding: '0 8px',
height: theme.spacing.unit * 8,
height: theme.spacing(8),
},
})

Expand Down
18 changes: 10 additions & 8 deletions src/Form/FormBranch.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,12 +11,12 @@ import FormSubmitButton from './FormSubmitButton'

const styles = theme => ({
title: {
marginLeft: theme.spacing.unit,
marginRight: theme.spacing.unit,
marginLeft: theme.spacing(),
marginRight: theme.spacing(),
},
errorMessage: {
marginTop: theme.spacing.unit * 2,
marginBottom: theme.spacing.unit * 2,
marginTop: theme.spacing(2),
marginBottom: theme.spacing(2),
color: theme.palette.error.main,
},
})
Expand Down Expand Up @@ -79,7 +79,7 @@ const FormBranch = ({
>
{field.title ? (
<Typography
variant={field.integrated ? 'subheading' : 'title'}
variant={field.integrated ? 'subtitle2' : 'subtitle1'}
className={classes.title}
>
{field.title}
Expand All @@ -102,9 +102,11 @@ const FormBranch = ({

{children}

{error ? (
<Typography variant="body2" className={classes.errorMessage}>{errorMessage}</Typography>
) : null}
{error && (
<Typography variant="body2" className={classes.errorMessage}>
{errorMessage}
</Typography>
)}

<FormSubmitButton
onSubmit={handleSubmit}
Expand Down
20 changes: 10 additions & 10 deletions src/Form/FormFieldBranch.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,12 +16,12 @@ const styles = theme => ({
},

headline: {
marginTop: theme.spacing.unit * 3,
marginTop: theme.spacing(3),
},

field: {
marginLeft: theme.spacing.unit,
marginRight: theme.spacing.unit,
marginLeft: theme.spacing(),
marginRight: theme.spacing(),
verticalAlign: 'top',
},

Expand All @@ -30,25 +30,25 @@ const styles = theme => ({
},

fieldDate: {
marginTop: theme.spacing.unit * 2,
marginBottom: theme.spacing.unit,
marginTop: theme.spacing(2),
marginBottom: theme.spacing(),
},

widthSmall: {
width: `calc(25% - ${theme.spacing.unit * 2}px)`,
width: `calc(25% - ${theme.spacing(2)}px)`,
},

widthMid: {
width: `calc(50% - ${theme.spacing.unit * 2}px)`,
width: `calc(50% - ${theme.spacing(2)}px)`,
},

widthFull: {
width: `calc(100% - ${theme.spacing.unit * 2}px)`,
width: `calc(100% - ${theme.spacing(2)}px)`,
},

divider: {
marginTop: theme.spacing.unit * 3,
marginBottom: theme.spacing.unit * 3,
marginTop: theme.spacing(3),
marginBottom: theme.spacing(3),
},
})

Expand Down
3 changes: 0 additions & 3 deletions src/Form/FormFieldDate.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,6 @@ import PropTypes from 'prop-types'

import KeyboardArrowLeftIcon from '@material-ui/icons/KeyboardArrowLeft'
import KeyboardArrowRightIcon from '@material-ui/icons/KeyboardArrowRight'
import EventIcon from '@material-ui/icons/Event'
import DateRangeIcon from '@material-ui/icons/DateRange'
import AccessTimeIcon from '@material-ui/icons/AccessTime'
import MomentUtils from '@date-io/moment'
Expand Down Expand Up @@ -57,13 +56,11 @@ const FormFieldDate = ({
<Component
id={id}
label={title}
keyboard
clearable
value={new Date(value).toISOString()}
onChange={handleChange(id)}
format={format}
required={isRequired}
keyboardIcon={<EventIcon />}
className={className}
helperText={helperText}
{...additionalAttributes}
Expand Down
3 changes: 2 additions & 1 deletion src/Form/FormFieldInput.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -84,7 +84,7 @@ const FormFieldInput = ({
FormFieldInput.propTypes = {
id: PropTypes.string.isRequired,
type: PropTypes.string,
title: PropTypes.string.isRequired,
title: PropTypes.string,
value: PropTypes.oneOfType([
PropTypes.string,
PropTypes.array,
Expand Down Expand Up @@ -113,6 +113,7 @@ FormFieldInput.propTypes = {

FormFieldInput.defaultProps = {
type: 'text',
title: undefined,
value: '',
defaultValue: undefined,
isMultiline: false,
Expand Down
2 changes: 1 addition & 1 deletion src/Form/FormFieldListBranch.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@ const styles = theme => ({
},
list: {
position: 'absolute',
top: theme.spacing.unit * 9,
top: theme.spacing(9),
width: '100%',
height: 0,
opacity: 0,
Expand Down
10 changes: 5 additions & 5 deletions src/Form/FormGroupWrapper.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,13 +6,13 @@ import { Paper, withStyles } from '@material-ui/core'

const styles = theme => ({
group: {
marginTop: theme.spacing.unit,
marginBottom: theme.spacing.unit,
padding: theme.spacing.unit * 2,
paddingTop: theme.spacing.unit * 3,
marginTop: theme.spacing(),
marginBottom: theme.spacing(),
padding: theme.spacing(2),
paddingTop: theme.spacing(3),
},
groupIntegrated: {
paddingTop: theme.spacing.unit * 3,
paddingTop: theme.spacing(3),
},
hidden: {
display: 'none',
Expand Down
Loading

0 comments on commit 1989686

Please sign in to comment.