@sydsoft/base 1.19.0 → 1.21.0

package/dist/esm/_lib/useInterval.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Copyright (c) 2023
+ *  @author: izzetseydaoglu
+ *  @last-modified: 29.01.2024 04:09
+ */
+export declare function useInterval(callback: any, delay: any): void;

package/dist/esm/_lib/useInterval.js

@@ -0,0 +1,24 @@
+/**
+ * Copyright (c) 2023
+ *  @author: izzetseydaoglu
+ *  @last-modified: 29.01.2024 04:09
+ */
+// source: https://overreacted.io/making-setinterval-declarative-with-react-hooks/
+import { useEffect, useRef } from "react";
+export function useInterval(callback, delay) {
+    var savedCallback = useRef(null);
+    // Remember the latest callback.
+    useEffect(function () {
+        savedCallback.current = callback;
+    }, [callback]);
+    // Set up the interval.
+    useEffect(function () {
+        function tick() {
+            savedCallback && savedCallback.current && savedCallback.current();
+        }
+        if (delay !== null) {
+            var id_1 = setInterval(tick, delay);
+            return function () { return clearInterval(id_1); };
+        }
+    }, [delay]);
+}

package/dist/esm/countDown/index.d.ts

@@ -0,0 +1,22 @@
+import React from "react";
+type Props = {
+    targetTime: number | string;
+    timerType?: "countdown" | "datetime";
+    speed?: number;
+    countType?: "seconds" | "minutes:seconds" | "hours:minutes:seconds" | "days:hours:minutes:seconds";
+    hide?: boolean;
+    onComplete?: () => void;
+    getStatus?: ({ days, hours, minutes, seconds, timer }: any) => void;
+    autoStart?: boolean;
+};
+export declare const useCountDown: ({ autoStart, onComplete, getStatus, targetTime, timerType, countType, speed, hide }: Props) => {
+    ComponentCountDown: (children: any) => React.FunctionComponentElement<{
+        ref: React.MutableRefObject<any>;
+    }> | null;
+    startCountDown: () => void;
+    stopCountDown: () => void;
+    setTargetTime: (targetTime: number | string) => void;
+    setTimerSpeed: (timerSpeed: number) => void;
+    getChildrenRef: () => any;
+};
+export {};

package/dist/esm/countDown/index.js

