diff --git a/docs/index.js b/docs/index.js index 739f9e0..abd887e 100644 --- a/docs/index.js +++ b/docs/index.js @@ -203,7 +203,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { "use strict"; -eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (/* binding */ useTimer)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./utils */ \"./src/utils/index.js\");\n/* harmony import */ var _hooks__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./hooks */ \"./src/hooks/index.js\");\n\n\n\nconst DEFAULT_DELAY = 1000;\nfunction getDelayFromExpiryTimestamp(expiryTimestamp) {\n if (!_utils__WEBPACK_IMPORTED_MODULE_1__.Validate.expiryTimestamp(expiryTimestamp)) {\n return null;\n }\n const seconds = _utils__WEBPACK_IMPORTED_MODULE_1__.Time.getSecondsFromExpiry(expiryTimestamp);\n const extraMilliSeconds = Math.floor((seconds - Math.floor(seconds)) * 1000);\n return extraMilliSeconds > 0 ? extraMilliSeconds : DEFAULT_DELAY;\n}\nfunction useTimer(_ref) {\n let {\n expiryTimestamp: expiry,\n onExpire,\n autoStart = true\n } = _ref;\n const [expiryTimestamp, setExpiryTimestamp] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(expiry);\n const [seconds, setSeconds] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(_utils__WEBPACK_IMPORTED_MODULE_1__.Time.getSecondsFromExpiry(expiryTimestamp));\n const [isRunning, setIsRunning] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(autoStart);\n const [didStart, setDidStart] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(autoStart);\n const [delay, setDelay] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(getDelayFromExpiryTimestamp(expiryTimestamp));\n function handleExpire() {\n _utils__WEBPACK_IMPORTED_MODULE_1__.Validate.onExpire(onExpire) && onExpire();\n setIsRunning(false);\n setDelay(null);\n }\n function pause() {\n setIsRunning(false);\n }\n function restart(newExpiryTimestamp) {\n let newAutoStart = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;\n setDelay(getDelayFromExpiryTimestamp(newExpiryTimestamp));\n setDidStart(newAutoStart);\n setIsRunning(newAutoStart);\n setExpiryTimestamp(newExpiryTimestamp);\n setSeconds(_utils__WEBPACK_IMPORTED_MODULE_1__.Time.getSecondsFromExpiry(newExpiryTimestamp));\n }\n function resume() {\n const time = new Date();\n time.setMilliseconds(time.getMilliseconds() + seconds * 1000);\n restart(time);\n }\n function start() {\n if (didStart) {\n setSeconds(_utils__WEBPACK_IMPORTED_MODULE_1__.Time.getSecondsFromExpiry(expiryTimestamp));\n setIsRunning(true);\n } else {\n resume();\n }\n }\n (0,_hooks__WEBPACK_IMPORTED_MODULE_2__.useInterval)(() => {\n if (delay !== DEFAULT_DELAY) {\n setDelay(DEFAULT_DELAY);\n }\n const secondsValue = _utils__WEBPACK_IMPORTED_MODULE_1__.Time.getSecondsFromExpiry(expiryTimestamp);\n setSeconds(secondsValue);\n if (secondsValue <= 0) {\n handleExpire();\n }\n }, isRunning ? delay : null);\n return {\n ..._utils__WEBPACK_IMPORTED_MODULE_1__.Time.getTimeFromSeconds(seconds),\n start,\n pause,\n resume,\n restart,\n isRunning\n };\n}\n\n//# sourceURL=webpack://react-timer-hook/./src/useTimer.js?"); +eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (/* binding */ useTimer)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./utils */ \"./src/utils/index.js\");\n/* harmony import */ var _hooks__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./hooks */ \"./src/hooks/index.js\");\n\n\n\nconst DEFAULT_DELAY = 1000;\nfunction getDelayFromExpiryTimestamp(expiryTimestamp) {\n if (!_utils__WEBPACK_IMPORTED_MODULE_1__.Validate.expiryTimestamp(expiryTimestamp)) {\n return null;\n }\n const seconds = _utils__WEBPACK_IMPORTED_MODULE_1__.Time.getSecondsFromExpiry(expiryTimestamp);\n const extraMilliSeconds = Math.floor((seconds - Math.floor(seconds)) * 1000);\n return extraMilliSeconds > 0 ? extraMilliSeconds : DEFAULT_DELAY;\n}\nfunction useTimer(_ref) {\n let {\n expiryTimestamp: expiry,\n onExpire,\n autoStart = true\n } = _ref;\n const [expiryTimestamp, setExpiryTimestamp] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(expiry);\n const [seconds, setSeconds] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(_utils__WEBPACK_IMPORTED_MODULE_1__.Time.getSecondsFromExpiry(expiryTimestamp));\n const [isRunning, setIsRunning] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(autoStart);\n const [didStart, setDidStart] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(autoStart);\n const [delay, setDelay] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(getDelayFromExpiryTimestamp(expiryTimestamp));\n function handleExpire() {\n _utils__WEBPACK_IMPORTED_MODULE_1__.Validate.onExpire(onExpire) && onExpire();\n setIsRunning(false);\n setDelay(null);\n }\n const pause = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(() => {\n setIsRunning(false);\n }, []);\n const restart = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(function (newExpiryTimestamp) {\n let newAutoStart = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;\n setDelay(getDelayFromExpiryTimestamp(newExpiryTimestamp));\n setDidStart(newAutoStart);\n setIsRunning(newAutoStart);\n setExpiryTimestamp(newExpiryTimestamp);\n setSeconds(_utils__WEBPACK_IMPORTED_MODULE_1__.Time.getSecondsFromExpiry(newExpiryTimestamp));\n }, []);\n const resume = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(() => {\n const time = new Date();\n time.setMilliseconds(time.getMilliseconds() + seconds * 1000);\n restart(time);\n }, [seconds, restart]);\n const start = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(() => {\n if (didStart) {\n setSeconds(_utils__WEBPACK_IMPORTED_MODULE_1__.Time.getSecondsFromExpiry(expiryTimestamp));\n setIsRunning(true);\n } else {\n resume();\n }\n }, [expiryTimestamp, didStart, resume]);\n (0,_hooks__WEBPACK_IMPORTED_MODULE_2__.useInterval)(() => {\n if (delay !== DEFAULT_DELAY) {\n setDelay(DEFAULT_DELAY);\n }\n const secondsValue = _utils__WEBPACK_IMPORTED_MODULE_1__.Time.getSecondsFromExpiry(expiryTimestamp);\n setSeconds(secondsValue);\n if (secondsValue <= 0) {\n handleExpire();\n }\n }, isRunning ? delay : null);\n return {\n ..._utils__WEBPACK_IMPORTED_MODULE_1__.Time.getTimeFromSeconds(seconds),\n start,\n pause,\n resume,\n restart,\n isRunning\n };\n}\n\n//# sourceURL=webpack://react-timer-hook/./src/useTimer.js?"); /***/ }), diff --git a/src/useStopwatch.js b/src/useStopwatch.js index 0f09ab5..eb03ae1 100644 --- a/src/useStopwatch.js +++ b/src/useStopwatch.js @@ -1,4 +1,4 @@ -import { useState } from 'react'; +import { useState, useCallback } from 'react'; import { Time } from './utils'; import { useInterval } from './hooks'; @@ -12,26 +12,26 @@ export default function useStopwatch({ autoStart, offsetTimestamp }) { setSeconds(passedSeconds + Time.getSecondsFromPrevTime(prevTime, true)); }, isRunning ? 1000 : null); - function start() { + const start = useCallback(() => { const newPrevTime = new Date(); setPrevTime(newPrevTime); setIsRunning(true); setSeconds(passedSeconds + Time.getSecondsFromPrevTime(newPrevTime, true)); - } + }, [passedSeconds]); - function pause() { + const pause = useCallback(() => { setPassedSeconds(seconds); setIsRunning(false); - } + }, [seconds]); - function reset(offset = 0, newAutoStart = true) { + const reset = useCallback((offset = 0, newAutoStart = true) => { const newPassedSeconds = Time.getSecondsFromExpiry(offset, true) || 0; const newPrevTime = new Date(); setPrevTime(newPrevTime); setPassedSeconds(newPassedSeconds); setIsRunning(newAutoStart); setSeconds(newPassedSeconds + Time.getSecondsFromPrevTime(newPrevTime, true)); - } + }, []); return { ...Time.getTimeFromSeconds(seconds), start, pause, reset, isRunning, diff --git a/src/useTimer.js b/src/useTimer.js index 1f61f98..91ce06d 100644 --- a/src/useTimer.js +++ b/src/useTimer.js @@ -1,4 +1,4 @@ -import { useState } from 'react'; +import { useState, useCallback } from 'react'; import { Time, Validate } from './utils'; import { useInterval } from './hooks'; @@ -20,38 +20,38 @@ export default function useTimer({ expiryTimestamp: expiry, onExpire, autoStart const [didStart, setDidStart] = useState(autoStart); const [delay, setDelay] = useState(getDelayFromExpiryTimestamp(expiryTimestamp)); - function handleExpire() { + const handleExpire = useCallback(() => { Validate.onExpire(onExpire) && onExpire(); setIsRunning(false); setDelay(null); - } + }, [onExpire]); - function pause() { + const pause = useCallback(() => { setIsRunning(false); - } + }, []); - function restart(newExpiryTimestamp, newAutoStart = true) { + const restart = useCallback((newExpiryTimestamp, newAutoStart = true) => { setDelay(getDelayFromExpiryTimestamp(newExpiryTimestamp)); setDidStart(newAutoStart); setIsRunning(newAutoStart); setExpiryTimestamp(newExpiryTimestamp); setSeconds(Time.getSecondsFromExpiry(newExpiryTimestamp)); - } + }, []); - function resume() { + const resume = useCallback(() => { const time = new Date(); time.setMilliseconds(time.getMilliseconds() + (seconds * 1000)); restart(time); - } + }, [seconds, restart]); - function start() { + const start = useCallback(() => { if (didStart) { setSeconds(Time.getSecondsFromExpiry(expiryTimestamp)); setIsRunning(true); } else { resume(); } - } + }, [expiryTimestamp, didStart, resume]); useInterval(() => { if (delay !== DEFAULT_DELAY) {