rc-countdown-view - npm Package Compare versions

Comparing version 2.1.0 to 3.0.0

dist/index.cjs.js

+'use strict';
+
+var tslib = require('tslib');
+var React = require('react');
+var CountDownPro = require('countdown-pro');
+var rcHooks = require('rc-hooks');
+
+function formatTime(timestamp, format) {
+    if (typeof format === 'string') {
+        return CountDownPro.format(timestamp, format);
+    }
+    else if (format instanceof Function) {
+        return format(timestamp, CountDownPro.parseTimeData(timestamp));
+    }
+    else {
+        return '' + timestamp;
+    }
+}
+var CountDown = function (_a) {
+    var _b = _a.time, time = _b === undefined ? 0 : _b, _c = _a.interval, interval = _c === undefined ? 1000 : _c, _d = _a.format, format = _d === undefined ? 'HH:mm:ss' : _d, _e = _a.autoStart, autoStart = _e === undefined ? true : _e, onChange = _a.onChange, onEnd = _a.onEnd, actionRef = _a.actionRef, restProps = tslib.__rest(_a, ["time", "interval", "format", "autoStart", "onChange", "onEnd", "actionRef"]);
+    var _f = tslib.__read(rcHooks.useSafeState(function () { return formatTime(time, format); }), 2), timeState = _f[0], setTimeState = _f[1];
+    var changeLatest = rcHooks.useLatest(onChange);
+    var endLatest = rcHooks.useLatest(onEnd);
+    var formatLatest = rcHooks.useLatest(format);
+    var countdownRef = React.useRef(null);
+    if (!countdownRef.current) {
+        countdownRef.current = new CountDownPro({
+            time: time,
+            interval: interval,
+            adjustInterval: interval * 10,
+            onChange: function (currentTime) {
+                var _a;
+                var fmtTime = formatTime(currentTime, formatLatest.current);
+                setTimeState(fmtTime);
+                (_a = changeLatest.current) === null || _a === undefined ? undefined : _a.call(changeLatest, fmtTime);
+            },
+            onEnd: function () {
+                var _a;
+                (_a = endLatest.current) === null || _a === undefined ? undefined : _a.call(endLatest);
+            }
+        });
+    }
+    React.useImperativeHandle(actionRef, function () { return countdownRef.current; }, []);
+    React.useEffect(function () {
+        var _a;
+        if (autoStart) {
+            (_a = countdownRef.current) === null || _a === undefined ? undefined : _a.start();
+        }
+        return function () {
+            var _a;
+            (_a = countdownRef.current) === null || _a === undefined ? undefined : _a.pause();
+            countdownRef.current = null;
+        };
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+    rcHooks.useUpdateEffect(function () {
+        var _a;
+        (_a = countdownRef.current) === null || _a === undefined ? undefined : _a.updateOptions({ time: time, interval: interval });
+    }, [time, interval]);
+    return React.createElement("span", tslib.__assign({}, restProps), timeState);
+};
+
+module.exports = CountDown;

dist/index.esm.js

+import { __rest, __read, __assign } from 'tslib';
+import React, { useRef, useImperativeHandle, useEffect } from 'react';
+import CountDownPro from 'countdown-pro';
+import { useSafeState, useLatest, useUpdateEffect } from 'rc-hooks';
+
+function formatTime(timestamp, format) {
+    if (typeof format === 'string') {
+        return CountDownPro.format(timestamp, format);
+    }
+    else if (format instanceof Function) {
+        return format(timestamp, CountDownPro.parseTimeData(timestamp));
+    }
+    else {
+        return '' + timestamp;
+    }
+}
+var CountDown = function (_a) {
+    var _b = _a.time, time = _b === undefined ? 0 : _b, _c = _a.interval, interval = _c === undefined ? 1000 : _c, _d = _a.format, format = _d === undefined ? 'HH:mm:ss' : _d, _e = _a.autoStart, autoStart = _e === undefined ? true : _e, onChange = _a.onChange, onEnd = _a.onEnd, actionRef = _a.actionRef, restProps = __rest(_a, ["time", "interval", "format", "autoStart", "onChange", "onEnd", "actionRef"]);
+    var _f = __read(useSafeState(function () { return formatTime(time, format); }), 2), timeState = _f[0], setTimeState = _f[1];
+    var changeLatest = useLatest(onChange);
+    var endLatest = useLatest(onEnd);
+    var formatLatest = useLatest(format);
+    var countdownRef = useRef(null);
+    if (!countdownRef.current) {
+        countdownRef.current = new CountDownPro({
+            time: time,
+            interval: interval,
+            adjustInterval: interval * 10,
+            onChange: function (currentTime) {
+                var _a;
+                var fmtTime = formatTime(currentTime, formatLatest.current);
+                setTimeState(fmtTime);
+                (_a = changeLatest.current) === null || _a === undefined ? undefined : _a.call(changeLatest, fmtTime);
+            },
+            onEnd: function () {
+                var _a;
+                (_a = endLatest.current) === null || _a === undefined ? undefined : _a.call(endLatest);
+            }
+        });
+    }
+    useImperativeHandle(actionRef, function () { return countdownRef.current; }, []);
+    useEffect(function () {
+        var _a;
+        if (autoStart) {
+            (_a = countdownRef.current) === null || _a === undefined ? undefined : _a.start();
+        }
+        return function () {
+            var _a;
+            (_a = countdownRef.current) === null || _a === undefined ? undefined : _a.pause();
+            countdownRef.current = null;
+        };
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+    useUpdateEffect(function () {
+        var _a;
+        (_a = countdownRef.current) === null || _a === undefined ? undefined : _a.updateOptions({ time: time, interval: interval });
+    }, [time, interval]);
+    return React.createElement("span", __assign({}, restProps), timeState);
+};
+
+export { CountDown as default };

package.json

 {
   "name": "rc-countdown-view",
-  "version": "2.1.0",
+  "version": "3.0.0",
   "description": "A simple countdown react component.",
-  "main": "lib/index.js",
-  "module": "es/index.js",
+  "main": "dist/index.cjs.js",
+  "module": "dist/index.esm.js",
   "types": "types/index.d.ts",
   "files": [
-    "es",
-    "lib",
+    "dist",
     "types"
@@ -26,3 +25,3 @@ ],
     "tsc": "tsc --noEmit",
-    "prepare": "husky install"
+    "prepare": "husky install && dumi setup"
   },
@@ -35,3 +34,3 @@ "lint-staged": {
     "commitizen": {
-      "path": "./node_modules/cz-conventional-changelog"
+      "path": "@commitlint/cz-commitlint"
     }
@@ -55,29 +54,23 @@ },
   "dependencies": {
-    "countdown-pro": "^2.1.0",
-    "rc-hooks": "^3.0.12",
-    "tslib": "^2.6.3"
+    "countdown-pro": "^2.2.1",
+    "rc-hooks": "^3.0.16",
+    "tslib": "^2.8.1"
   },
   "devDependencies": {
-    "@babel/preset-env": "^7.24.8",
-    "@babel/preset-react": "^7.24.7",
-    "@babel/preset-typescript": "^7.24.7",
     "@commitlint/cli": "^17.8.1",
     "@commitlint/config-conventional": "^17.8.1",
-    "@rollup/plugin-commonjs": "^25.0.8",
-    "@rollup/plugin-node-resolve": "^15.2.3",
-    "@rollup/plugin-typescript": "^11.1.6",
-    "@testing-library/jest-dom": "^6.4.6",
-    "@testing-library/react": "^16.0.0",
-    "@types/jest": "^29.5.12",
-    "@types/react": "^18.3.3",
-    "@types/react-dom": "^18.3.0",
-    "@types/react-test-renderer": "^18.3.0",
+    "@commitlint/cz-commitlint": "^17.8.1",
+    "@rollup/plugin-commonjs": "^28.0.2",
+    "@rollup/plugin-node-resolve": "^16.0.0",
+    "@rollup/plugin-typescript": "^12.1.2",
+    "@testing-library/jest-dom": "^6.6.3",
+    "@testing-library/react": "^16.2.0",
+    "@types/jest": "^29.5.14",
+    "@types/react": "^18.3.18",
+    "@types/react-dom": "^18.3.5",
     "@typescript-eslint/eslint-plugin": "^5.62.0",
     "@typescript-eslint/parser": "^5.62.0",
-    "babel-jest": "^29.7.0",
-    "cz-conventional-changelog": "^3.3.0",
-    "dumi": "^1.1.54",
-    "element-remove": "^1.0.4",
-    "eslint": "^8.57.0",
-    "eslint-plugin-react": "^7.34.4",
+    "dumi": "^2.4.17",
+    "eslint": "^8.57.1",
+    "eslint-plugin-react": "^7.37.4",
     "eslint-plugin-react-hooks": "^4.6.2",
@@ -88,8 +81,8 @@ "husky": "^8.0.3",
     "lint-staged": "^13.3.0",
-    "prettier": "^3.3.3",
+    "prettier": "^3.4.2",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
-    "react-test-renderer": "^18.3.1",
-    "rollup": "^3.29.4",
-    "typescript": "^4.9.5"
+    "rollup": "^4.31.0",
+    "ts-jest": "^29.2.5",
+    "typescript": "^5.7.3"
   },
@@ -99,6 +92,2 @@ "peerDependencies": {
   },
-  "resolutions": {
-    "react": "18",
-    "react-dom": "18"
-  },
   "publishConfig": {
@@ -105,0 +94,0 @@ "registry": "https://registry.npmjs.org/"

README.md

@@ -45,6 +45,6 @@ # rc-countdown-view
 | onEnd | 倒计时结束时触发 | `() => void` | - |
-| ref | 常用操作，开始/暂停/重置 | `ActionType` | - |
+| actionRef | 常用操作，开始/暂停/重置 | `MutableRefObject<ActionType>` | - |
 
-[site]: https://caijf.github.io/rc-countdown-view/index.html
+[site]: https://caijf.github.io/rc-countdown-view/
 [npm]: https://img.shields.io/npm/v/rc-countdown-view.svg
 [npm-url]: https://npmjs.com/package/rc-countdown-view

types/index.d.ts

@@ -10,4 +10,5 @@ import React from 'react';
     onChange?: (formatTime: string) => void;
+    actionRef?: React.MutableRefObject<ActionType | undefined>;
 }
-declare const CountDown: React.ForwardRefExoticComponent<CountDownProps & React.RefAttributes<CountDownPro>>;
+declare const CountDown: React.FC<CountDownProps>;
 export default CountDown;

es/index.js

-import { __rest, __read, __assign } from 'tslib';
-import React, { forwardRef, useRef, useImperativeHandle, useEffect } from 'react';
-import CountDownPro from 'countdown-pro';
-import { useSafeState, useLatest, useUpdateEffect } from 'rc-hooks';
-
-function formatTime(timestamp, format) {
-    if (typeof format === 'string') {
-        return CountDownPro.format(timestamp, format);
-    }
-    else if (format instanceof Function) {
-        return format(timestamp, CountDownPro.parseTimeData(timestamp));
-    }
-    else {
-        return '' + timestamp;
-    }
-}
-var CountDown = forwardRef(function (_a, ref) {
-    var _b = _a.time, time = _b === void 0 ? 0 : _b, _c = _a.interval, interval = _c === void 0 ? 1000 : _c, _d = _a.format, format = _d === void 0 ? 'HH:mm:ss' : _d, _e = _a.autoStart, autoStart = _e === void 0 ? true : _e, onChange = _a.onChange, onEnd = _a.onEnd, restProps = __rest(_a, ["time", "interval", "format", "autoStart", "onChange", "onEnd"]);
-    var _f = __read(useSafeState(function () { return formatTime(time, format); }), 2), timeState = _f[0], setTimeState = _f[1];
-    var changeLatest = useLatest(onChange);
-    var endLatest = useLatest(onEnd);
-    var formatLatest = useLatest(format);
-    var countdownRef = useRef(null);
-    if (!countdownRef.current) {
-        countdownRef.current = new CountDownPro({
-            time: time,
-            interval: interval,
-            onChange: function (currentTime) {
-                var _a;
-                var fmtTime = formatTime(currentTime, formatLatest.current);
-                setTimeState(fmtTime);
-                (_a = changeLatest.current) === null || _a === void 0 ? void 0 : _a.call(changeLatest, fmtTime);
-            },
-            onEnd: function () {
-                var _a;
-                (_a = endLatest.current) === null || _a === void 0 ? void 0 : _a.call(endLatest);
-            }
-        });
-    }
-    useImperativeHandle(ref, function () { return countdownRef.current; }, []);
-    useEffect(function () {
-        var _a;
-        if (autoStart) {
-            (_a = countdownRef.current) === null || _a === void 0 ? void 0 : _a.start();
-        }
-        return function () {
-            var _a;
-            (_a = countdownRef.current) === null || _a === void 0 ? void 0 : _a.pause();
-            countdownRef.current = null;
-        };
-    }, []);
-    useUpdateEffect(function () {
-        var _a;
-        (_a = countdownRef.current) === null || _a === void 0 ? void 0 : _a.updateOptions({ time: time, interval: interval });
-    }, [time, interval]);
-    return React.createElement("span", __assign({}, restProps), timeState);
-});
-CountDown.displayName = 'CountDown';
-
-export { CountDown as default };

lib/index.js

-'use strict';
-
-var tslib = require('tslib');
-var React = require('react');
-var CountDownPro = require('countdown-pro');
-var rcHooks = require('rc-hooks');
-
-function formatTime(timestamp, format) {
-    if (typeof format === 'string') {
-        return CountDownPro.format(timestamp, format);
-    }
-    else if (format instanceof Function) {
-        return format(timestamp, CountDownPro.parseTimeData(timestamp));
-    }
-    else {
-        return '' + timestamp;
-    }
-}
-var CountDown = React.forwardRef(function (_a, ref) {
-    var _b = _a.time, time = _b === void 0 ? 0 : _b, _c = _a.interval, interval = _c === void 0 ? 1000 : _c, _d = _a.format, format = _d === void 0 ? 'HH:mm:ss' : _d, _e = _a.autoStart, autoStart = _e === void 0 ? true : _e, onChange = _a.onChange, onEnd = _a.onEnd, restProps = tslib.__rest(_a, ["time", "interval", "format", "autoStart", "onChange", "onEnd"]);
-    var _f = tslib.__read(rcHooks.useSafeState(function () { return formatTime(time, format); }), 2), timeState = _f[0], setTimeState = _f[1];
-    var changeLatest = rcHooks.useLatest(onChange);
-    var endLatest = rcHooks.useLatest(onEnd);
-    var formatLatest = rcHooks.useLatest(format);
-    var countdownRef = React.useRef(null);
-    if (!countdownRef.current) {
-        countdownRef.current = new CountDownPro({
-            time: time,
-            interval: interval,
-            onChange: function (currentTime) {
-                var _a;
-                var fmtTime = formatTime(currentTime, formatLatest.current);
-                setTimeState(fmtTime);
-                (_a = changeLatest.current) === null || _a === void 0 ? void 0 : _a.call(changeLatest, fmtTime);
-            },
-            onEnd: function () {
-                var _a;
-                (_a = endLatest.current) === null || _a === void 0 ? void 0 : _a.call(endLatest);
-            }
-        });
-    }
-    React.useImperativeHandle(ref, function () { return countdownRef.current; }, []);
-    React.useEffect(function () {
-        var _a;
-        if (autoStart) {
-            (_a = countdownRef.current) === null || _a === void 0 ? void 0 : _a.start();
-        }
-        return function () {
-            var _a;
-            (_a = countdownRef.current) === null || _a === void 0 ? void 0 : _a.pause();
-            countdownRef.current = null;
-        };
-    }, []);
-    rcHooks.useUpdateEffect(function () {
-        var _a;
-        (_a = countdownRef.current) === null || _a === void 0 ? void 0 : _a.updateOptions({ time: time, interval: interval });
-    }, [time, interval]);
-    return React.createElement("span", tslib.__assign({}, restProps), timeState);
-});
-CountDown.displayName = 'CountDown';
-
-module.exports = CountDown;

New alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Improved metrics

Dev dependency count

27

-18.18%

Lines of code

134

2.29%

Worsened metrics

Total package byte prevSize

11581

-0.14%

Number of medium supply chain risk alerts

1

Infinity%

Dependency changes

• Updated

  countdown-pro@^2.2.1

• Updated

  rc-hooks@^3.0.16

• Updated

  tslib@^2.8.1