react-clock - npm Package Compare versions

Comparing version 4.1.0 to 4.2.0

dist/cjs/Clock.d.ts

@@ -5,5 +5,5 @@ import React from 'react';
 import { isHandWidth } from './shared/propTypes';
-import type { HandLength, HandWidth, MarkLength, MarkWidth, OppositeHandLength } from './shared/types';
+import type { ClassName, HandLength, HandWidth, MarkLength, MarkWidth, OppositeHandLength } from './shared/types';
 type ClockProps = {
-    className?: string;
+    className?: ClassName;
     formatHour?: typeof defaultFormatHour;
@@ -30,3 +30,3 @@ hourHandLength?: HandLength;
     size?: React.CSSProperties['width'];
-    value?: string | Date;
+    value?: string | Date | null;
 };
@@ -33,0 +33,0 @@ declare function Clock({ className, formatHour, hourHandLength, hourHandOppositeLength, hourHandWidth, hourMarksLength, hourMarksWidth, locale, minuteHandLength, minuteHandOppositeLength, minuteHandWidth, minuteMarksLength, minuteMarksWidth, renderHourMarks, renderMinuteHand, renderMinuteMarks, renderNumbers, renderSecondHand, secondHandLength, secondHandOppositeLength, secondHandWidth, size, value, }: ClockProps): JSX.Element;

dist/cjs/Clock.js

@@ -66,3 +66,3 @@ "use strict";
     }
-    return (react_1.default.createElement("time", { className: (0, clsx_1.default)('react-clock', className), dateTime: value instanceof Date ? value.toISOString() : value, style: {
+    return (react_1.default.createElement("time", { className: (0, clsx_1.default)('react-clock', className), dateTime: value instanceof Date ? value.toISOString() : value || undefined, style: {
             width: size,
@@ -69,0 +69,0 @@ height: size,

dist/cjs/HourMark.js

@@ -34,3 +34,3 @@ "use strict";
     var _b = _a.formatHour, formatHour = _b === void 0 ? hourFormatter_1.formatHour : _b, locale = _a.locale, number = _a.number, otherProps = __rest(_a, ["formatHour", "locale", "number"]);
-    return react_1.default.createElement(Mark_1.default, __assign({ number: number && formatHour(locale, number) }, otherProps));
+    return react_1.default.createElement(Mark_1.default, __assign({ number: number ? formatHour(locale, number) : null }, otherProps));
 }
@@ -37,0 +37,0 @@ exports.default = HourMark;

dist/cjs/index.d.ts

 import Clock from './Clock';
+export { Clock };
 export default Clock;

dist/cjs/index.js

@@ -6,3 +6,5 @@ "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.Clock = void 0;
 var Clock_1 = __importDefault(require("./Clock"));
+exports.Clock = Clock_1.default;
 exports.default = Clock_1.default;

dist/cjs/Mark.js

@@ -19,6 +19,6 @@ "use strict";
             } }),
-        number && (react_1.default.createElement("div", { className: "react-clock__mark__number", style: {
+        number ? (react_1.default.createElement("div", { className: "react-clock__mark__number", style: {
                 transform: "rotate(-".concat(angle, "deg)"),
                 top: "".concat(length / 2, "%"),
-            } }, number))));
+            } }, number)) : null));
 }
@@ -25,0 +25,0 @@ exports.default = Mark;

dist/cjs/shared/hourFormatter.d.ts

@@ -1,1 +0,1 @@
-export declare const formatHour: (locale: string | undefined, hour: number) => string;
+export declare function formatHour(locale: string | undefined, hour: number): string;

dist/cjs/shared/hourFormatter.js

@@ -8,5 +8,5 @@ "use strict";
 var get_user_locale_1 = __importDefault(require("get-user-locale"));
-var formatHour = function (locale, hour) {
-    return hour.toLocaleString(locale || (0, get_user_locale_1.default)());
-};
+function formatHour(locale, hour) {
+    return hour.toLocaleString(locale || (0, get_user_locale_1.default)() || undefined);
+}
 exports.formatHour = formatHour;

dist/cjs/shared/types.d.ts

 type Enumerate<N extends number, Acc extends number[] = []> = Acc['length'] extends N ? Acc[number] : Enumerate<N, [...Acc, Acc['length']]>;
 type Range<F extends number, T extends number> = Exclude<Enumerate<T>, Enumerate<F>> | T;
