Skip to content

Commit dc52232

Browse files
kybargdiegohaz
authored andcommitted
[master] Update dependencies and adjust code to the new API (#355)
* Update dependencies and adjust code to the new API * Drop support of node 6 * Revert to styled-conponents 3 * Fix eslint errors * Remove jest-enzyme
1 parent e52205c commit dc52232

File tree

26 files changed

+6453
-4273
lines changed

26 files changed

+6453
-4273
lines changed

.babelrc

Lines changed: 47 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,34 +1,67 @@
11
{
22
"presets": [
3-
["env", {
4-
"modules": false
5-
}],
6-
"react",
7-
"stage-1"
3+
[
4+
"@babel/preset-env",
5+
{
6+
"modules": false
7+
}
8+
],
9+
"@babel/preset-react"
810
],
911
"plugins": [
10-
"react-hot-loader/babel"
12+
"react-hot-loader/babel",
13+
"@babel/plugin-syntax-dynamic-import",
14+
"@babel/plugin-syntax-import-meta",
15+
"@babel/plugin-proposal-class-properties",
16+
"@babel/plugin-proposal-json-strings",
17+
[
18+
"@babel/plugin-proposal-decorators",
19+
{
20+
"legacy": true
21+
}
22+
],
23+
"@babel/plugin-proposal-function-sent",
24+
"@babel/plugin-proposal-export-namespace-from",
25+
"@babel/plugin-proposal-numeric-separator",
26+
"@babel/plugin-proposal-throw-expressions",
27+
"@babel/plugin-proposal-export-default-from",
28+
"@babel/plugin-proposal-logical-assignment-operators",
29+
"@babel/plugin-proposal-optional-chaining",
30+
[
31+
"@babel/plugin-proposal-pipeline-operator",
32+
{
33+
"proposal": "minimal"
34+
}
35+
],
36+
"@babel/plugin-proposal-nullish-coalescing-operator",
37+
"@babel/plugin-proposal-do-expressions"
1138
],
1239
"env": {
1340
"development": {
1441
"plugins": [
15-
"transform-es2015-modules-commonjs",
16-
["styled-components", {
17-
"minify": false
18-
}]
42+
"@babel/plugin-transform-modules-commonjs",
43+
[
44+
"styled-components",
45+
{
46+
"minify": false
47+
}
48+
]
1949
]
2050
},
2151
"test": {
2252
"plugins": [
23-
"transform-es2015-modules-commonjs"
53+
"@babel/plugin-transform-modules-commonjs"
2454
]
2555
},
2656
"production": {
2757
"plugins": [
2858
"transform-react-remove-prop-types",
29-
["styled-components", {
30-
"displayName": false
31-
}]
59+
[
60+
"styled-components",
61+
{
62+
"displayName": false
63+
}
64+
]
3265
]
3366
}
3467
}

.travis.yml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
language: node_js
22
node_js:
3-
- v6
3+
- 8
44
script:
55
- npm run lint
66
- npm test -- --coverage

package.json

Lines changed: 51 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -36,54 +36,67 @@
3636
]
3737
},
3838
"devDependencies": {
39-
"@storybook/addon-actions": "^3.0.0",
40-
"@storybook/react": "^3.0.0",
41-
"@webpack-blocks/dev-server2": "^0.4.0",
42-
"@webpack-blocks/webpack2": "^0.4.0",
43-
"babel-core": "^6.24.1",
44-
"babel-eslint": "^8.0.1",
45-
"babel-jest": "^22.1.0",
46-
"babel-loader": "^7.0.0",
47-
"babel-plugin-styled-components": "^1.1.4",
48-
"babel-plugin-transform-es2015-modules-commonjs": "^6.24.1",
49-
"babel-plugin-transform-react-remove-prop-types": "^0.4.0",
50-
"babel-preset-env": "^1.3.3",
51-
"babel-preset-react": "^6.24.1",
52-
"babel-preset-stage-1": "^6.24.1",
39+
"@babel/core": "^7.0.0",
40+
"@babel/plugin-proposal-class-properties": "^7.0.0",
41+
"@babel/plugin-proposal-decorators": "^7.0.0",
42+
"@babel/plugin-proposal-do-expressions": "^7.0.0",
43+
"@babel/plugin-proposal-export-default-from": "^7.0.0",
44+
"@babel/plugin-proposal-export-namespace-from": "^7.0.0",
45+
"@babel/plugin-proposal-function-sent": "^7.0.0",
46+
"@babel/plugin-proposal-json-strings": "^7.0.0",
47+
"@babel/plugin-proposal-logical-assignment-operators": "^7.0.0",
48+
"@babel/plugin-proposal-nullish-coalescing-operator": "^7.0.0",
49+
"@babel/plugin-proposal-numeric-separator": "^7.0.0",
50+
"@babel/plugin-proposal-optional-chaining": "^7.0.0",
51+
"@babel/plugin-proposal-pipeline-operator": "^7.0.0",
52+
"@babel/plugin-proposal-throw-expressions": "^7.0.0",
53+
"@babel/plugin-syntax-dynamic-import": "^7.0.0",
54+
"@babel/plugin-syntax-import-meta": "^7.0.0",
55+
"@babel/plugin-transform-modules-commonjs": "^7.0.0",
56+
"@babel/preset-env": "^7.0.0",
57+
"@babel/preset-react": "^7.0.0",
58+
"@storybook/addon-actions": "^4.1.4",
59+
"@storybook/react": "^4.1.4",
60+
"babel-core": "^7.0.0-bridge.0",
61+
"babel-eslint": "^10.0.1",
62+
"babel-jest": "^23.6.0",
63+
"babel-loader": "^8.0.5",
64+
"babel-plugin-styled-components": "^1.10.0",
65+
"babel-plugin-transform-react-remove-prop-types": "^0.4.21",
5366
"copyfiles": "^2.0.0",
5467
"cross-env": "^5.0.0",
55-
"enzyme": "^3.1.0",
56-
"enzyme-adapter-react-16": "^1.0.1",
57-
"eslint": "^4.9.0",
58-
"eslint-config-airbnb": "^16.1.0",
59-
"eslint-import-resolver-webpack": "^0.8.1",
68+
"enzyme": "^3.8.0",
69+
"enzyme-adapter-react-16": "^1.7.1",
70+
"eslint": "^5.12.0",
71+
"eslint-config-airbnb": "^17.1.0",
72+
"eslint-import-resolver-webpack": "^0.10.1",
6073
"eslint-plugin-import": "^2.2.0",
6174
"eslint-plugin-jsx-a11y": "^6.0.2",
6275
"eslint-plugin-react": "^7.0.1",
63-
"file-loader": "^1.1.5",
76+
"file-loader": "^3.0.1",
77+
"happypack": "^5.0.1",
6478
"html-webpack-plugin": "^3.2.0",
65-
"jest-cli": "^22.1.4",
66-
"opn-cli": "^3.1.0",
67-
"raw-loader": "^0.5.1",
68-
"react-test-renderer": "^16.0.0",
79+
"jest-cli": "^23.6.0",
80+
"opn-cli": "^4.0.0",
81+
"raw-loader": "^1.0.0",
6982
"rimraf": "^2.6.1",
70-
"url-loader": "^0.6.2",
71-
"webpack": "^3.10.0",
72-
"webpack-blocks-happypack": "^0.1.3",
73-
"webpack-blocks-split-vendor": "^0.2.0",
74-
"webpack-dev-server": "^2.3.0"
83+
"uglifyjs-webpack-plugin": "^2.1.1",
84+
"url-loader": "^1.1.2",
85+
"webpack": "^4.28.3",
86+
"webpack-cli": "^3.2.0",
87+
"webpack-dev-server": "^3.1.14",
88+
"webpack-md5-hash": "^0.0.6"
7589
},
7690
"dependencies": {
77-
"history": "^4.6.1",
7891
"lodash": "^4.17.4",
79-
"prop-types": "^15.5.8",
80-
"react": "^16.0.0",
81-
"react-dom": "^16.0.0",
82-
"react-hot-loader": "^3.1.1",
92+
"prop-types": "^15.6.2",
93+
"react": "^16.7.0",
94+
"react-dom": "^16.7.0",
95+
"react-hot-loader": "^4.6.3",
8396
"react-modal": "^3.1.11",
84-
"react-router-dom": "^4.1.1",
85-
"styled-components": "^3.0.2",
86-
"styled-theme": "^0.3.0",
87-
"styled-tools": "^0.4.0"
97+
"react-router-dom": "^4.3.1",
98+
"styled-components": "^3.5.0-0",
99+
"styled-theme": "^0.3.3",
100+
"styled-tools": "^1.6.0"
88101
}
89102
}

