# react-time-hooks

> React and React-native time and countdown hook

Latest version **1.0.12** (published 2021-08-03) · MIT license · 0 weekly downloads

## Install

```sh
npm install react-time-hooks
pnpm add react-time-hooks
yarn add react-time-hooks
bun add react-time-hooks
```

## Health

**Score 20/100 (F)** — status: abandoned.

Positive: esm support; no vulnerabilities.

Warnings: low downloads; no types.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.12 |
| Published | 2021-08-03 |
| First published | 2021-08-03 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Node | >=10 |
| Dependencies | 0 |
| Unpacked size | 28.8 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 1 |
| Author | Amirnajafi |
| Maintainers | amirnajafi |

## Links

- npm: https://www.npmjs.com/package/react-time-hooks
- Repository: https://github.com/Amirnajafi/react-time-hooks
- Homepage: https://github.com/Amirnajafi/react-time-hooks#readme
- Issues: https://github.com/Amirnajafi/react-time-hooks/issues
- npm.io page: https://npm.io/package/react-time-hooks

## Recent versions

- 1.0.12 (latest) — 2021-08-03
- 1.0.11 — 2021-08-03
- 1.0.10 — 2021-08-03
- 1.0.8 — 2021-08-03
- 1.0.7 — 2021-08-03
- 1.0.6 — 2021-08-03
- 1.0.5 — 2021-08-03
- 1.0.4 — 2021-08-03
- 1.0.3 — 2021-08-03
- 1.0.2 — 2021-08-03
- 1.0.1 — 2021-08-03
- 1.0.0 — 2021-08-03

## README

# React | React-native Time hooks
[![NPM Version](https://img.shields.io/npm/v/react-time-hooks.svg?style=flat)](https://www.npmjs.com/package/react-time-hooks)
<!-- [![Build Status](https://travis-ci.org/rghorbani/react-native-persian-calendar-picker.svg?branch=master)](https://travis-ci.org/rghorbani/react-native-persian-calendar-picker) -->

Time hooks help you to use timer and countdown hook in your react and react-native projects 
<br>
its so lightway and fast 
<br>
it reduce developing time and prevent to to define any intervals and functions for it 

<kbd>
<img src="https://raw.githubusercontent.com/Amirnajafi/react-time-hooks/main/demo/demo.gif">
</kbd>

The package is both **React** and **React-native** compatible.

## Installation
`$ npm install --save react-time-hooks`
or 

`$ yarn add react-time-hooks`
# Prerequisites
Time hook has no requirement dependencies
## Usage

How to use it:
``` 
import React from 'react';
import {useCountDown , useTimer} from 'react-time-hooks'


/* default options 
    {
        countOnFocus = false,
        interval = 1,
        autoStart = true,
        stop_time = null,
    }
*/ 


const Timer = () => {
    const options =  {} 
    const {time , play , reset , pause} = useTimer(0 , options)
    console.log(time)
    render() {
        return ();
    }
}

const CountDown = () => {
    const options =  {} 
    const {time , play , reset , pause} = useCountDown(60 , options)
    console.log(time)
    render() {
        return ();
    }
}

```

## Default time
| Prop | Type | Description |
:------------ |:---------------| :-----|
| **`time`** | `This is initial time , Timer or Count down start counting at this value` | Mandetory|

## useTimer Options
| Prop | Type | Description | Default
:------------ |:---------------| :-----| :-----|
| **` countOnFocus`** | `Boolean` | Optional. if `true` its stop counting when page is not focus | false,
| **` interval`** | `Number` | Optional. the interval of counter in `seconds` | 1,
| **` autoStart`** | `Boolean` | Optional. if true it start counting as hooks loaded | true,
| **` stop_time`** |  `Number` | Optional. if passing number it stop counting on that number = null,

## useTimer Options
| Prop | Type | Description | Default
:------------ |:---------------| :-----| :-----|
| **` countOnFocus`** | `Boolean` | Optional. if `true` its stop counting when page is not focus | false,
| **` interval`** | `Number` | Optional. the interval of counter in `seconds` | 1,
| **` autoStart`** | `Boolean` | Optional. if true it start counting as hooks loaded | true,
| **` stop_time`** |  `Number` | Optional. if passing number it stop counting on that number = null,

# Suggestions?
Open Issues. Submit PRs.

## License
MIT © [Amirnajafi](https://github.com/Amirnajafi)

---
_Source: https://npm.io/package/react-time-hooks · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._