@sydsoft/base 1.20.0 → 1.22.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import React from
|
|
1
|
+
import React from 'react';
|
|
2
2
|
type Props = {
|
|
3
3
|
targetTime: number | string;
|
|
4
|
-
timerType?:
|
|
4
|
+
timerType?: 'countdown' | 'datetime';
|
|
5
5
|
speed?: number;
|
|
6
|
-
countType?:
|
|
6
|
+
countType?: 'seconds' | 'minutes:seconds' | 'hours:minutes:seconds' | 'days:hours:minutes:seconds';
|
|
7
7
|
hide?: boolean;
|
|
8
8
|
onComplete?: () => void;
|
|
9
9
|
getStatus?: ({ days, hours, minutes, seconds, timer }: any) => void;
|
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
import { useEffect, useRef, useState } from
|
|
2
|
-
import React from
|
|
3
|
-
import { useInterval } from
|
|
1
|
+
import { useEffect, useRef, useState } from 'react';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import { useInterval } from '../_lib/useInterval';
|
|
4
4
|
export var useCountDown = function (_a) {
|
|
5
|
-
var _b = _a.autoStart, autoStart = _b === void 0 ? false : _b, onComplete = _a.onComplete, getStatus = _a.getStatus, targetTime = _a.targetTime, _c = _a.timerType, timerType = _c === void 0 ?
|
|
5
|
+
var _b = _a.autoStart, autoStart = _b === void 0 ? false : _b, onComplete = _a.onComplete, getStatus = _a.getStatus, targetTime = _a.targetTime, _c = _a.timerType, timerType = _c === void 0 ? 'countdown' : _c, _d = _a.countType, countType = _d === void 0 ? 'seconds' : _d, _e = _a.speed, speed = _e === void 0 ? 1000 : _e, hide = _a.hide;
|
|
6
6
|
var refCountDownRender = useRef(null);
|
|
7
|
-
var _f = useState(timerType ===
|
|
7
|
+
var _f = useState(timerType === 'datetime' || autoStart), enabled = _f[0], setEnabled = _f[1];
|
|
8
8
|
var _g = useState(0), timer = _g[0], setTimer = _g[1];
|
|
9
|
-
var _h = useState(typeof speed ===
|
|
9
|
+
var _h = useState(typeof speed === 'number' && speed > 0 ? speed : 1000), timerSpeed = _h[0], setTimerSpeed = _h[1];
|
|
10
10
|
useEffect(function () { return prepareTimer(targetTime); }, [targetTime]);
|
|
11
11
|
useEffect(function () {
|
|
12
12
|
if (!hide)
|
|
@@ -23,7 +23,7 @@ export var useCountDown = function (_a) {
|
|
|
23
23
|
}
|
|
24
24
|
}, enabled ? timerSpeed : null);
|
|
25
25
|
var prepareTimer = function (timeORstring) {
|
|
26
|
-
if (timerType ===
|
|
26
|
+
if (timerType === 'datetime') {
|
|
27
27
|
setTimer(Math.floor((new Date(timeORstring).getTime() - new Date().getTime()) / 1000));
|
|
28
28
|
setEnabled(true);
|
|
29
29
|
}
|
|
@@ -34,27 +34,28 @@ export var useCountDown = function (_a) {
|
|
|
34
34
|
var stopCountDown = function () {
|
|
35
35
|
setTimer(0);
|
|
36
36
|
setEnabled(false);
|
|
37
|
-
if (onComplete)
|
|
37
|
+
if ((enabled && onComplete) || (timerType === 'datetime' && onComplete)) {
|
|
38
38
|
onComplete();
|
|
39
|
+
}
|
|
39
40
|
};
|
|
40
41
|
var padNumber = function (num, padLength, padString) {
|
|
41
42
|
if (padLength === void 0) { padLength = 2; }
|
|
42
|
-
if (padString === void 0) { padString =
|
|
43
|
-
return (typeof targetTime ===
|
|
43
|
+
if (padString === void 0) { padString = '0'; }
|
|
44
|
+
return (typeof targetTime === 'number' && targetTime < 10 ? num : String(num).padStart(padLength, padString));
|
|
44
45
|
};
|
|
45
46
|
var render = function () {
|
|
46
47
|
var days = 0, hours = 0, minutes = 0, seconds = timer;
|
|
47
|
-
if (countType ===
|
|
48
|
+
if (countType === 'minutes:seconds') {
|
|
48
49
|
minutes = Math.floor(seconds / 60);
|
|
49
50
|
seconds -= minutes * 60;
|
|
50
51
|
}
|
|
51
|
-
else if (countType ===
|
|
52
|
+
else if (countType === 'hours:minutes:seconds') {
|
|
52
53
|
hours = Math.floor(seconds / (60 * 60));
|
|
53
54
|
seconds -= hours * 60 * 60;
|
|
54
55
|
minutes = Math.floor(seconds / 60);
|
|
55
56
|
seconds -= minutes * 60;
|
|
56
57
|
}
|
|
57
|
-
else if (countType ===
|
|
58
|
+
else if (countType === 'days:hours:minutes:seconds') {
|
|
58
59
|
days = Math.floor(seconds / (60 * 60 * 24));
|
|
59
60
|
seconds -= days * 60 * 60 * 24;
|
|
60
61
|
hours = Math.floor(seconds / (60 * 60));
|
|
@@ -65,14 +66,10 @@ export var useCountDown = function (_a) {
|
|
|
65
66
|
seconds = Math.floor(seconds);
|
|
66
67
|
if (getStatus && timer > 0)
|
|
67
68
|
getStatus({ days: days, hours: hours, minutes: minutes, seconds: seconds, timer: timer });
|
|
68
|
-
if (days <= 0 && hours <= 0 && minutes <= 0 && seconds <= 0) {
|
|
69
|
-
stopCountDown();
|
|
70
|
-
return;
|
|
71
|
-
}
|
|
72
69
|
if (refCountDownRender.current) {
|
|
73
70
|
var getPadValues = function (div) {
|
|
74
71
|
var length = div.dataset.padlength || 2;
|
|
75
|
-
var string = div.dataset.padstring ||
|
|
72
|
+
var string = div.dataset.padstring || '0';
|
|
76
73
|
return { length: length, string: string };
|
|
77
74
|
};
|
|
78
75
|
var divGun = refCountDownRender.current.querySelector("[data-name='days']");
|
|
@@ -95,6 +92,6 @@ export var useCountDown = function (_a) {
|
|
|
95
92
|
stopCountDown: function () { return setEnabled(false); },
|
|
96
93
|
setTargetTime: function (targetTime) { return prepareTimer(targetTime); },
|
|
97
94
|
setTimerSpeed: function (timerSpeed) { return setTimerSpeed(timerSpeed); },
|
|
98
|
-
getChildrenRef: function () { return refCountDownRender.current || null; }
|
|
95
|
+
getChildrenRef: function () { return refCountDownRender.current || null; }
|
|
99
96
|
};
|
|
100
97
|
};
|