https://github.com/shu20031026/react-hooks-time-limit

React Hook for get seconds to the target time
https://github.com/shu20031026/react-hooks-time-limit

hooks hooks-api-react react target-time typescript

Last synced: 30 days ago
JSON representation

React Hook for get seconds to the target time

• Host: GitHub
• URL: https://github.com/shu20031026/react-hooks-time-limit
• Owner: shu20031026
• License: mit
• Created: 2021-12-21T16:43:52.000Z (over 4 years ago)
• Default Branch: main
• Last Pushed: 2022-01-13T15:05:53.000Z (over 4 years ago)
• Last Synced: 2024-04-25T05:42:04.304Z (about 2 years ago)
• Topics: hooks, hooks-api-react, react, target-time, typescript
• Language: TypeScript
• Homepage: https://www.npmjs.com/package/react-hooks-time-limit
• Size: 39.1 KB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          


  react-hooks-time-limit 



[![npm](https://img.shields.io/npm/v/react-hooks-time-limit.svg?style=flat-square)](https://www.npmjs.com/package/react-hooks-time-limit)



React Hook for get seconds to the target time



![](https://user-images.githubusercontent.com/75605907/149351384-eeabdbb4-4787-4c63-8672-d42cde6e1e5f.gif)

## Instrallation

You can install the package from npm.

```

$ npm install react-hooks-time-limit

```

or

```

$ yarn add react-hooks-time-limit

```

## Usage

This is the simplest example.

```tsx

import React from "react";

import { useTimeLimit } from "react-hooks-time-limit";

const getTomorrow = (): Date => {

  const date = new Date(Date.now());

  date.setDate(date.getDate() + 1);

  return date;

}

const Component: React.FC = () => {

  const tomorrow = getTomorrow();

  const [ timeLeft, setTargetTime ] = useTimeLimit(tomorrow, { isSec: true });

  const handleChangeDate = (event: React.ChangeEvent) => {

    const date = new Date(event.target.value)

    setTargetTime(date)

  }

  return (

    


      
{timeLeft} seconds left until the target time

      
change target time

      

    

  );

};

```


| Parameter          | Default |    Type   | Description                                           |

| :----------------- | :-----: | :-------: | ----------------------------------------------------- |

| intervalTime       |  `1000` |   `int`   | Time interval to update the remaining time (optional) |

| isSec              | `false` | `boolean` | Returns seconds if true, ms if false (optional)       |

## License

[MIT © shu20031026](./LICENSE)