Move react to peerDependencies and use createRef

bezenson · Jul 10, 2018 · 88f3852 · 88f3852
1 parent 60ddc8b
commit 88f3852
Show file tree

Hide file tree

Showing 4 changed files with 31 additions and 13 deletions.
diff --git 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
@@ -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
@@ -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
@@ -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"