updated package and information guide and add step for hook

This commit is contained in:
Sambo Chea 2020-10-09 18:08:22 +07:00
parent 3ec76dcb62
commit 3d54da4f0e
3 changed files with 29 additions and 8 deletions

View File

@ -13,13 +13,17 @@ yarn add @cubetiq/react-use-countdown
```js ```js
import React from 'react'; import React from 'react';
import ReactDOM from 'react-dom'; import ReactDOM from 'react-dom';
// import the countdown hook here
import { useCountdown } from 'cubetiq-react-use-countdown'; import { useCountdown } from 'cubetiq-react-use-countdown';
const App = () => { const App = () => {
const { timeleft, start } = useCountdown(); const { timeleft, start } = useCountdown({
step: 1000,
});
return ( return (
<div> <div>
<button onClick={() => start(10000)}> Start Countdown </button> <button onClick={() => start(10000)}>Start Countdown</button>
<h1>Time left: {timeleft}</h1> <h1>Time left: {timeleft}</h1>
</div> </div>
); );
@ -29,6 +33,7 @@ ReactDOM.render(<App />, document.querySelector('#root'));
``` ```
### Contributors ### Contributors
Project's repository: [https://git.cubetiqs.com/CUBETIQ/react-use-countdown.git](https://git.cubetiqs.com/CUBETIQ/react-use-countdown.git) Project's repository: [React Countdown](https://git.cubetiqs.com/CUBETIQ/react-use-countdown.git)
- [@s.long](https://git.cubetiqs.com/s.long) - [@s.long](https://git.cubetiqs.com/s.long)
- [@sombochea](https://git.cubetiqs.com/sombochea) - [@sombochea](https://git.cubetiqs.com/sombochea)
- [@cubetiq](https://git.cubetiqs.com/CUBETIQ)

View File

@ -1,12 +1,16 @@
import React from 'react'; import React from 'react';
import ReactDOM from 'react-dom'; import ReactDOM from 'react-dom';
// import the countdown hook here
import { useCountdown } from 'cubetiq-react-use-countdown'; import { useCountdown } from 'cubetiq-react-use-countdown';
const App = () => { const App = () => {
const { timeleft, start } = useCountdown(); const { timeleft, start } = useCountdown({
step: 1000,
});
return ( return (
<div> <div>
<button onClick={() => start(10000)}> Start Countdown </button> <button onClick={() => start(10000)}>Start Countdown</button>
<h1>Time left: {timeleft}</h1> <h1>Time left: {timeleft}</h1>
</div> </div>
); );

View File

@ -1,12 +1,24 @@
{ {
"name": "@cubetiq/react-use-countdown", "name": "@cubetiq/react-use-countdown",
"version": "1.10.5", "version": "1.10.6",
"description": "Count down with trigger", "description": "React Countdown with trigger",
"main": "./dist/index.js", "main": "./dist/index.js",
"types": "./dist/index.d.ts", "types": "./dist/index.d.ts",
"author": "SL", "author": "SL",
"license": "MIT", "license": "MIT",
"private": false, "private": false,
"contributors": [
{
"email": "s.long@cubetiqs.com",
"name": "@s.long",
"url": "https://git.cubetiqs.com/s.long"
},
{
"email": "sombochea@cubetiqs.com",
"name": "@SomboChea",
"url": "https://git.cubetiqs.com/sombochea"
}
],
"keywords": [ "keywords": [
"javascript", "javascript",
"typescript", "typescript",