diff --git a/.eslintrc.js b/.eslintrc.js index d0d26e3..431e6e8 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -6,6 +6,7 @@ module.exports = { browser: true, }, rules: { + 'import/no-extraneous-dependencies': 0, 'react/jsx-filename-extension': ['error', { extensions: ['.js', '.jsx'] }], 'react/require-default-props': 0, }, diff --git a/package.json b/package.json index 896f531..9788ed6 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "react-odometerjs", - "version": "2.0.0", + "version": "2.1.0", "description": "Odometer.js as a React component", "main": "./dist/index.js", "repository": { @@ -23,9 +23,11 @@ }, "homepage": "https://github.com/inferusvv/react-odometerjs#readme", "dependencies": { - "odometer": "^0.4.8", - "prop-types": "^15.6.0", - "react": "^16.0.0" + "odometer": "^0.4.8" + }, + "peerDependencies": { + "react": "^16.3.0", + "react-dom": "^16.3.0" }, "devDependencies": { "babel-cli": "^6.23.0", @@ -37,7 +39,8 @@ "eslint-config-airbnb": "^17.0.0", "eslint-plugin-import": "^2.13.0", "eslint-plugin-jsx-a11y": "^6.1.0", - "eslint-plugin-react": "^7.10.0" + "eslint-plugin-react": "^7.10.0", + "prop-types": "^15.6.2" }, "scripts": { "build": "babel src --out-dir dist", diff --git a/src/index.js b/src/index.js index f2dbac3..8cbd47b 100644 --- a/src/index.js +++ b/src/index.js @@ -15,10 +15,16 @@ export default class ReactOdometer extends PureComponent { value: PropTypes.number.isRequired, }; + constructor(props) { + super(props); + + this.node = React.createRef(); + } + componentDidMount() { const { value, ...options } = this.props; this.odometer = new Odometer({ - el: this.node, + el: this.node.current, value, ...options, }); @@ -31,9 +37,7 @@ export default class ReactOdometer extends PureComponent { render() { return React.createElement('div', { - ref: (node) => { - this.node = node; - }, + ref: this.node, }); } } diff --git a/yarn.lock b/yarn.lock index 44523c2..f52b449 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1921,6 +1921,10 @@ js-tokens@^3.0.0, js-tokens@^3.0.2: version "3.0.2" resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-3.0.2.tgz#9866df395102130e38f7f996bceb65443209c25b" +"js-tokens@^3.0.0 || ^4.0.0": + version "4.0.0" + resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-4.0.0.tgz#19203fb59991df98e3a287050d4647cdeaf32499" + js-yaml@^3.11.0: version "3.12.0" resolved "https://registry.yarnpkg.com/js-yaml/-/js-yaml-3.12.0.tgz#eaed656ec8344f10f527c6bfa1b6e2244de167d1" @@ -2032,12 +2036,18 @@ lodash@^4.17.5: version "4.17.10" resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.10.tgz#1b7793cf7259ea38fb3661d4d38b3260af8ae4e7" -loose-envify@^1.0.0, loose-envify@^1.1.0, loose-envify@^1.3.1: +loose-envify@^1.0.0, loose-envify@^1.1.0: version "1.3.1" resolved "https://registry.yarnpkg.com/loose-envify/-/loose-envify-1.3.1.tgz#d1a8ad33fa9ce0e713d65fdd0ac8b748d478c848" dependencies: js-tokens "^3.0.0" +loose-envify@^1.3.1: + version "1.4.0" + resolved "https://registry.yarnpkg.com/loose-envify/-/loose-envify-1.4.0.tgz#71ee51fa7be4caec1a63839f7e682d8132d30caf" + dependencies: + js-tokens "^3.0.0 || ^4.0.0" + micromatch@^2.1.5: version "2.3.11" resolved "https://registry.yarnpkg.com/micromatch/-/micromatch-2.3.11.tgz#86677c97d1720b363431d04d0d15293bd38c1565" @@ -2413,9 +2423,9 @@ rc@^1.1.7: minimist "^1.2.0" strip-json-comments "~2.0.1" -react@^16.0.0: - version "16.0.0" - resolved "https://registry.yarnpkg.com/react/-/react-16.0.0.tgz#ce7df8f1941b036f02b2cca9dbd0cb1f0e855e2d" +react@^16.4.1: + version "16.4.1" + resolved "https://registry.yarnpkg.com/react/-/react-16.4.1.tgz#de51ba5764b5dbcd1f9079037b862bd26b82fe32" dependencies: fbjs "^0.8.16" loose-envify "^1.1.0"