+export type ClassName = string | null | undefined | (string | null | undefined)[];
 export type GreaterThanOrEqualTo<F extends number> = Range<F, 999>;
@@ -4,0 +5,0 @@ export type HandLength = Range<0, 100>;

dist/esm/Clock.d.ts

@@ -5,5 +5,5 @@ import React from 'react';
 import { isHandWidth } from './shared/propTypes';
-import type { HandLength, HandWidth, MarkLength, MarkWidth, OppositeHandLength } from './shared/types';
+import type { ClassName, HandLength, HandWidth, MarkLength, MarkWidth, OppositeHandLength } from './shared/types';
 type ClockProps = {
-    className?: string;
+    className?: ClassName;
     formatHour?: typeof defaultFormatHour;
@@ -30,3 +30,3 @@ hourHandLength?: HandLength;
     size?: React.CSSProperties['width'];
-    value?: string | Date;
+    value?: string | Date | null;
 };
@@ -33,0 +33,0 @@ declare function Clock({ className, formatHour, hourHandLength, hourHandOppositeLength, hourHandWidth, hourMarksLength, hourMarksWidth, locale, minuteHandLength, minuteHandOppositeLength, minuteHandWidth, minuteMarksLength, minuteMarksWidth, renderHourMarks, renderMinuteHand, renderMinuteMarks, renderNumbers, renderSecondHand, secondHandLength, secondHandOppositeLength, secondHandWidth, size, value, }: ClockProps): JSX.Element;

dist/esm/Clock.js

@@ -61,3 +61,3 @@ import React from 'react';
     }