private/jest/componentsMock.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import PropTypes from 'prop-types'
44

55
module.exports = new Proxy({}, {
66
get: (target, property) => {
7-
const Mock = props => <span>{props.children}</span>
7+
const Mock = ({ children }) => <span>{children}</span>
88

99
Mock.displayName = property
1010
Mock.propTypes = {
Lines changed: 8 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,10 @@
11
const baseConfig = require('../../webpack.config')
22

3-
module.exports = storybookBaseConfig =>
4-
Object.assign({}, storybookBaseConfig, {
5-
resolve: Object.assign({}, storybookBaseConfig.resolve, {
6-
modules: baseConfig.resolve.modules,
7-
}),
8-
module: Object.assign({}, storybookBaseConfig.module, {
9-
rules: storybookBaseConfig.module.rules.concat(baseConfig.module.rules.slice(1)),
10-
}),
11-
})
3+
module.exports = storybookBaseConfig => Object.assign({}, storybookBaseConfig, {
4+
resolve: Object.assign({}, storybookBaseConfig.resolve, {
5+
modules: baseConfig.resolve.modules,
6+
}),
7+
module: Object.assign({}, storybookBaseConfig.module, {
8+
rules: storybookBaseConfig.module.rules.concat(baseConfig.module.rules.slice(1)),
9+
}),
10+
})

src-example/components/atoms/Button/index.js

Lines changed: 5 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -7,11 +7,9 @@ import { ifProp } from 'styled-tools'
77

88
const fontSize = ({ height }) => `${height / 40}rem`
99

10-
const backgroundColor = ({ transparent, disabled }) =>
11-
transparent ? 'transparent' : palette(disabled ? 2 : 1)
10+
const backgroundColor = ({ transparent, disabled }) => transparent ? 'transparent' : palette(disabled ? 2 : 1)
1211

13-
const foregroundColor = ({ transparent, disabled }) =>
14-
transparent ? palette(disabled ? 2 : 1) : palette('grayscale', 0, true)
12+
const foregroundColor = ({ transparent, disabled }) => transparent ? palette(disabled ? 2 : 1) : palette('grayscale', 0, true)
1513

1614
const hoverBackgroundColor = ({ disabled, transparent }) => !disabled && !transparent && palette(0)
1715
const hoverForegroundColor = ({ disabled, transparent }) => !disabled && transparent && palette(0)
@@ -54,9 +52,10 @@ const Anchor = styled.a`${styles}`
5452
const StyledButton = styled.button`${styles}`
5553

5654
const Button = ({ type, ...props }) => {
57-
if (props.to) {
55+
const { to, href } = props
56+
if (to) {
5857
return <StyledLink {...props} />
59-
} else if (props.href) {
58+
} if (href) {
6059
return <Anchor {...props} />
6160
}
6261
return <StyledButton {...props} type={type} />

src-example/components/atoms/Input/index.js

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -35,9 +35,10 @@ const StyledSelect = styled.select`${styles}`
3535
const StyledInput = styled.input`${styles}`
3636

3737
const Input = ({ ...props }) => {
38-
if (props.type === 'textarea') {
38+
const { type } = props
39+
if (type === 'textarea') {
3940
return <StyledTextarea {...props} />
40-
} else if (props.type === 'select') {
41+
} if (type === 'select') {
4142
return <StyledSelect {...props} />
4243
}
4344
return <StyledInput {...props} />

src-example/components/atoms/Link/index.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,8 @@ const StyledNavLink = styled(({
2222
const Anchor = styled.a`${styles}`
2323

2424
const Link = ({ ...props }) => {
25-
if (props.to) {
25+
const { to } = props
26+
if (to) {
2627
return <StyledNavLink {...props} />
2728
}
2829
return <Anchor {...props} />

src-example/components/atoms/Tooltip/index.js

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -13,13 +13,11 @@ const opposites = {
1313

1414
export const opposite = ({ position }) => opposites[position]
1515

16-
export const perpendicular = ({ position }) =>
17-
position === 'left' || position === 'right' ? 'top' : 'left'
16+
export const perpendicular = ({ position }) => position === 'left' || position === 'right' ? 'top' : 'left'
1817

1918
export const perpendicularOpposite = props => opposites[perpendicular(props)]
2019

21-
export const perpendicularAxis = ({ position }) =>
22-
position === 'left' || position === 'right' ? 'Y' : 'X'
20+
export const perpendicularAxis = ({ position }) => position === 'left' || position === 'right' ? 'Y' : 'X'
2321

2422
const backgroundColor = ifProp('reverse', 'rgba(255, 255, 255, 0.85)', 'rgba(0, 0, 0, 0.85)')
2523

src-example/components/molecules/Feature/index.js

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,9 @@ import PropTypes from 'prop-types'
33
import styled from 'styled-components'
44
import { ifProp } from 'styled-tools'
55

6-
import { Icon, Link, Paragraph, Heading, Badge, PreformattedText } from 'components'
6+
import {
7+
Icon, Link, Paragraph, Heading, Badge, PreformattedText,
8+
} from 'components'
79

810
const Wrapper = styled.div`
911
position: relative;
@@ -44,6 +46,7 @@ const StyledBadge = styled(Badge)`
4446
const Feature = ({
4547
icon, title, link, code, children, ...props
4648
}) => {
49+
const { soon } = props
4750
return (
4851
<Wrapper {...props}>
4952
{icon && <StyledIcon icon={icon} width={64} />}
@@ -54,7 +57,7 @@ const Feature = ({
5457
<Paragraph>{children}</Paragraph>
5558
{code && <PreformattedText block>{code}</PreformattedText>}
5659
</Text>
57-
{props.soon && <StyledBadge palette="grayscale">soon</StyledBadge>}
60+
{soon && <StyledBadge palette="grayscale">soon</StyledBadge>}
5861
</Wrapper>
5962
)
6063
}

0 commit comments

Comments
 (0)