@@ -0,0 +1,101 @@
+import { useEffect, useRef, useState } from "react";
+import React from "react";
+import { useInterval } from "../_lib/useInterval";
+export var useCountDown = function (_a) {
+    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;
+    var refCountDownRender = useRef(null);
+    var _f = useState(timerType === "datetime" || autoStart), enabled = _f[0], setEnabled = _f[1];
+    var _g = useState(0), timer = _g[0], setTimer = _g[1];
+    var _h = useState(typeof speed === "number" && speed > 0 ? speed : 1000), timerSpeed = _h[0], setTimerSpeed = _h[1];
+    useEffect(function () { return prepareTimer(targetTime); }, [targetTime]);
+    useEffect(function () {
+        if (!hide)
+            render();
+    }, [timer]);
+    useInterval(function () {
+        if (enabled) {
+            if (timer <= 1) {
+                stopCountDown();
+            }
+            else {
+                setTimer(timer - 1);
+            }
+        }
+    }, enabled ? timerSpeed : null);
+    var prepareTimer = function (timeORstring) {
+        if (timerType === "datetime") {
+            setTimer(Math.floor((new Date(timeORstring).getTime() - new Date().getTime()) / 1000));
+            setEnabled(true);
+        }
+        else {
+            setTimer(timeORstring);
+        }
+    };
+    var stopCountDown = function () {
+        setTimer(0);
+        setEnabled(false);
+        if ((enabled && onComplete) || (timerType === "datetime" && onComplete)) {
+            onComplete();
+        }
+    };
+    var padNumber = function (num, padLength, padString) {
+        if (padLength === void 0) { padLength = 2; }
+        if (padString === void 0) { padString = "0"; }
+        return (typeof targetTime === "number" && targetTime < 10 ? num : String(num).padStart(padLength, padString));
+    };
+    var render = function () {
+        var days = 0, hours = 0, minutes = 0, seconds = timer;
+        if (countType === "minutes:seconds") {
+            minutes = Math.floor(seconds / 60);
+            seconds -= minutes * 60;
+        }
+        else if (countType === "hours:minutes:seconds") {
+            hours = Math.floor(seconds / (60 * 60));
+            seconds -= hours * 60 * 60;
+            minutes = Math.floor(seconds / 60);
+            seconds -= minutes * 60;
+        }
+        else if (countType === "days:hours:minutes:seconds") {
+            days = Math.floor(seconds / (60 * 60 * 24));
+            seconds -= days * 60 * 60 * 24;
+            hours = Math.floor(seconds / (60 * 60));
+            seconds -= hours * 60 * 60;
+            minutes = Math.floor(seconds / 60);
+            seconds -= minutes * 60;
+        }
+        seconds = Math.floor(seconds);
+        if (getStatus && timer > 0)
+            getStatus({ days: days, hours: hours, minutes: minutes, seconds: seconds, timer: timer });
+        if (days <= 0 && hours <= 0 && minutes <= 0 && seconds <= 0) {
+            stopCountDown();
+            return;
+        }
+        if (refCountDownRender.current) {
+            var getPadValues = function (div) {
+                var length = div.dataset.padlength || 2;
+                var string = div.dataset.padstring || "0";
+                return { length: length, string: string };
+            };
+            var divGun = refCountDownRender.current.querySelector("[data-name='days']");
+            if (divGun)
+                divGun.innerHTML = padNumber(days, getPadValues(divGun).length, getPadValues(divGun).string).toString();
+            var divSaat = refCountDownRender.current.querySelector("[data-name='hours']");
+            if (divSaat)
+                divSaat.innerHTML = padNumber(hours, getPadValues(divSaat).length, getPadValues(divSaat).string).toString();
+            var divDakika = refCountDownRender.current.querySelector("[data-name='minutes']");
+            if (divDakika)
+                divDakika.innerHTML = padNumber(minutes, getPadValues(divDakika).length, getPadValues(divDakika).string).toString();
+            var divSaniye = refCountDownRender.current.querySelector("[data-name='seconds']");
+            if (divSaniye)
+                divSaniye.innerHTML = padNumber(seconds, getPadValues(divSaniye).length, getPadValues(divSaniye).string).toString();
+        }
+    };
+    return {
+        ComponentCountDown: function (children) { return (hide ? null : React.cloneElement(children, { ref: refCountDownRender })); },
+        startCountDown: function () { return setEnabled(true); },
+        stopCountDown: function () { return setEnabled(false); },
+        setTargetTime: function (targetTime) { return prepareTimer(targetTime); },
+        setTimerSpeed: function (timerSpeed) { return setTimerSpeed(timerSpeed); },
+        getChildrenRef: function () { return refCountDownRender.current || null; },
+    };
+};

package/dist/esm/index.d.ts

@@ -1,7 +1,8 @@
 export * from './_lib/baseFunctions';
 export * from './alert';
 export * from './box';
-export * from './datetime';
+export * from './countDown';
+export * from './dateTime';
 export * from './form';
 export * from './grid';
 export * from './icon';

package/dist/esm/index.js

@@ -1,7 +1,8 @@
 export * from './_lib/baseFunctions';
 export * from './alert';
 export * from './box';
-export * from './datetime';
+export * from './countDown';
+export * from './dateTime';
 export * from './form';
 export * from './grid';
 export * from './icon';

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "@sydsoft/base",
     "private": false,
-    "version": "1.19.0",
+    "version": "1.21.0",
     "description": "",
     "main": "./dist/cjs/index.js",
     "module": "./dist/esm/index.js",