-    return (React.createElement("time", { className: clsx('react-clock', className), dateTime: value instanceof Date ? value.toISOString() : value, style: {
+    return (React.createElement("time", { className: clsx('react-clock', className), dateTime: value instanceof Date ? value.toISOString() : value || undefined, style: {
             width: size,
@@ -64,0 +64,0 @@ height: size,

dist/esm/HourMark.js

@@ -29,3 +29,3 @@ var __assign = (this && this.__assign) || function () {
     var _b = _a.formatHour, formatHour = _b === void 0 ? defaultFormatHour : _b, locale = _a.locale, number = _a.number, otherProps = __rest(_a, ["formatHour", "locale", "number"]);
-    return React.createElement(Mark, __assign({ number: number && formatHour(locale, number) }, otherProps));
+    return React.createElement(Mark, __assign({ number: number ? formatHour(locale, number) : null }, otherProps));
 }
@@ -32,0 +32,0 @@ HourMark.propTypes = {

dist/esm/index.d.ts

 import Clock from './Clock';
+export { Clock };
 export default Clock;

dist/esm/index.js

 import Clock from './Clock';
+export { Clock };
 export default Clock;

dist/esm/Mark.js

@@ -14,6 +14,6 @@ import React from 'react';
             } }),
-        number && (React.createElement("div", { className: "react-clock__mark__number", style: {
+        number ? (React.createElement("div", { className: "react-clock__mark__number", style: {
                 transform: "rotate(-".concat(angle, "deg)"),
                 top: "".concat(length / 2, "%"),
-            } }, number))));
+            } }, number)) : null));
 }
@@ -20,0 +20,0 @@ Mark.propTypes = {

dist/esm/shared/hourFormatter.d.ts

@@ -1,1 +0,1 @@
-export declare const formatHour: (locale: string | undefined, hour: number) => string;
+export declare function formatHour(locale: string | undefined, hour: number): string;

dist/esm/shared/hourFormatter.js

 import getUserLocale from 'get-user-locale';
-export var formatHour = function (locale, hour) {
-    return hour.toLocaleString(locale || getUserLocale());
-};
+export function formatHour(locale, hour) {
+    return hour.toLocaleString(locale || getUserLocale() || undefined);
+}

dist/esm/shared/types.d.ts

 type Enumerate<N extends number, Acc extends number[] = []> = Acc['length'] extends N ? Acc[number] : Enumerate<N, [...Acc, Acc['length']]>;
 type Range<F extends number, T extends number> = Exclude<Enumerate<T>, Enumerate<F>> | T;
+export type ClassName = string | null | undefined | (string | null | undefined)[];
 export type GreaterThanOrEqualTo<F extends number> = Range<F, 999>;
@@ -4,0 +5,0 @@ export type HandLength = Range<0, 100>;

package.json

 {
   "name": "react-clock",
-  "version": "4.1.0",
+  "version": "4.2.0",
   "description": "An analog clock for your React app.",
@@ -19,8 +19,8 @@ "main": "dist/cjs/index.js",
     "copy-styles": "node ./copy-styles.mjs",
-    "jest": "jest",
     "lint": "eslint . --ext .js,.jsx,.ts,.tsx",
     "prepack": "yarn clean && yarn build",
     "prettier": "prettier --check . --cache",
-    "test": "yarn lint && yarn tsc && yarn prettier && yarn jest",
-    "tsc": "tsc --noEmit"
+    "test": "yarn lint && yarn tsc && yarn prettier && yarn unit",
+    "tsc": "tsc --noEmit",
+    "unit": "vitest run"
   },
@@ -49,20 +49,12 @@ "keywords": [
     "clsx": "^1.2.1",
-    "get-user-locale": "^2.0.0",
+    "get-user-locale": "^2.2.1",
     "prop-types": "^15.6.0"
   },
   "devDependencies": {
-    "@babel/core": "^7.15.0",
-    "@babel/preset-env": "^7.15.0",
-    "@babel/preset-react": "^7.14.0",
-    "@babel/preset-typescript": "^7.18.6",
     "@testing-library/jest-dom": "^5.15.0",
-    "@testing-library/react": "^13.4.0",
-    "@types/jest": "^29.0.0",
-    "@typescript-eslint/eslint-plugin": "^5.41.0",
-    "@typescript-eslint/parser": "^5.44.0",
+    "@testing-library/react": "^14.0.0",
     "eslint": "^8.26.0",
-    "eslint-config-wojtekmaj": "^0.7.1",
+    "eslint-config-wojtekmaj": "^0.8.3",
     "husky": "^8.0.0",
-    "jest": "^29.0.0",
-    "jest-environment-jsdom": "^29.0.0",
+    "jsdom": "^21.1.0",
     "prettier": "^2.7.0",
@@ -73,3 +65,4 @@ "pretty-quick": "^3.1.0",
     "rimraf": "^3.0.0",
-    "typescript": "^4.9.4"
+    "typescript": "^5.0.2",
+    "vitest": "^0.29.2"
   },
@@ -80,5 +73,2 @@ "peerDependencies": {
   },
-  "resolutions": {
-    "semver@7.0.0": "^7.0.0"
-  },
   "files": [
@@ -85,0 +75,0 @@ "dist",

README.md

@@ -1,2 +0,2 @@
-[![npm](https://img.shields.io/npm/v/react-clock.svg)](https://www.npmjs.com/package/react-clock) ![downloads](https://img.shields.io/npm/dt/react-clock.svg) [![CI](https://github.com/wojtekmaj/react-clock/workflows/CI/badge.svg)](https://github.com/wojtekmaj/react-clock/actions) [![tested with jest](https://img.shields.io/badge/tested_with-jest-99424f.svg)](https://github.com/facebook/jest)
+[![npm](https://img.shields.io/npm/v/react-clock.svg)](https://www.npmjs.com/package/react-clock) ![downloads](https://img.shields.io/npm/dt/react-clock.svg) [![CI](https://github.com/wojtekmaj/react-clock/workflows/CI/badge.svg)](https://github.com/wojtekmaj/react-clock/actions)
 
@@ -3,0 +3,0 @@ # React-Clock

src/index.ts

 import Clock from './Clock';
 
+export { Clock };
+
 export default Clock;

src/shared/hourFormatter.ts

 import getUserLocale from 'get-user-locale';
 
-export const formatHour = (locale: string | undefined, hour: number) =>
-  hour.toLocaleString(locale || getUserLocale());
+export function formatHour(locale: string | undefined, hour: number) {
+  return hour.toLocaleString(locale || getUserLocale() || undefined);
+}

src/shared/types.ts

@@ -7,2 +7,4 @@ type Enumerate<N extends number, Acc extends number[] = []> = Acc['length'] extends N
 
+export type ClassName = string | null | undefined | (string | null | undefined)[];
+
 export type GreaterThanOrEqualTo<F extends number> = Range<F, 999>;
@@ -9,0 +11,0 @@

Fixed 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.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

80070

0.42%

Dev dependency count

13

-35%

Lines of code

1620

1%

Number of medium supply chain risk alerts

0

-100%

Dependency changes

• Updated

  get-user-locale@^2.2.1