Coder Social home page Coder Social logo

bradgarropy / use-countdown Goto Github PK

View Code? Open in Web Editor NEW
89.0 2.0 13.0 656 KB

⏳ useCountdown hook

Home Page: https://www.npmjs.com/package/@bradgarropy/use-countdown

License: MIT License

HTML 2.21% TypeScript 94.95% JavaScript 2.84%
typescript react react-hook countdown

use-countdown's Issues

Add a new feature: allow changing the duration of the countdown

Hello,

I was just wondering if it would be possible to add an ability to change the countdown duration times after useCountdown() has been called.

For example, if you call reset(), the countdown will restart but always for the duration of time specified on the initial useCountdown() call (e.g., 5 seconds). The ability to change the duration of time on a reset() would help me significantly with a project I'm working on.

Thank you for reading this,
SirIsaacNeutron

Implementing a reset countdown feature

I want to have the possibility to reset the countdown when a button is clicked. I think it could be relevant to restart the countdown without re-rendering the component.

Implementing a way to freeze/stop the timer

I was wondering if it's possible to implement a freeze/stop for the timer. My use case is building a chess timer, and I need to be able to freeze the timer for each side when someone makes a move.

calling reset() with a time value is causing an error in Next.js (v12)

Hey there @bradgarropy 🤘 First of all, thanks so much for putting this together, it's been lovely to use!

Unfortunately, I just tested out resetting the timer with a specific time object and it keeps throwing this error: RangeError: Invalid time value

image

What's confusing is that the error is targeting the hook line, even though I'm making the reset() call in another place entirely, via:

resendCodeCountdown.reset({ seconds: 30, format: "s 'sec'" })

Additionally here are some details on the versions I'm running this on:

Any ideas why this might not be working as expected? Thanks so much!

"Cannot find module: 'tslib'"

I'm trying to use this in my Vite + TypeScript + React project. I'm getting this error:

Error: Cannot find module 'tslib'
Require stack:

I found the reference to tslib in the compiled dist:

"use strict";
exports.__esModule = true;
var tslib_1 = require("tslib");
var countdown_1 = tslib_1.__importDefault(require("./countdown"));
exports["default"] = countdown_1["default"];
tslib_1.__exportStar(require("./types"), exports);
//# sourceMappingURL=index.js.map

Looking in package.json in this repo, it appears that tslib is a dev dependency.

Should that be moved to the regular dependencies list, or should the build step be modified somehow to remove the reference to tslib from the compiled distribution?

Countdown overtime

Hi,

Is there anyway to allow the timer keep going even after reaching 0?

So, when the timer hits 0, it starts counting up.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.