diff --git a/README.md b/README.md index c3ba9775..f8858eb2 100644 --- a/README.md +++ b/README.md @@ -153,7 +153,7 @@ Note that `delay={0}` will automatically start the count up. import { useCountUp } from 'react-countup'; const SimpleHook = () => { - useCountUp({ end: 1234567 }); + useCountUp({ ref: "counter", end: 1234567 }); return ; }; ``` diff --git a/demo/package.json b/demo/package.json index 7c4bf2fd..90931317 100644 --- a/demo/package.json +++ b/demo/package.json @@ -4,15 +4,15 @@ "private": true, "dependencies": { "prop-types": "^15.6.2", - "react": "^16.10.2", - "react-countup": "^4.2.2", - "react-dom": "^16.10.2", - "react-feather": "^2.0.3", - "react-github-corner": "^2.3.0", - "react-live": "^2.2.1", - "react-scripts": "3.4.1", - "serve": "^11.2.0", - "styled-components": "^5.0.0" + "react": "^17.0.2", + "react-countup": "^5.0.0-0", + "react-dom": "^17.0.2", + "react-feather": "^2.0.9", + "react-github-corner": "^2.5.0", + "react-live": "^2.2.3", + "react-scripts": "4.0.3", + "serve": "^12.0.0", + "styled-components": "^5.3.0" }, "scripts": { "start": "react-scripts start", diff --git a/demo/src/App.js b/demo/src/App.js index e98b1bdc..82580933 100644 --- a/demo/src/App.js +++ b/demo/src/App.js @@ -190,17 +190,17 @@ const delayStart = ` const hook = ` () => { const { - countUp, start, pauseResume, reset, update } = useCountUp({ + ref: "counter", start: 0, end: 1234567, delay: 2, duration: 5, - onReset: () => console.log('Resetted!'), + onReset: () => console.log('Reseted!'), onUpdate: () => console.log('Updated!'), onPauseResume: () => console.log('Paused or resumed!'), onStart: () => console.log('Started! 💨'), @@ -208,7 +208,7 @@ const hook = ` }); return (
-
{countUp}
+
@@ -236,7 +236,7 @@ const App = () => ( - +